关于百度地图自定义图标打点

想显示不同颜色的打点,那么就要用自己的图片来解决了。重要的地方就是打点的图片,已经加粗

var map;

var currentX, currentY;


var map;
var currentX, currentY;


function ininMap() {
map = new BMap.Map("container"); //创建一个地图实例,HTML容器包含地图  
var point = new BMap.Point(110.404, 39.915);
map.centerAndZoom(point, 10);
map.enableScrollWheelZoom();
map.addControl(new BMap.GeolocationControl()); // 定位控件   
var geolocation = new BMap.Geolocation(); //百度包装好的定位库  
geolocation.getCurrentPosition(function(r) {
if(this.getStatus() == BMAP_STATUS_SUCCESS) {
var mk = new BMap.Marker(r.point);
map.addOverlay(mk);
map.panTo(r.point);
currentX = r.point.lng;
currentY = r.point.lat;
console.log('您的位置:' + r.point.lng + ',' + r.point.lat);
addInfo();
} else {
alert('failed' + this.getStatus());
}
}, {
enableHighAccuracy: true
});
}
ininMap();
//为多个点添加窗口信息    
function addInfo() {
var data_info = [
[116.417854, 39.921988, "地址:北京市东城区王府井大街88号乐天银泰百货八层"],
[116.406605, 39.921585, "地址:北京市东城区东华门大街"],
[116.412222, 39.912345, "地址:北京市东城区正义路甲5号"],
[116.479128, 39.914908, "地址:北京市朝阳区建国路93号院万达广场A座新世界彩旋百货F1层"],
[currentX, currentY, "您处于:北京市海淀区马甸东路金澳国际公寓1111号"]
];
console.log(data_info.length + "/" + currentY + "/" + currentY);
var opts = {
width: 250, // 信息窗口宽度  
height: 80, // 信息窗口高度  
title: "位置信息", // 信息窗口标题  
enableMessage: true //设置允许信息窗发送短息  
};
for(var i = 0; i < data_info.length; i++) {
var myIcon = new BMap.Icon("fonts/jinggao.png", new BMap.Size(23, 25), {
offset: new BMap.Size(10, 25)
});
var marker = new BMap.Marker(new BMap.Point(data_info[i][0], data_info[i][1]), {
icon: myIcon
}); // 创建标注   
var content = data_info[i][2];
map.addOverlay(marker); // 将标注添加到地图中  
addClickHandler(content, marker);
}



function addClickHandler(content, marker) {
marker.addEventListener("click", function(e) {
openInfo(content, e)
});
}


function openInfo(content, e) {
var p = e.target;
var point = new BMap.Point(p.getPosition().lng, p.getPosition().lat);
var infoWindow = new BMap.InfoWindow(content, opts); // 创建信息窗口对象   
map.openInfoWindow(infoWindow, point); //开启信息窗口  
}
}
  • 2
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值