Vue使用高德地图来显示固定的城市

 1 init() { //地图-固定显示重庆市
 2                 let _this = this
 3                 _this.map = new AMap.Map("container", {
 4                     resizeEnable: true,
 5                     center: [107.983524, 30.026571],
 6                     zoom: 7,
 7                     mapStyle: "amap://styles/a2425e25c6fe2c4e890047477c3445ec",
 8                 })
 9                 new AMap.DistrictSearch({
10                     extensions: 'all',
11                     subdistrict: 0
12                 }).search('重庆市', function(status, result) {
13                     let outer = [
14                         new AMap.LngLat(-360, 90, true),
15                         new AMap.LngLat(-360, -90, true),
16                         new AMap.LngLat(360, -90, true),
17                         new AMap.LngLat(360, 90, true),
18                     ];
19                     let holes = result.districtList[0].boundaries
20                     let pathArray = [
21                         outer
22                     ];
23                     pathArray.push.apply(pathArray, holes)
24                     _this.polygon = new AMap.Polygon({
25                         pathL: pathArray,
26                         strokeColor: 'rgb(20,164,173)',
27                         strokeWeight: 4,
28                         strokeOpacity: 0.5,
29                         fillColor: '#081b39',
30                         fillOpacity: 1,
31                         strokeStyle: 'dashed',
32                         strokeDasharray: [10, 2, 10]
33                     });
34                     _this.polygon.setPath(pathArray);
35                     _this.map.add(_this.polygon);
36                 })
37             },  

  在method中写入该段代码,需先在data中定义map为null,polygon为一个空数组,然后将本段代码放在mounted中调用

  参考地址:https://blog.csdn.net/liujucai/article/details/100070540

posted @ 2020-10-10 17:53  yw3692582  阅读(1706)  评论(0编辑  收藏  举报