aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorAnton Tananaev <anton@traccar.org>2022-07-31 16:58:39 -0700
committerAnton Tananaev <anton@traccar.org>2022-07-31 16:58:39 -0700
commit194d0502b0c042c0f640cd8ab55da5efb86d14c9 (patch)
treed6b487380f6ad2cf0b109de92156fd08e39d2488
parenta2a8644deefc80c920b05e3bbb36efb60cfc88f8 (diff)
downloadtrackermap-web-194d0502b0c042c0f640cd8ab55da5efb86d14c9.tar.gz
trackermap-web-194d0502b0c042c0f640cd8ab55da5efb86d14c9.tar.bz2
trackermap-web-194d0502b0c042c0f640cd8ab55da5efb86d14c9.zip
Deselect on map click
-rw-r--r--modern/src/map/MapPositions.js10
-rw-r--r--modern/src/other/ReplayPage.js4
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(() => {