thallada/modmapper-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Allow double click zooms with setTimeout

Browse Source 
Still not perfect, but good enough for now.
This commit is contained in:
Tyler Hallada 2022-01-23 13:06:44 -05:00
parent c417222e2c
commit d6720da142
1 changed files with 89 additions and 78 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
components/Map.tsx
View File

@ -274,17 +274,22 @@ const Map: React.FC = () => {
map.current.addControl(new mapboxgl.NavigationControl()); map.current.addControl(new mapboxgl.NavigationControl());
}); });
let singleClickTimeout: NodeJS.Timeout | null = null;
map.current.on("click", "grid-layer", (e) => { map.current.on("click", "grid-layer", (e) => {
if (e.features && e.features[0]) { const features = e.features;
if (singleClickTimeout) return;
singleClickTimeout = setTimeout(() => {
singleClickTimeout = null;
if (features && features[0]) {
const cell: [number, number] = [ const cell: [number, number] = [
e.features[0].properties!.cellX, features[0].properties!.cellX,
e.features[0].properties!.cellY, features[0].properties!.cellY,
]; ];
map.current.removeFeatureState({ source: "grid-source" }); map.current.removeFeatureState({ source: "grid-source" });
map.current.setFeatureState( map.current.setFeatureState(
{ {
source: "grid-source", source: "grid-source",
id: e.features[0].id, id: features[0].id,
}, },
{ {
selected: true, selected: true,
@ -296,8 +301,8 @@ const Map: React.FC = () => {
var zoom = map.current.getZoom(); var zoom = map.current.getZoom();
var viewportNW = map.current.project([-180, 85.051129]); var viewportNW = map.current.project([-180, 85.051129]);
var cellSize = Math.pow(2, zoom + 2); var cellSize = Math.pow(2, zoom + 2);
const x = e.features[0].properties!.x; const x = features[0].properties!.x;
const y = e.features[0].properties!.y; const y = features[0].properties!.y;
let nw = map.current.unproject([ let nw = map.current.unproject([
x * cellSize + viewportNW.x, x * cellSize + viewportNW.x,
y * cellSize + viewportNW.y, y * cellSize + viewportNW.y,
@ -357,6 +362,12 @@ const Map: React.FC = () => {
}, },
}); });
} }
}, 150);
});
map.current.on("dblclick", "grid-layer", (e) => {
if (singleClickTimeout) clearTimeout(singleClickTimeout);
singleClickTimeout = null;
}); });
}, [setSelectedCell, data]); }, [setSelectedCell, data]);