1.获取对应城市的坐标点
AMap.Geocoder
的getLocation
方法用于实现正向地理编码,例如获得某个城市或者城市的区域的坐标位置
2.绘制地图,再获取城市的区域范围
行政区查询服务(AMap.DistrictSearch
)提供行政区信息的查询,使用该服务可以获取到行政区域的区号、城市编码、中心点、边界、下辖区域等详细信息,为基于行政区域的地图功能提供支持。
3.绘制轮廓线 polygon
一个正方形outer+区域轮廓线holes
var geocoder = new AMap.Geocoder({})
var address = that.userInfo.adder
geocoder.getLocation(address, function (status, result) {
if (status === 'complete' && result.geocodes.length) {
that.centerLng = result.geocodes[0].location.lng
that.centerLat = result.geocodes[0].location.lat
console.log(that.centerLat)
let map = new AMap.Map('container', {
zoom: 10, //级别
center: [that.centerLng, that.centerLat], //中心点坐标
// center: [116.329519, 39.972134], //中心点坐标
// center: [that.lnglat], //中心点坐标
// viewMode: '3D', //使用3D视图
showIndoorMap: false,
viewMode: '3D',
resizeEnable: true // 调整任意窗口的大小,自适应窗口
})
that.map = map
new AMap.DistrictSearch({
extensions: 'all', // 返回边界坐标点
subdistrict: 0 // 显示下级行政区级数(行政区级别包括:国家、省/直辖市、市、区/县4个级别),商圈为区/县下一级 可选值:0、1、2、3
}).search(that.userInfo.adcode, 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
// console.log('holes', result.districtList[0].boundaries)
var pathArray = [outer]
pathArray.push.apply(pathArray, holes)
// console.log('pathArray', pathArray)
var polygon = new AMap.Polygon({
path: pathArray,
strokeColor: '#00eeff',
strokeWeight: 1, // 线宽
fillColor: '#71B3ff',
fillOpacity: 0.5
})
polygon.setPath(pathArray) // 多边形轮廓线的节点坐标数组。
that.map.add(polygon) // 添加覆盖物/图层
})
} else {
alert('error')
}