vue-cli 开发原生高德地图之只显示某个行政区地图

1,337 阅读1分钟

废话不多说上代码!!

 AMap.plugin(
        [
          "AMap.DistrictSearch",
        ],
        function() {
                    new AMap.DistrictSearch({
              extensions: "all",
              subdistrict: 0,
              level: "district"
            }).search("惠州市", function(status, result) {
              // 外多边形坐标数组和内多边形坐标数组

              var outer = [
                new AMap.LngLat(-360, 90, true),
                new AMap.LngLat(-360, -90, true),
                new AMap.LngLat(360, -90, true),
                new AMap.LngLat(360, 90, true)
              ];
              var holes = result.districtList[0].boundaries;

              var pathArray = [outer];
              pathArray.push.apply(pathArray, holes);
              var polygon = new AMap.Polygon({
                pathL: pathArray,
                //线条颜色,使用16进制颜色代码赋值。默认值为#006600
                strokeColor: "red",
                strokeWeight: 2,
                //轮廓线透明度,取值范围[0,1],0表示完全透明,1表示不透明。默认为0.9
                strokeOpacity: 1,
                //多边形填充颜色,使用16进制颜色代码赋值,如:#FFAA00
                fillColor: "#000",
                //多边形填充透明度,取值范围[0,1],0表示完全透明,1表示不透明。默认为0.9
                fillOpacity: 0.8,
                //轮廓线样式,实线:solid,虚线:dashed
                strokeStyle: "dashed",

                strokeDasharray: [10, 2, 10]
              });
              polygon.setPath(pathArray);
              that.map.add(polygon);
            });
        }
        )

我这里是只显示惠州地图可以自己配置/这是一个插件需要调用AMAP的plugin方法,看代码就完事儿很简单