• 百度地图 JS API 的实践总结


    在项目中常常会用到百度地图的JS API,以下内容是自己在实践过程中遇到问题的简要总结:

    如:已经创建了一个map实例,var map = new BMap.Map("allmap"),其中,"allmap"是节点id
    1.设置城市中心点

    • 在初始化地图中心点时,最好不要使用中文地址名称,而是使用坐标,像这样:
      map.centerAndZoom(new BMap.Point(116.404, 39.915), 11);
      否则可能出现设置使点显示在最佳视野的语句不起作用的情况。

    2.使所有标注点显示在最佳视野中

    • map.setViewport(pointsArray);
      其中:参数pointsArray是点(而不是覆盖物)的数组,点即通过new BMap.Point()语句实例得到的。
      例如,通过如下方式得到点的数组:
      var pointsArray = [];
      pointsArray.push(new BMap.Point(parseFloat(经度), parseFloat(纬度)));
      parseFloat是将其转换为浮点数

    3.页面dom元素与地图上面覆盖物的联动

    • 添加覆盖物,并创建数组存储覆盖物对象,再给dom节点添加鼠标移入移出事件,同时,通过索引来处理对应的覆盖物对象。(备注:当节点没有对应的坐标时,index就会无法正确对应)
      var marker = new BMap.Marker(new BMap.Point(parseFloat(经度), parseFloat(纬度)));
      var markerArray = [];
      markerArray.push(marker);
    $('#wrapper').off('mouseenter', 'a').on('mouseenter', 'a', function(ev) {
        var ind =  $(this).parents('tr').index();
        //设置点的弹跳动画
        pointsMarker[ind].setAnimation(BMAP_ANIMATION_BOUNCE);
    });
    $('#wrapper').on('mouseleave', 'a', function(ev) {
    	var ind = $(this).parents('tr').index();
    	//取消点的弹跳动画
    	pointsMarker[ind].setAnimation();
    });	
    
    • 其中,.off('mouseenter', 'a')是防止事件重复绑定,造成多次执行的情况。

    4.清空地图上面的所有覆盖物

    • 语句:map.clearOverlays();

    百度地图API链接:http://lbsyun.baidu.com/index.php?title=jspopular
    类参考(详细api):http://lbsyun.baidu.com/cms/jsapi/reference/jsapi_reference.html

  • 相关阅读:
    Educational Codeforces Round 126 (Rated for Div. 2)
    Google Code Jam 2022 Qualification Round
    Codeforces Round #780 (Div. 3)
    AtCoder Beginner Contest 247
    AtCoder Beginner Contest 245
    Google Code Jam 2022 Round1A
    AtCoder Beginner Contest 245 Ex Product Modulo 2
    Codeforces Round #781 (Div. 2)
    EXSIVM使用模板创建虚拟机报错
    Hadoop单机/伪分布式配置安装教程
  • 原文地址:https://www.cnblogs.com/chaoyueqi/p/9783070.html
Copyright © 2020-2023  润新知