在 mapbox zoomstart 和 zoomend 上触发的事件不一致

Question

我正在研究 mapbox js-gl，版本 1.7.0。我已将我页面上十字准线 div 的显示和隐藏与 zoomstart 和 zoomend 事件相关联。

map.on('zoomstart', function (e)
{
    $("#crosshairs-container").show();
    console.log("Zooming started...");
});

map.on('zoomend', function (e)
{
    $("#crosshairs-container").hide();
    console.log("Zooming finished...");
    var zoomLevel = map.getZoom();
    renderMap();
});

问题是：引用的 div 没有可靠且一致地出现和消失。

在桌面上 (Linux/Chrome): 鼠标滚轮是 dividual "incremental jumps"（大多数鼠标都有，如果不是全部的话） the daydays) 有时会注册为 zoomend 事件，有时不会。这意味着，有时缩放在鼠标滚轮 "wobble" 后完成 - 即使我仍在通过继续转动鼠标滚轮进行缩放。其他时候，当我继续转动鼠标滚轮时缩放会继续 - 这是我所期望的行为。

在移动设备上 (Android/Chrome): 类似的行为，但是，在这里，十字准线覆盖在放大（放大或缩小）时几乎完全消失。

我观察到，当在地图的同一部分（已经加载和添加图层）上多次放大和缩小（试图重现和观察这种行为）时，桌面似乎 "find its groove"，可以这么说。

我的问题是：因为我不太可能使用了错误的事件 - 我不认为这是一个编码问题 - 有没有其他人看到过这种行为？这是硬件问题吗，从某种意义上说，移动设备上的捏合缩放功能 "intermittently" 和 "incremental wobbles" 鼠标滚轮一样？那么，对于用户来说，看起来和感觉上是连续的，实际上，在幕后，许多 inidividually 触发的事件 "stitched together" ?

顺便说一句，拖动事件在桌面和移动设备上运行完美。

Answer 1

我通过从 dragstart 结束 dragend 事件切换到 movestart 和 moveend 事件解决了这个问题。这似乎避免了所有问题，包括必须去抖动或限制事件处理程序。感谢@Steve Bennett 的提示。

在 mapbox zoomstart 和 zoomend 上触发的事件不一致

Inconsistent event firing on mapbox zoomstart and zoomend

event-handling

zooming

mapbox-gl-js