高德地图标记省或市或区县,高亮显示当前区域
高德地图Api官网:https://lbs.amap.com/api/javascript-api/reference/search#m_AMap.DistrictSearch
1.使用DistrictSearch插件可以通过城市名或城市码查询到城市的区号、城市编码、中心点、边界、下辖区域等详细信息
// 加载DistrictSearch插件 aMap.plugin(["AMap.DistrictSearch"])
2.具体逻辑方法
DistrictSearch Option属性:
DistrictSearchOptions |
类型 |
说明 |
---|---|---|
|
|
关键字对应的行政区级别或商圈,可选值: country:国家 province:省/直辖市 city:市 district:区/县 biz_area:商圈 |
|
|
是否显示商圈,默认值true 可选为true/false,为了能够精准的定位到街道,特别是在快递、物流、送餐等场景下,强烈建议将此设置为false |
|
|
是否返回行政区边界坐标点 默认值:base,不返回行政区边界坐标点 取值:all,返回完整行政区边界坐标点 |
|
|
显示下级行政区级数(行政区级别包括:国家、省/直辖市、市、区/县4个级别),商圈为区/县下一级 可选值:0、1、2、3 0:不返回下级行政区 1:返回下一级行政区 2:返回下两级行政区 3:返回下三级行政区 默认值:1 |
// 绘制当前区域 name: 南京市 drawBounds(name) { const district = new AMap.DistrictSearch({ subdistrict: 0, //获取边界不需要返回下级行政区 extensions: "all", //返回行政区边界坐标组等具体信息 level: "district" //查询行政级别为县区 }); district.search(name, (state, res) => { this.mapInstance.remove(this.polygons); this.polygons = []; res.districtList[0].boundaries.forEach(q => { const polygon = new AMap.Polygon({ strokeWeight: 1, path: q, fillOpacity: 0.4, fillColor: "#143048", strokeColor: "#0A1A29" }); this.polygons.push(polygon); }); this.mapInstance.add(this.polygons); this.mapInstance.setFitView(this.polygons); // 自适应缩放比 }); }
记录进步!!!