百度地图获取行政区划svg格式

http://lbsyun.baidu.com/jsdemo.htm#c1_10

 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 5     <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
 6     <style type="text/css">
 7         body, html,#allmap {width: 100%;height: 100%;overflow: hidden;margin:0;font-family:"微软雅黑";}
 8     </style>
 9     <script type="text/javascript" src="//api.map.baidu.com/api?v=2.0&ak=您的密钥"></script>
10     <title>添加行政区划</title>
11 </head>
12 <body>
13     <div id="allmap"></div>
14 </body>
15 </html>
16 <script type="text/javascript">
17     // 百度地图API功能
18     var map = new BMap.Map("allmap");
19     map.centerAndZoom(new BMap.Point(116.403765, 39.914850), 5);
20     map.enableScrollWheelZoom();
21 
22     function getBoundary(){       
23     var bdary = new BMap.Boundary();
24     bdary.get("菏泽市", function(rs){       //获取行政区域
25         map.clearOverlays();        //清除地图覆盖物       
26         var count = rs.boundaries.length; //行政区域的点有多少个
27             console.log(rs.boundaries);
28         var content = rs.boundaries
29         var fileName = '济南市.txt'
30         var aLink = document.createElement('a');
31         var blob = new Blob([content]);
32         var evt = document.createEvent("HTMLEvents");
33             evt.initEvent("click", false, false);
34             aLink.download = fileName;
35             aLink.href = URL.createObjectURL(blob);
36             aLink.dispatchEvent(evt);
37             if (count === 0) {
38                 alert('未能获取当前输入行政区域');
39                 return ;
40             }
41         var pointArray = [];
42             for (var i = 0; i < count; i++) {
43                 var ply = new BMap.Polygon(rs.boundaries[i], {strokeWeight: 2, strokeColor: "#ff0000"}); //建立多边形覆盖物
44                 map.addOverlay(ply);  //添加覆盖物
45                 pointArray = pointArray.concat(ply.getPath());
46             }    
47         map.setViewport(pointArray);    //调整视野  
48         addlabel();               
49     });   
50 }
51 
52 
53     setTimeout(function(){
54         getBoundary();
55     }, 2000);
56 
57     function addlabel() {
58         var pointArray = [
59           new BMap.Point(121.716076,23.703799),
60           new BMap.Point(112.121885,14.570616),
61           new BMap.Point(123.776573,25.695422)];
62         var optsArray = [{},{},{}];
63         var labelArray = [];
64         var contentArray = [
65           "台湾是中国的!",
66           "南海是中国的!",
67           "钓鱼岛是中国的!"];
68         for(var i = 0;i < pointArray.length; i++) {
69           optsArray[i].position = pointArray[i];
70           labelArray[i] = new BMap.Label(contentArray[i],optsArray[i]);
71           labelArray[i].setStyle({
72             color : "red",
73             fontSize : "12px",
74                  height : "20px",
75                  lineHeight : "20px",
76                  fontFamily:"微软雅黑"
77              });
78           map.addOverlay(labelArray[i]);
79         }      
80     }
81 </script>

参考链接: https://juejin.im/post/5d031a7ef265da1bc64bbea7

猜你喜欢

转载自www.cnblogs.com/mablevi/p/12740731.html