Skip to content

Commit

Permalink
clean code
Browse files Browse the repository at this point in the history
  • Loading branch information
jamal-khey committed Mar 26, 2024
1 parent f3ec43b commit cc09c1c
Show file tree
Hide file tree
Showing 2 changed files with 14 additions and 104 deletions.
30 changes: 5 additions & 25 deletions demo/src/App.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -15,14 +15,10 @@ import {

import DemoMapEquipments from './map-viewer/demo-map-equipments';

// import sposdata from './map-viewer/data/spos.json';
import sposdata from './map-viewer/data/spos.json';
import lposdata from './map-viewer/data/lpos.json';
// import smapdata from './map-viewer/data/smap.json';
import smapdata from './map-viewer/data/smap.json';
import lmapdata from './map-viewer/data/lmap.json';
import {
generateSubstationsData,
generateSubstationPositions,
} from './map-viewer/data/data-gen';
import { addNadToDemo, addSldToDemo } from './diagram-viewers/add-diagrams';

function App() {
Expand Down Expand Up @@ -67,14 +63,10 @@ function App() {

//declare data to be displayed: coordinates and network data
const geoData = new GeoData(new Map(), new Map());
const nbSubstations = 20000;
const smapDataFake = generateSubstationsData(nbSubstations, 2);
console.log(smapDataFake);
const sposDataFake = generateSubstationPositions(nbSubstations);
geoData.setSubstationPositions(sposDataFake);
geoData.setSubstationPositions(sposdata);
geoData.setLinePositions(lposdata);

const mapEquipments = new DemoMapEquipments(smapDataFake, lmapdata);
const mapEquipments = new DemoMapEquipments(smapdata, lmapdata);

useEffect(() => {
const handleContextmenu = (e) => {
Expand All @@ -88,7 +80,6 @@ function App() {

const networkMapRef = useRef();
const filteredNominalVoltages = [380.0, 225.0, 110.0];
// const filteredNominalVoltages = [500];

return (
<div className="App">
Expand Down Expand Up @@ -139,22 +130,11 @@ function App() {
mapTheme={'dark'}
filteredNominalVoltages={filteredNominalVoltages}
onFeaturesChanged={() => {
networkMapRef.current.computeSelectedSubstation();
console.log(
'debug',
'Selected Substations: ',
networkMapRef.current.getSelectedSubstation()
.length
);
// networkMapRef.current.getSelectedVoltageLevel();
// console.log(
// 'debug',
// 'getSelectedLine',
// networkMapRef.current.getSelectedLines()

// getSelectedSubstation,
// getSelectedVoltageLevel,
// getSelectedLines,
// );
}}
/>
</div>
Expand Down
88 changes: 9 additions & 79 deletions src/components/network-map-viewer/network/network-map.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,13 +7,13 @@

import PropTypes from 'prop-types';
import React, {
forwardRef,
useCallback,
useEffect,
useImperativeHandle,
useMemo,
useRef,
useState,
useCallback,
forwardRef,
} from 'react';

import { Box, decomposeColor } from '@mui/system';
Expand All @@ -34,7 +34,6 @@ import { SubstationLayer } from './substation-layer';

import booleanPointInPolygon from '@turf/boolean-point-in-polygon';
// import { getBoundingRectangle } from './mapUtils.ts';

import mapboxgl from 'mapbox-gl';
import 'mapbox-gl/dist/mapbox-gl.css';
import maplibregl from 'maplibre-gl';
Expand Down Expand Up @@ -381,48 +380,6 @@ const NetworkMap = forwardRef((props, ref) => {
return isDragging ? 'grabbing' : cursorType;
}

// let geojsonData = {
// type: 'FeatureCollection',
// features: [
// {
// type: 'Feature',
// geometry: {
// type: 'Point',
// coordinates: [9.147230811929688, 45.202750610674286],
// },
// properties: {
// prop0: 'value0',
// },
// },
// {
// type: 'Feature',
// geometry: {
// type: 'Point',
// coordinates: [[9.112986755929825, 45.157098376229555]],
// },
// properties: {
// prop1: 'value1',
// },
// },
// ],
// };
// const mysource = {
// id: 'my-points-source',
// type: 'geojson',
// data: geojsonData,
// };
//
// const mylayer = {
// id: 'my-points-layer', // Unique ID for the layer
// type: 'circle', // Choose a layer type (e.g., circle, symbol, line)
// source: 'my-points-source', // Reference the data source
// paint: {
// // Customize the visual appearance of the points (circle in this example)
// 'circle-color': '#f8504e', // Adjust color as desired
// 'circle-radius': 5, // Set marker size
// 'circle-opacity': 0.7, // Adjust transparency
// },æ
// };
const layers = [];

if (readyToDisplaySubstations) {
Expand Down Expand Up @@ -562,7 +519,6 @@ const NetworkMap = forwardRef((props, ref) => {
}, [mapLib?.key]);

const [features, setFeatures] = useState({});
const [selectedSubstation, setSelectedSubstation] = useState([]);

useEffect(() => {
props.onFeaturesChanged(features);
Expand All @@ -576,41 +532,26 @@ const NetworkMap = forwardRef((props, ref) => {
}
return newFeatures;
});

// const bounds = getBoundingRectangle(
// e.features[0].geometry.coordinates[0]
// );
// https://docs.mapbox.com/help/tutorials/analysis-with-turf/
//
// const queriedDataSource = map.current.queryRenderedFeatures(
// 'my-points-source',
// {}
// );
// console.log('debug', 'queriedDataSource', queriedDataSource);
}, []);

const getPolygonFeatures = () => {
return features;
};
const getSelectedSubstation = () => {
const substations = getSubstationsInPolygone(
features,
props.mapEquipments,
props.geoData
);
return (
selectedSubstation.filter((substation) => {
substations.filter((substation) => {
return substation.voltageLevels.some((vl) => {
return props.filteredNominalVoltages.includes(vl.nominalV);
});
}) ?? []
);
};

const computeSelectedSubstation = () => {
const substations = getSubstationsInPolygone(
features,
props.mapEquipments,
props.geoData
);
setSelectedSubstation(substations);
};

const getSelectedVoltageLevel = () => {
const selectedVL = getVoltageLevelFromSubstation(
getSelectedSubstation()
Expand All @@ -620,17 +561,13 @@ const NetworkMap = forwardRef((props, ref) => {
});
};

function getLayerById(layers, layerId) {
return layers.find((layer) => layer.id === layerId);
}

function getSelectedLinesInPolygon(
network,
lines,
geoData,
polygonCoordinates
) {
const selectedLines = lines.filter((line) => {
return lines.filter((line) => {
try {
const linePos = geoData.getLinePositions(network, line);
if (!linePos) {
Expand All @@ -642,23 +579,18 @@ const NetworkMap = forwardRef((props, ref) => {
booleanPointInPolygon(linePos[1], polygonCoordinates)
);
} catch (error) {
console.error('debug', 'error', error);
return false;
}
});

return selectedLines;
}
const getSelectedLines = () => {
console.log('debug', 'layer', getLayerById(layers, LINE_LAYER_PREFIX));
//check if polygon is defined correctly
const firstPolygonFeatures = Object.values(features)[0];
const polygonCoordinates = firstPolygonFeatures?.geometry;
if (!polygonCoordinates || polygonCoordinates.coordinates < 3) {
return [];
}
//for each line, check if it is in the polygon

const selectedLines = getSelectedLinesInPolygon(
props.mapEquipments,
mapEquipmentsLines,
Expand All @@ -684,7 +616,6 @@ const NetworkMap = forwardRef((props, ref) => {

useImperativeHandle(ref, () => ({
getPolygonFeatures,
computeSelectedSubstation,
getSelectedSubstation,
getSelectedVoltageLevel,
getSelectedLines,
Expand Down Expand Up @@ -876,7 +807,6 @@ function getSubstationsInPolygone(features, mapEquipments, geoData) {
const pos = geoData.getSubstationPosition(substation.id);
return booleanPointInPolygon(pos, polygonCoordinates);
});
console.log('debug', 'filtredByPosistions', filtredByPosistions);
if (!filtredByPosistions) {
return [];
}
Expand Down

0 comments on commit cc09c1c

Please sign in to comment.