百度地图自带根据行政区划覆盖,只要使用api输入行政区划就可自动覆盖对应的行政区域,但是想要覆盖自定义的区域该方法就无法适应需求,百度地图JavaScript API中有一个创建多边形的方法,可使用此方法来自定义覆盖想要覆盖的地图范围。

代码如下:

JavaScript

var map = new BMap.Map("dituContent");//在百度地图容器中创建一个地图
var point = new BMap.Point(114.538116,37.171406);//定义一个中心点坐标
map.centerAndZoom(point,14);//设定地图的中心点和坐标并将地图显示在地图容器中
var polygon = new BMap.Polygon([
    new BMap.Point(114.560241,37.157213),
    new BMap.Point(114.515075,37.159716),
    new BMap.Point(114.513314,37.177947),
    new BMap.Point(114.539796,37.1818),
    new BMap.Point(114.560412,37.189721)
], {strokeColor:"blue", strokeWeight:1, strokeOpacity:0.0, fillOpacity: 0.0, fillColor: "#4F4B4B"});  //创建多边形
map.addOverlay(polygon);   //增加多边形

注:

  • strokeColor:"blue",      //边线颜色。  

  • strokeWeight: 1,        //边线的宽度,以像素为单位。  

  • strokeOpacity: 0.0,     //边线透明度,取值范围0 - 1。  

  • fillOpacity: 0.0,       //填充的透明度,取值范围0 - 1。  

  • fillColor:"#4F4B4B",        //填充颜色。当参数为空时,将没有填充效果。

效果如下:

百度地图api 自定义覆盖范围及背景颜色-第1张图片-爱制作

 

原文地址:https://izhizuo.cn/post/117.html

Logo

权威|前沿|技术|干货|国内首个API全生命周期开发者社区

更多推荐