// 百度地图API功能
map = new BMap.Map("allmap");
map.enableScrollWheelZoom(true); //开启鼠标滚轮缩放
map.centerAndZoom(new BMap.Point(121.554876, 29.81333), 15);
//ajax异步读取数组即可;
var data_info = [[121.564706, 29.809087, "地址:浙江省宁波市鄞州区钱湖南路1058号 \n 责任人:张三丰"],
[121.564534, 29.811688, "地址:浙江省宁波市鄞州区泰康中路226号"],
[121.561924, 29.813084, "地址:浙江省宁波市鄞州区天唯艺术酒店"],
[121.552353, 29.824462, "地址:鄞州区人民政府"]
];
var opts = {
width: 250, // 信息窗口宽度
height: 80, // 信息窗口高度
title: "垃圾分类箱体分布网点", // 信息窗口标题
enableMessage: true//设置允许信息窗发送短息
};
for (var i = 0; i < data_info.length; i++) {
var marker = new BMap.Marker(new BMap.Point(data_info[i][0], data_info[i][1])); // 创建标注
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); //开启信息窗口
}
百度地图多网点标注文字弹窗代码
原创
©著作权归作者所有:来自51CTO博客作者漏刻有时的原创作品,请联系作者获取转载授权,否则将追究法律责任
提问和评论都可以,用心的回复会被更多人看到
评论
发布评论
相关文章
-
百度云AI
在人工智能的浪潮中,人脸识别技术如同一颗璀璨的明珠,吸引着无数科技爱好者的目光。
百度云 java 人脸识别 -
百度地图多点标注实现
1.php创建json数据 2.js传入json数据 类似于这样的结构 js擅长处理json数据 3.处理地图
html json 控件 ico json数据 -
百度地图之标注聚会
俗话说站在巨人的肩膀上将事半功倍,在写android的百度地图标注物聚合
android git 百度地图 -
百度地图添加标注点
新建html可直接看到效果 :注意fox.gif的路径body, html,#allmap {w
地图 html Math javascript -
百度地图API示例之文本标注
代码 文本标注 效果可以进行多个标注
html javascript 地理位置 偏移量 百度地图api -
百度地图开发示例:位置标注,标注点弹框
一、申请百度地图开发者AK1.登录百度开放平台
百度地图开发示例:位置标注 标注点弹框 html git 百度地图 -
百度地图加载多块区域
百度地图加载多块区域1. 百度地图加载多块区域2. 百度地图多区域块点击事件冲突问题1. 百度地图加载多块区域这里使用的BMapGL 绘制多个区域块官方文档:
百度地图 多块区域点击问题 多区域块 html 数据