高德地图按行政区描边

1,官网

https://lbs.amap.com/api/javascript-api/reference/overlay#polyline

2,我的使用

先创建地图:

const Map = new AMap.Map(that.idHash, {
          mask: mask, //只显示包裹起来的区域
          resizeEnable: true, //是否监控地图容器尺寸变化
          showIndoorMap: false, //关闭室内地图
          center: [96.01909121185537, 35.874643454131984],
          viewMode: "3D",
          dragEnable: false, //初始状态下不可移动
          // pitch:5,
          zoom: 7,
          features: that.depFeatures, //初始色块模式下,不显示标注等信息
          mapStyle: "amap://styles/021981e1781074e215441507a954df4b" //设置地图的显示样式
        });

编写描边的代码:

    //所有行政区描边
    allborderLine(Map) {
      const that = this;
      that.borderLine("海西蒙古族藏族自治州", Map);
      that.borderLine("海东市", Map);
      that.borderLine("海南藏族自治州", Map);
      that.borderLine("海北藏族自治州", Map);
      that.borderLine("果洛藏族自治州", Map);
      // that.borderLine('黄南藏族自治州',Map)//黄南中间有块地皮是海南自治区的,不能描边,采用省描边加邻区描边来作为它的边
      that.borderLine("玉树藏族自治州", Map);
      that.borderLine("西宁市", Map);
    },
    //行政区描边的功能
    borderLine(city, Map) {
      const opts = {
        subdistrict: 0,
        extensions: "all",
        level: "city"
      };
      //直接通过经纬度构建mask路径
      // eslint-disable-next-line no-undef
      const district = new AMap.DistrictSearch(opts);
      district.search(city, function(status, result) {
        const bounds = result.districtList[0].boundaries;
        //添加描边
        for (let i = 0; i < bounds.length; i += 1) {
          // eslint-disable-next-line no-undef
          new AMap.Polyline({
            path: bounds[i],
            strokeColor: "#1a77aa",
            strokeWeight: 10,
            strokeOpacity: 0.9,
            map: Map
          });
        }
      });
    },

在地图上描边:

//按行政区描边
        that.allborderLine(Map);
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值