漏刻有时百度地图API实战开发(1)华为手机无法使用addEventListener click 的兼容解决方案

  1. 漏刻有时百度地图API实战开发(1)华为手机无法使用addEventListener click 的兼容解决方案
  2. 漏刻有时百度地图API实战开发(2)文本标签显示和隐藏的切换开关
  3. 漏刻有时百度地图API实战开发(3)自动获取地图多边形中心点坐标
  4. 漏刻有时百度地图API实战开发(4)显示指定区域在移动端异常的解决方案
  5. 漏刻有时百度地图API实战开发(5)区域限制移动端鬼畜抖动的解决方案
  6. 漏刻有时百度地图API实战开发(6)多个标注覆盖层级导致不能响应点击的问题
  7. 漏刻有时百度地图API实战开发(7)JavaScript开源库几何运算判断点是否在多边形内(电子围栏)
  8. 漏刻有时百度地图API实战开发(8)圆形区域周边搜索地图监听事件(覆盖物重叠显示层级\图像标注监听事件、setZIndex和setTop方法)

现象

漏刻有时项目开发中的调用了百度地图API,在PC端、IOS和安卓机型测试都没有问题。但是使用华为手机部分型号时,前端在监听点击事件的时候是使用 map.addEventListener('click',function(){...}),无法触发。或

原理

通过监听touchstart和touchmove两个事件中,x1,y1和x2,y2的差值(绝对),如果大于10px那么认为是拖动,否则认为是点击。

监听方式

在JavaScript中,map.addEventListener用于在Map对象上添加事件监听器。使用各种类型的事件,比如点击(click)、鼠标悬停(mouseover)等。当在地图上点击时,会触发一个事件,然后调用提供的函数。这个函数接收一个事件对象,从中可以获取关于被点击地点的信息。

当然,也可以绑定其他的事件,比如mouseover、mouseout等,只需要将事件类型替换即可。

javascript 复制代码
    //地图监听事件
    map.addEventListener('click', function (e) {
        var targets = e.overlay;
        //清除覆盖物;
        map.clearOverlays();
        var x = e.point.lng;
        var y = e.point.lat;
        var newPoint = new BMap.Point(x, y);
    })

解决方案

javascript 复制代码
    /*安卓手机端监听无效事件 - Begin*/
    map.addEventListener("touchmove", function (e) {
        map.enableDragging();
    });
    map.addEventListener("touchend", function (e) {
        map.disableDragging();
    });
    map.disableDragging();
    map.enableScrollWheelZoom(true);
    /*安卓手机端监听无效事件 - End*/

参考链接:


@漏刻有时

相关推荐
2501_9247319915 分钟前
驾驶场景玩手机识别:陌讯行为特征融合算法误检率↓76% 实战解析
开发语言·人工智能·算法·目标检测·智能手机
zzc9211 天前
电脑手机热点方式通信(上)
5g·智能手机·ofdm·mimo·热点·基站·多径效应
菲路普科技2 天前
国产芯+单北斗防爆终端:W5-D防爆智能手机,助力工业安全通信升级
安全·智能手机
Digitally3 天前
如何将照片从 realme 手机传输到电脑?
智能手机·电脑
AORO20254 天前
国内好用的智能三防手机,适合户外、工业、公共安全等场景
网络·5g·智能手机·制造·信息与通信
开开心心就好4 天前
PDF转图片工具,一键转换高清无损
服务器·前端·智能手机·r语言·pdf·excel·batch
云手机掌柜4 天前
从0到500账号管理:亚矩阵云手机多开组队与虚拟定位实战指南
数据结构·线性代数·网络安全·容器·智能手机·矩阵·云计算
洁洁!5 天前
手机秒变PC主控台:ToDesk、AnyDesk、向日葵、网易UU手机远程控制对比
智能手机·远程工作·远程控制
Digitally9 天前
如何将荣耀手机的照片传输到 Mac
macos·智能手机
yzpyzp9 天前
Android 的16 KB内存页设备需要硬件支持吗,还是只需要手机升级到Android15系统就可以
android·智能手机