百度地图添加多个标注点

it2025-07-21  11

<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> <style type="text/css"> body, html,#allmap {width: 100%;height: 100%;overflow: hidden;margin:0;font-family:"微软雅黑";} #l-map{height:100%;width:78%;float:left;border-right:2px solid #bcbcbc;} #r-result{height:100%;width:20%;float:left;} </style> <script type="text/javascript" src="//api.map.baidu.com/api?v=2.0&ak=您的密钥"></script> <title>添加多个标注点</title> </head> <body> <div id="allmap"></div> </body> </html> <script type="text/javascript"> // 百度地图API功能 var map = new BMap.Map("allmap"); map.enableScrollWheelZoom(true); //开启鼠标滚轮缩放 var point = new BMap.Point(116.362517, 39.974772); var point1 = new BMap.Point(116.338338, 39.895137); var point2 = new BMap.Point(116.372576, 39.889565); map.centerAndZoom(point1, 13); // 编写自定义函数,创建标注 function addMarker(point){ var marker = new BMap.Marker(point); map.addOverlay(marker); var opts = { width : 200, // 信息窗口宽度 height: 100, // 信息窗口高度 title : "国家知识产权局" , // 信息窗口标题 enableMessage:true,//设置允许信息窗发送短息 } var infoWindow = new BMap.InfoWindow("地址:北京市海淀区西土城路六号", opts); // 创建信息窗口对象 map.openInfoWindow(infoWindow,point); //开启信息窗口 marker.addEventListener("click", function(){ map.openInfoWindow(infoWindow,point); //开启信息窗口 }); } function addMarker1(point1){ var marker1 = new BMap.Marker(point1); map.addOverlay(marker1); var opts1 = { width : 200, // 信息窗口宽度 height: 100, // 信息窗口高度 title : "北京远见国际公寓" , // 信息窗口标题 enableMessage:true,//设置允许信息窗发送短息 } var infoWindow1 = new BMap.InfoWindow("地址:北京市西城区广安门外大街182号", opts1); // 创建信息窗口对象 map.openInfoWindow(infoWindow1,point1); //开启信息窗口 marker1.addEventListener("click", function(){ map.openInfoWindow(infoWindow1,point1); //开启信息窗口 }); } function addMarker2(point2){ var marker2 = new BMap.Marker(point2); map.addOverlay(marker2); var opts2 = { width : 200, // 信息窗口宽度 height: 100, // 信息窗口高度 title : "中国商标大楼" , // 信息窗口标题 enableMessage:true,//设置允许信息窗发送短息 } var infoWindow2 = new BMap.InfoWindow("地址:北京市西城区茶马南街1号", opts2); // 创建信息窗口对象 map.openInfoWindow(infoWindow2,point2); //开启信息窗口 marker2.addEventListener("click", function(){ map.openInfoWindow(infoWindow2,point2); //开启信息窗口 }); } // 随机向地图添加25个标注 addMarker(point); addMarker1(point1) addMarker2(point2) </script>
最新回复(0)