Allow double click zooms with setTimeout
Still not perfect, but good enough for now.
This commit is contained in:
parent
c417222e2c
commit
d6720da142
@ -274,17 +274,22 @@ const Map: React.FC = () => {
|
||||
map.current.addControl(new mapboxgl.NavigationControl());
|
||||
});
|
||||
|
||||
let singleClickTimeout: NodeJS.Timeout | null = null;
|
||||
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] = [
|
||||
e.features[0].properties!.cellX,
|
||||
e.features[0].properties!.cellY,
|
||||
features[0].properties!.cellX,
|
||||
features[0].properties!.cellY,
|
||||
];
|
||||
map.current.removeFeatureState({ source: "grid-source" });
|
||||
map.current.setFeatureState(
|
||||
{
|
||||
source: "grid-source",
|
||||
id: e.features[0].id,
|
||||
id: features[0].id,
|
||||
},
|
||||
{
|
||||
selected: true,
|
||||
@ -296,8 +301,8 @@ const Map: React.FC = () => {
|
||||
var zoom = map.current.getZoom();
|
||||
var viewportNW = map.current.project([-180, 85.051129]);
|
||||
var cellSize = Math.pow(2, zoom + 2);
|
||||
const x = e.features[0].properties!.x;
|
||||
const y = e.features[0].properties!.y;
|
||||
const x = features[0].properties!.x;
|
||||
const y = features[0].properties!.y;
|
||||
let nw = map.current.unproject([
|
||||
x * cellSize + viewportNW.x,
|
||||
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]);
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user