下图为使用百度地图jsapi生成的h7n9感染分布图示例,其中的数据来自新华网(4.8号),截图如下:
使用的功能列表如下:
1.自定义版权控件功能,即(1)对应的数据来源部分,代码如下:
复制代码 代码如下:
var cr = new bmap.copyrightcontrol({anchor: bmap_anchor_top_right});
map.addcontrol(cr); //添加版权控件
var bs = map.getbounds();
cr.addcopyright({id: 1, content: h7n9数据来源, bounds: bs});
2.获取行政边界功能,即(2)对应的四个省市边界,代码如下:
复制代码 代码如下:
var bdary = new bmap.boundary();//行政边界服务
var length=data.length;
for (var index=0;index{
(function(index){ //闭包用法
bdary.get(data[index].city, function(rs){ //获取行政区域
var count = rs.boundaries.length; //行政区域有几部分多边形组成
var bounds;
var center;
for(var i = 0; i ply = new bmap.polygon(rs.boundaries[i], {strokeweight: 2, strokecolor: data[index].color,fillcolor: data[index].color,fillopacity:0.8 }); //建立多边形覆盖物
if (!bounds)//取行政区域第一组成部分的中心点
{
center=ply.getbounds().getcenter();
}
map.addoverlay(ply); //添加行政边界
}
});
})(index);
}
3. 添加marker点和label,即(3,4)显示表示人的图片及感染人数的label:
复制代码 代码如下:
var myicon = new bmap.icon(infection.png, new bmap.size(27,60));
var marker1 = new bmap.marker(center,{icon:myicon}); // marker
map.addoverlay(marker1);
var label = new bmap.label(人数+data[index].infect,{offset:new bmap.size(-10,0)});//显示label
marker1.setlabel(label);
完整代码如下:
复制代码 代码如下:
h7n9分布图
done!