高德地图开放平台行政区查询跳转链接https://lbs.amap.com/api/jsapi-v2/guide/services/district-search高德地图行政区边界查询官方演示https://lbs.amap.com/demo/jsapi-v2/example/district-search/draw-district-boundaries
export default {
data() {
return {
feld: [
[
[
123.435784,
41.848393
],
[
123.469704,
41.855683
],
[
123.431909,
41.835569
],
[
123.486417,
41.84349
]
],
[
[
123.355632,
41.855683
],
[
123.35597,
41.838587
],
[
123.392252,
41.861716
],
[
123.382127,
41.837581
]
]
]
}
}
methods: {
loadMap() {
AMapLoader.load({
key: ' 1451fsgsgg', // 申请好的Web端开发者Key,首次调用 load 时必填
version: '1.4.15', // 指定要加载的 JSAPI 的版本,缺省时默认为 1.4.15
plugins: [
'AMap.DistrictSearch',
'AMap.Geolocation',
'AMap.Autocomplete',
'AMap.PlaceSearch',
'AMap.Scale',
'AMap.OverView',
'AMap.ToolBar',
'AMap.MapType',
'AMap.PolyEditor',
'AMap.CircleEditor'
], // 需要使用的的插件列表,如比例尺'AMap.Scale'等
AMapUI: {
// 是否加载 AMapUI,缺省不加载
version: '1.1', // AMapUI 缺省 1.1
plugins: [] // 需要加载的 AMapUI ui插件
},
Loca: {
// 是否加载 Loca, 缺省不加载
version: '1.3.2' // Loca 版本,缺省 1.3.2
}
})
.then((AMap) => {
console.log(this.feId)
if (this.feId[0].length > 0) {
var map = new AMap.Map('container2', {
resizeEnable: true,
zoom: 10,
center: this.feId[0][0]
})
for (var x = 0; x < this.feId.length; x++) {
// 获取地区围栏多边形集合
var bounds = []
bounds.push(this.feId[x])
var polygons = []
console.log(bounds)
if (bounds) {
for (var i = 0, l = bounds.length; i < l; i++) {
// 生成行政区划polygon
var polygon = new AMap.Polygon({
// map: map,
strokeWeight: 1,
path: bounds[i],
fillOpacity: 0.7,
fillColor: '#CCF3FF',
strokeColor: '#CC66CC'
})
polygons.push(polygon)
}
}
map.add(polygons)
this.getTraceById(map)
// 地图自适应
map.setFitView()
}
}
})
.catch((e) => {
console.log(e)
})
}
}
}
效果图