襄阳做网站,襄阳网站设计,襄阳网站开发,微信小程序开发,网站设计制作,专业建站公司

当前位置:

百度地图多个标记实现案例

常见问题

2074

文章来源(hbsjsd.cn)湖北高端网站定制开发公司-速建时代

var xy = [
  { x: 112.099915, y: 32.096532 },
  { x: 112.099915, y: 32.096532 },
  { x: 112.091255, y: 32.094483 }
];var name = [
  { name: "速建时代1", Info: "1襄阳市樊城区万洲大道中南市场B3栋27号
电话:1320-7250-969" },
  { name: "速建时代2", Info: "2襄阳市樊城区万洲大道中南市场B3栋27号
电话:1320-7250-969" },
  { name: "速建时代3", Info: "3襄阳市樊城区万洲大道中南市场B3栋27号
电话:1320-7250-969" }
];// 百度地图API功能 
console.log(this.xy[0])
var map = new BMap.Map("allmap"); // 创建Map实例 
map.centerAndZoom(new BMap.Point(this.xy[0].x, 
this.xy[0].y), 12); // 初始化地图,设置中心点坐标和地图级别 
map.enableScrollWheelZoom(true); //开启鼠标滚轮缩放var 
markers = [];var 
infoWindows = [];
for (var i = 0; i < xy.length; i++) { 
 var point = new BMap.Point(xy[i].x, xy[i].y);  
 var marker = new BMap.Marker(point);
  map.addOverlay(marker);

  markers.push(marker);
  infoWindows.push(new BMap.InfoWindow(name[i].Info, { width: 300, height: 80, title: name[i].name }));
}

markers.forEach(function(marker, index) {
  marker.addEventListener("click", function() {
    map.openInfoWindow(infoWindows[index], marker.getPosition());
  });
});

来源于:百度地图多个标记实现案例 (hbsjsd.cn)

[声明]原创不易,请转发者备注下文章来源(hbsjsd.cn)【速建时代】。

速建时代高端网站定制开发回到顶部
站内SEO关键词搜索