//创建和初始化地图函数:
var maps = $('.map-content'),
mapType = maps.eq(0).data('type');
function initGoogleMap() {
maps.each(function (index, el) {
var locations = [];
$(this)
.data('maps')
.map(function (val, index) {
locations.push({
company: val.company,
address: val.address,
lng: val.longitude,
lat: val.latitude,
});
});
// const labels = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';
const map = new google.maps.Map(document.getElementById(el.id), {
zoom: 5.6,
center: { lat: 36.363882, lng: 120.044922 },
});
// Add 5 markers to map at random locations.
// For each of these markers, give them a title with their index, and when
// they are clicked they should open an infowindow with text from a secret
// message.
for (let i = 0; i < locations.length; ++i) {
const marker = new google.maps.Marker({
position: locations[i],
map: map,
// label: labels[i % labels.length],
});
const contentString = '' + locations[i].company + '
Add: ' + locations[i].address;
attachSecretMessage(map, marker, contentString);
}
});
}
// Attaches an info window to a marker with the provided message. When the
// marker is clicked, the info window will open with the secret message.
function attachSecretMessage(elMap, marker, contentString) {
const infowindow = new google.maps.InfoWindow({
content: contentString,
});
marker.addListener('click', () => {
infowindow.open({
anchor: marker,
map: elMap,
shouldFocus: false,
});
});
}
// function initGoogleMap() {
// const map = new google.maps.Map(document.getElementById('dituContent'), {
// zoom: 5.6,
// center: { lat: 36.024, lng: 120.887 },
// });
// // Create an array of alphabetical characters used to label the markers.
// const labels = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';
// // Add some markers to the map.
// const markers = locations.map((location, i) => {
// return new google.maps.Marker({
// position: location,
// label: labels[i % labels.length],
// map: map,
// });
// });
// // Add a marker clusterer to manage the markers.
// new markerClusterer.MarkerClusterer({ map, markers });
// markers.map(function (val, index) {
// var contentString = 'sadadasdasd'
// var infowindow = new google.maps.InfoWindow({
// content: contentString,
// });
// // val.addListener('click', function () {
// // this.map.setZoom(10);
// // this.map.setCenter(val.getPosition());
// // infowindow.open(this.map, val);
// // });
// val.addListener("click", () => {
// infowindow.open({
// anchor: val,
// map,
// shouldFocus: false,
// });
// });
// });
// }
window.initBaiduMap = function () {
window.map = [];
maps.each(function (i, el) {
var _this = $(this);
// console.log(_this);
createMap(i, _this); //创建地图
setMapEvent(i); //设置地图事件
addMapControl(i); //向地图添加控件
addMarker(i, _this); //向地图中添加marker
});
};
//创建地图函数:
function createMap(index, el) {
var map = new BMap.Map(el.attr('id')); //在百度地图容器中创建一个地图
mapData = el.data('maps')[index];
// console.log(mapData);
var point = new BMap.Point(mapData.longitude, mapData.latitude); //定义一个中心点坐标
map.centerAndZoom(point, 10); //设定地图的中心点和坐标并将地图显示在地图容器中
window.map[index] = map; //将map变量存储在全局
}
//地图事件设置函数:
function setMapEvent(index) {
map[index].enableDragging(); //启用地图拖拽事件,默认启用(可不写)
map[index].enableScrollWheelZoom(); //启用地图滚轮放大缩小
map[index].enableDoubleClickZoom(); //启用鼠标双击放大,默认启用(可不写)
map[index].enableKeyboard(); //启用键盘上下左右键移动地图
}
//地图控件添加函数:
function addMapControl(index) {
//向地图中添加缩放控件
var ctrl_nav = new BMap.NavigationControl({
anchor: BMAP_ANCHOR_TOP_LEFT,
type: BMAP_NAVIGATION_CONTROL_LARGE,
});
map[index].addControl(ctrl_nav);
//向地图中添加比例尺控件
var ctrl_sca = new BMap.ScaleControl({
anchor: BMAP_ANCHOR_BOTTOM_LEFT,
});
map[index].addControl(ctrl_sca);
}
//创建marker
function addMarker(index, el) {
//标注点数组
var markerArr = [],
childMpsaData = el.data('maps'),
isOpen = childMpsaData.length > 1 ? false : true;
childMpsaData.map(function (val, index) {
markerArr.push({
title: val.company,
content: val.address,
point: val.longitude + '|' + val.latitude,
});
});
//创建InfoWindow
function createInfoWindow(i) {
var json = markerArr[i];
var iw = new BMap.InfoWindow("" + json.title + "