我在 JavaScript Accordion UI 中有一个 Google map ,它在传递的纬度/经度中放置了一个大头针,并在该大头针上“居中”。
对于第一张 map ,它有效。当您单击其他两个中的任何一个时,它似乎将图钉(的底部)放在 map 的左上角。正如您在我的代码中所见,我已经在调用 resize
。
这是一个演示问题的 fiddle :http://jsfiddle.net/myingling/1c4bjsff/2/
我确定这很简单,但我错过了什么?
最佳答案
您需要保存每个 map 的中心,然后在新的 Accordion 被激活后设置它(并且该 map 有一个大小,本地图/ Accordion 被隐藏时,它的计算大小为零,所以标记是在 div 的左上角居中)。
一个选项:
var maps = [];
jQuery("#accordion").accordion({
change: function(event, ui) {
for (var i = 0; i < maps.length; i++) {
google.maps.event.trigger(maps[i], 'resize');
maps[i].setCenter(maps[i]._center);
}
}
}).find('.map').each(function(i, o) {
var latLong = new google.maps.LatLng(
jQuery(this).data("lat"), jQuery(this).data("long"));
var map = new google.maps.Map(o, {
zoom: 12,
mapTypeId: google.maps.MapTypeId.ROAD,
center: latLong
});
maps.push(map);
var marker = new google.maps.Marker({
position: latLong,
map: map,
title: jQuery(this).data('time')
});
google.maps.event.trigger(map, 'resize');
map.setCenter(latLong);
map._center = latLong;
jQuery(o).data('map', map);
});
关于javascript - 扩展 jQuery UI Accordion 后,谷歌地图不再以其他 map 为中心,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44257349/