diff --git a/client/src/components/map.tsx b/client/src/components/map.tsx index 56f2a42e..6b197b38 100644 --- a/client/src/components/map.tsx +++ b/client/src/components/map.tsx @@ -15,8 +15,8 @@ import MVT from 'ol/format/MVT.js'; import {Fill, Style} from 'ol/style.js'; import XYZ from 'ol/source/XYZ'; import * as d3 from 'd3'; -import {transform} from 'ol/proj'; -import {toStringXY} from 'ol/coordinate'; +// import {transform} from 'ol/proj'; +// import {toStringXY} from 'ol/coordinate'; import Overlay from 'ol/Overlay'; @@ -32,7 +32,7 @@ const MapWrapper = ({features}: IMapWrapperProps) => { const [featuresLayer, setFeaturesLayer] = useState(); const [selectedFeature, setSelectedFeature] = useState(); const [hoveredFeature, setHoveredFeature] = useState(); - const [selectedCoord, setSelectedCoord] = useState(); + // const [selectedCoord, setSelectedCoord] = useState(); const mapElement = useRef() as React.MutableRefObject; @@ -156,10 +156,10 @@ const MapWrapper = ({features}: IMapWrapperProps) => { const clickedCoord = mapRef.current.getCoordinateFromPixel(event.pixel); // transform coord to EPSG 4326 standard Lat Long - const transformedCoord = transform(clickedCoord, 'EPSG:3857', 'EPSG:4326'); + // const transformedCoord = transform(clickedCoord, 'EPSG:3857', 'EPSG:4326'); // set React state - setSelectedCoord( transformedCoord ); + // setSelectedCoord( transformedCoord ); mapRef.current.forEachFeatureAtPixel(event.pixel, (feature) => { setSelectedFeature(feature); return true; @@ -188,13 +188,13 @@ const MapWrapper = ({features}: IMapWrapperProps) => {

{ (hoveredFeature) ? readablePercent(hoveredFeature.properties_['score_a_percentile']) : '' }

-

{ (selectedCoord) ? toStringXY(selectedCoord, 5) : '' }

+ {/*

{ (selectedCoord) ? toStringXY(selectedCoord, 5) : '' }

*/}
{ (selectedFeature) ?
-

JustProgress Score:

+

Cumulative Index Score:

{readablePercent(selectedFeature.properties_['score_a_percentile'])}

: '' }