使用高德地图创建区域掩模,参考高德地图api,效果如下:
不难发现绘制的地图自带了默认的颜色和背景图,如图:
需求为需要透出父元素中的背景图,那么就需要将绘制高德地图节点和canvas的背景去除。
1、可通过直接设置CSS去除类名 amap-container 的背景图;
.amap-container {background-image: none;
}
2、通过配置AMap属性,可去除高德地图绘制节点的背景色;
const map = new AMap.Map('map-contain', {...// 修改区域掩模canvas的背景backgroundColor: 'transparent',
});
以上。