diff options
Diffstat (limited to 'modern')
-rw-r--r-- | modern/src/map/MapPositions.js | 10 | ||||
-rw-r--r-- | modern/src/other/ReplayPage.js | 4 |
2 files changed, 13 insertions, 1 deletions
diff --git a/modern/src/map/MapPositions.js b/modern/src/map/MapPositions.js index 847b231a..1cf8e0b8 100644 --- a/modern/src/map/MapPositions.js +++ b/modern/src/map/MapPositions.js @@ -29,7 +29,14 @@ const MapPositions = ({ positions, onClick, showStatus }) => { const onMouseEnter = () => map.getCanvas().style.cursor = 'pointer'; const onMouseLeave = () => map.getCanvas().style.cursor = ''; + const onMapClick = useCallback((event) => { + if (!event.defaultPrevented) { + onClick(); + } + }, [onClick]); + const onMarkerClick = useCallback((event) => { + event.preventDefault(); const feature = event.features[0]; if (onClick) { onClick(feature.properties.id, feature.properties.deviceId); @@ -37,6 +44,7 @@ const MapPositions = ({ positions, onClick, showStatus }) => { }, [onClick]); const onClusterClick = useCallback((event) => { + event.preventDefault(); const features = map.queryRenderedFeatures(event.point, { layers: [clusters], }); @@ -101,6 +109,7 @@ const MapPositions = ({ positions, onClick, showStatus }) => { map.on('mouseleave', clusters, onMouseLeave); map.on('click', id, onMarkerClick); map.on('click', clusters, onClusterClick); + map.on('click', onMapClick); return () => { map.off('mouseenter', id, onMouseEnter); @@ -109,6 +118,7 @@ const MapPositions = ({ positions, onClick, showStatus }) => { map.off('mouseleave', clusters, onMouseLeave); map.off('click', id, onMarkerClick); map.off('click', clusters, onClusterClick); + map.off('click', onMapClick); if (map.getLayer(id)) { map.removeLayer(id); diff --git a/modern/src/other/ReplayPage.js b/modern/src/other/ReplayPage.js index aaffc889..e49835d6 100644 --- a/modern/src/other/ReplayPage.js +++ b/modern/src/other/ReplayPage.js @@ -98,7 +98,9 @@ const ReplayPage = () => { }); const onClick = useCallback((positionId) => { - navigate(`/position/${positionId}`); + if (positionId) { + navigate(`/position/${positionId}`); + } }, [navigate]); useEffect(() => { |