如何使用 Leaflet.heat，鼠标 events/touch 事件，移动设备，如 iPad？

Question

我正在尝试使用 Mapbox/Leaflet 创建热图。这是我正常工作的确切示例：https://www.mapbox.com/mapbox.js/example/v1.0.0/leaflet-heat/

操作代码是这样的：

map.on({
    movestart: function () { draw = false; },
    moveend:   function () { draw = true; },
    mousemove: function (e) {
        if (draw) {
            heat.addLatLng(e.latlng);
        }
    }
})

但是，这不适用于触摸屏。我观看了这个视频以了解我需要更改的内容：https://www.youtube.com/watch?v=wwffqMAS8K8#t=100

一般来说，作为 JS 和网络应用程序的新手，我不确定如何使用本视频中 36:00 分钟左右解释的语法。他提供了一个函数，根据检测到的事件类型分叉 mouse/touch 不同的处理方式：

                var posX, posY;

                function positionHandler(e) {
                if ((e.clientX) && (e.clientY)) {
                    posX = e.clientX; posY = e.clientY;
                } else if (e.targetTouches) {
                    posX =  e.targetTouches[0].clientX;
                    posY = e.targetTouches[0].clientY;
                    e.preventDefault();
                    }
                }

我了解到这里我们定义了一个函数positionHandler，用来return鼠标或触摸事件在屏幕上的位置。但我不知道如何整合它并使其与上面的 Leaflet 语法一起工作。

我如何调整上面的示例以使其在桌面和触摸屏上都能工作？希望我已经在这里表明我已经尝试进行研究但是我'我卡住了。

Answer 1

这个问题的答案就在 Leaflet 的 API 中。您应该能够使用他们的一些事件处理程序来添加此功能。虽然我没有运气只是打开 iHandler map.tap.enable();我通过用 click 替换 mouseend 和用 dblclick 替换 mousemove 来重新配置它。

有关详细信息，请参阅此处的文档：http://leafletjs.com/reference.html#map-interaction-handlers

如何使用 Leaflet.heat，鼠标 events/touch 事件，移动设备，如 iPad？

How to use Leaflet.heat, mouse events/touch events, with mobile, like iPad?

javascript

jquery

ios

leaflet

mapbox