地图只显示部分区域,其他地区不显示
使用高德的多边形覆盖物实现
文档:https://lbs.amap.com/api/javascript-api/reference/overlay#polygon
页面引入js文件
<script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.15&key=你的key&plugin=AMap.DistrictSearch"></script>
然后使用
var map = new AMap.Map('map-my', { resizeEnable: true, zoom: 10, center: [121.72292, 31.08463], mapStyle: 'amap://styles/blue', //设置地图的显示样式 }); new AMap.DistrictSearch({ extensions: 'all', subdistrict: 0 }).search('浦东新区', 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 var pathArray = [ outer ]; pathArray.push.apply(pathArray, holes) var polygon = new AMap.Polygon({ pathL: pathArray, strokeColor: '#00eeff',//边框线颜色 strokeWeight: 1, fillColor: '#13305B',//遮罩图层颜色 fillOpacity: 0.9 }); polygon.setPath(pathArray); map.add(polygon) })
显示效果