获取后台数据在高德地图上画线

53 阅读 0 评论 35 点赞

我是靠谱客的博主深情盼望，最近开发中收集的这篇文章主要介绍获取后台数据在高德地图上画线，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

 1         var data =  Iphone.data; //从后台获取的所有数据
 2         var geocoder = new AMap.Geocoder(); //创建地图
 3         var cityArr = data.data.citys;   //获取城市名（一个数组）
 4         var lineArr =[];
 5         var obj = {};
 6         for(var i in cityArr) {
 7            //闭包渲染避免顺序错乱
 8             (function(index) {
 9                 geocoder.getLocation(cityArr[i], function(status, result) {
10                     if (status === 'complete' && result.info === 'OK') {
11                         wlggIphone.methods.geocoder_CallBack(result);
12                         lineArr.push(result.geocodes[0].location);
13                         obj[cityArr[index]] = result.geocodes[0].location;
14                         if(lineArr.length == cityArr.length) {
15                             var arrSolid = [];
16                             var arrDashed = [];
17                             for(var j in cityArr) {
18                                 if(j < (cityArr.length - 2)) {
19                                     arrSolid.push(obj[cityArr[j]]);
20                                 }else if(j == cityArr.length - 2) {
21                                     arrSolid.push(obj[cityArr[j]]);
22                                     arrDashed.push(obj[cityArr[j]]);
23                                 }else {
24                                     arrDashed.push(obj[cityArr[j]]);
25                                 }
26                             }
27                             var polyline = new AMap.Polyline({   
28                                 path: arrSolid,  
29                                 strokeColor:"#66C5FF",//线颜色
30                                 strokeOpacity:1,//线透明度  
31                                 strokeWeight:3,//线宽
32                                 strokeStyle:"solid"//线样式  
33                             });  
34                             polyline.setMap(map);
35                             var polyline1 = new AMap.Polyline({   
36                                 path: arrDashed,  
37                                 strokeColor:"#66C5FF",//线颜色
38                                 strokeOpacity:1,//线透明度  
39                                 strokeWeight:1,//线宽
40                                 strokeStyle:"dashed"//线样式  
41                             });  
42                             polyline1.setMap(map);
43                            
44                         } 
45                     }
46                 });
47             })(i)
48         }