在地图中显示临近景点

最新推荐文章于 2024-10-30 18:07:32 发布

a512977208

最新推荐文章于 2024-10-30 18:07:32 发布

阅读量293

点赞数

文章标签： java

原文链接：http://www.cnblogs.com/elaron/archive/2012/10/26/2740865.html

版权

昨天已经可以在页面中列出临近的景点及其相隔距离。

今天把这些景点及其距离在百度地图中标注出来。

1、百度Maker和Label覆盖物

“Marker：标注表示地图上的点，可自定义标注的图标。
Label：表示地图上的文本标注，您可以自定义标注的文本内容。"

根据百度API文档中的描述，选择Maker作为当前位置的标注，Label作为周围景点的标注（因为可以定义文本的内容，因此可以讲距离写到label上）

Marker的用法：

var map = new BMap.Map("position");
var point = new BMap.Point(${currentLocation.longitude}, ${currentLocation.latitude});
map.centerAndZoom(point, 19);
var marker = new BMap.Marker(point);
map.addOverlay(marker);

Label的用法：

var map = new BMap.Map("container");
var point = new BMap.Point(108.977055,34.217921); 
map.centerAndZoom(point, 17); 
var label1 = new BMap.Label("50m");
label1.setPosition(new BMap.Point(108.977055,34.217921));
label1.setOffset(new BMap.Size(-100,-20));
label1.setStyle({
backgroundColor:"#003366",
color:"white"
});
map.addOverlay(label1);