zoukankan      html  css  js  c++  java
  • H5页面,百度地图点击事件

    需求:用户点击地图的时候获取地址街道,编码等详细信息。

      然后看百度API文档,看到了click事件,关键时候还是需要看文档的。

     

    实现

    这样子虽然在浏览器的手机模拟器下是没有问题的

    但是放在机器上测试的时候就出现问题了,有时候点击不到,我一直以为是我手机的问题,然后我在代码的第一行加上了alert但是发现电脑上没问题,但是手机上不行,我用的是安卓,alert时有时无。然后就百度找了一下,https://www.jianshu.com/p/153cd2471576

    实例:

    var xArr = [];//存放横坐标
    var yArr = [];//存放纵坐标
    //点击事件获取地址信息start------------------------
    //手指触摸屏幕的时候清空两个数组
    map.addEventListener("touchstart", function(e){
    xArr.length = 0;
    yArr.length = 0;
    });
    //如果滑动了屏幕,xArr和yArr将各存入两个坐标值,即始末坐标值
    map.addEventListener("touchmove",function(e){
    xArr.push(e.targetTouches[0].pageX);
    yArr.push(e.targetTouches[0].pageY);
    });
    map.addEventListener('touchend',function(e){
    var far;
    var flag = true;
    //计算平移距离,区分滑动事件和点击事件
    if((xArr.length > 1) && (yArr.length > 1)){
    far = (Math.abs(xArr[0]-xArr[1]))^2 + (Math.abs(yArr[0]-yArr[1]))^2;
    if(far > 0){
    flag = false;
    }
    }
    if(flag){

    map.clearOverlays(); //清除地图上所有覆盖物
    map.centerAndZoom(new BMap.Point(e.point.lng, e.point.lat), 18);
    map.addOverlay(new BMap.Marker(new BMap.Point(e.point.lng, e.point.lat))); //添加标注
    var pt = e.point;
    gc.getLocation(pt, function(rs){
    lon=rs.point.lng;//经度
    lat=rs.point.lat;//纬度
    streetName = rs.addressComponents.street;//获取街道名称
    myValue=rs.address;
    $("#addrId").html(rs.address);//当前位置
    });
    }
    });
    //点击事件获取地址信息end------------------------

    这样就可以解决问题了

  • 相关阅读:
    【JAVA】日志管理slf4j
    【JAVA】从java线程来看java内存模型
    【数据结构】---栈和队列
    【数据结构】---链表
    C++ 第10章 反省程序与C++标准模板库
    回忆C++知识点(1)
    C++ 第8章 多态性
    C++ 第7章 继承与派生
    C++ 第6章 数组、指针、字符串
    C++ 第5章 数据的共享与保护
  • 原文地址:https://www.cnblogs.com/lkeji388/p/10018658.html
Copyright © 2011-2022 走看看