美文网首页
百度地图(添加删除覆盖物)

百度地图(添加删除覆盖物)

作者: 溺水的睫毛 | 来源:发表于2017-12-19 11:04 被阅读0次

    <style>

    body, html{width: 100%;height: 100%;margin:0;font-family:"微软雅黑";}

    #allmap{height:500px;width:100%;}

    #r-result{width:100%;}

    </style>

    <script  type="text/javascript"  src="http://api.map.baidu.com/api?v=2.0&ak=您的密钥"></script>

    <div id="allMap"></div>

    <div id="r-result">

    <input  type="button"  onclick="add_overlay();"value="添加覆盖物"/>

    <input  type="button"onclick="remove_overlay();" value="删除覆盖物"/>

    </div>

    <script>

    //百度API功能

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

    var point  = new  BMap.point(116.404,39.915);

    map.centerAndZoom(point,15);

    var  marker = newBMap.Marker(new BMap.point(116.404,39.915));

    //创建点

    var circle = new BMap.polyline([

    new BMa.point(116.399,39.910),

    new BMap.point(116.405,39.920),

    new BMap.point(116.425,39.900)

    ],{strokeColor:"biue",strokeweight:2,strokeOpacity:0.5});

    //创建折线

    var  circle = new  BMap.circle(point,500,{strokeColor:"blue", strokeweight:2, strokeOpatity:0.5}); //创建圆

    var polygon  =  new  BMap.polygon([

    new  BMap.point(116.387112,39.920977),

    new BMap.point(116.385243,39.913063),

    new Bmap.point(116.394226,39.917988),

    new BMap.point(116.41248,39.927893)

    ],{strokeColor:"biue",strokeweight:2,strokeopacity:0.5});

    //创建多边形

    var pStart= new  BMap.piont(116.392214,39.918985);

    var  pEnd  = new  BMap.point(1160.41478,39.911901);

    var  rectangle=new BMap.polygon([

       new BMap.point(pStart.lng,pStart.lat),

      new  BMap.point(pEnd.lng,pStart.lat),

      new  BMap.point(pEnd.lng,pEnd.lat),

      new BMa.point(pStart.lng,pEnd.lat)

    ],{strokeColor:"blue", strokeWeight:2, strokeOpacity:0.5});

    //创建矩形

    //添加覆盖物

    function add_overlay(){

    map.addOverlay(marker);       //增加点

    map.addOverlay(polyline);     //增加折线

    map.addOverlay(circle);         //增加圆

    map.addOverlay(polygon);        //增加多边形

    map.addOverlay(rectangle);     //增加矩形

    }

    //清除覆盖物

    functionremove_overlay(){

    map.clearOverlays();

    }

    </script>

    相关文章

      网友评论

          本文标题:百度地图(添加删除覆盖物)

          本文链接:https://www.haomeiwen.com/subject/jljkwxtx.html