高德地图根据城市编码绘制边界

  • Post author:
  • Post category:其他


//加载地图
showditu2() {
  let left = this
  left.map = new AMap.Map("Map", {
    zoom: 13,//地图默认缩放比例
    zooms: [3, 20],//地图缩放比例范围
    center: [106.550388, 29.550649],//默认定位地址
    mapStyle: "amap://styles/darkblue",
    // showLabel: false,
  })
  //行政区划查询
  var opts = {
    subdistrict: 1,   //返回下一级行政区
    showbiz:false  //最后一级返回街道信息
  };
  let district = new AMap.DistrictSearch(opts);//注意:需要使用插件同步下发功能才能这样直接使用
  //说明  district 参数对象是由 第四步引用插件是创建
  district.setLevel("province"); //行政区级别
  district.setExtensions('all');
  //行政区查询
  //按照adcode进行查询可以保证数据返回的唯一性
  let cityCode = "610400";//注意这个参数必须是字符串,要不然显示不出来的
  district.search(cityCode, function (status, result) {
    if (status === 'complete') {
      // 绘制区域
      /**
       * 参数说明
       * result.districtList[0]- 数据要由官方同步获取,以免后边绘制地图参数发生变化,实例中由步奏                        5中获取到的result参数中传来
       */
      let polygons = [];//绘制区域面积图的数组
      var bounds = result.districtList[0].boundaries;
      if (bounds) {
        for (var i = 0, l = bounds.length; i < l; i++) {
          var polygon = new AMap.Polygon({
            map: left.map,
            strokeWeight: 1,
            strokeColor: '#0091ea',
            fillColor: '#80d8ff',
            fillOpacity: 0.2,
            path: bounds[i]
          });
          polygons.push(polygon);
        }
        left.map.setFitView();//地图自适应
      }
    }
  });
},



版权声明:本文为henghi原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。