相信很多小伙伴看官方文档会迷失自我,我这里就整理了三个小技巧

1.     如何动态加载百度地图而不用实时刷新就可以获取记录

function loadJScript() {

        var script = document.createElement("script");

        script.type = "text/javascript";

        script.src = "http://api.map.baidu.com/api?v=2.0&ak=你的百度地图AK &callback=init";

        document.body.appendChild(script);

    }

window.onload = loadJScript;  //异步加载地图,这一步很关键

2.     在百度地图上画一个圆圈,

    // 百度地图API功能

    var map = new BMap.Map("allmap");            // 创建Map实例

    var mPoint = new BMap.Point(经纬度);

    map.enableScrollWheelZoom();

    map.centerAndZoom(mPoint,13);  //让百度地图以你的输入的经纬度为中心,并展示在地图中

    map.addOverlay(new BMap.Marker(mPoint));

    var circle = new BMap.Circle(mPoint,范围 *1000,{fillColor:"blue", strokeWeight: 1 ,fillOpacity: 0.3, strokeOpacity: 0.3});

    map.addOverlay(circle);//这一步就是把圆圈添加到百度地图上

    circle.addEventListener("lineupdate", function (e) {

        console.log(circle.getRadius()); //返回圆形覆盖物的半径

    });

    // var local =  new BMap.LocalSearch(map, {renderOptions: {map: map, autoViewport: true}});

3.     百度经纬度获取

  var map = new BMap.Map("allmap");

            // 创建地址解析器实例

            var myGeo = new BMap.Geocoder();

            // 将地址解析结果显示在地图上,并调整地图视野

            myGeo.getPoint(经纬度, function(point){

                if (point) {

                    map.centerAndZoom(point, 16);

                    map.addOverlay(new BMap.Marker(point));

                    alert(point.lat + "," + point.lng+'|'+point.lat + "," + point.lng)

                }else{

                    alert("您选择地址没有解析到结果!");

                }

            }, $province.text());

4.     百度地图坐标拖动效果以及获取经纬度

            map.addEventListener("click",function(e){//设置监听点击事件

                var marker = new BMap.Marker(new BMap.Point(e.point.lng,e.point.lat));

                marker.enableDragging();

                marker.addEventListener("dragend", function(e){ //设置监听鼠标拖动事件

                    map.addOverlay(marker);

                    alert (e.point.lat + "," + e.point.lng+'|'+e.point.lat + "," + e.point.lng)

                })

                map.clearOverlays();//方式坐标多次标注到地图上

                map.addOverlay(marker);//拖动结束并添加标注到地图

            });

文章来源:制图网技术开发

奔跑的代码

制图网(www.makepic.net)，专业的logo免费设计在线生成网站，全自动智能化logo设计，商标设计，logo在线生成！

欢迎使用制图网制作属于您公司自己的logo，不仅专业而且经济实惠，全方位满足您公司品牌化、视觉化的需求。