Я пытаюсь настроить Карты Google, используя код JS API Карт Google v3.У меня есть несколько вкладок, которые при нажатии открывают страницу содержимого AJAXed без перезагрузки исходной страницы.Каждый контент с вкладками содержит карту.Ниже приведен пример того, как у меня есть настройки карты.Обратите внимание, что элемент списка здесь является лишь примером, каждая вкладка содержит множество элементов, которые находятся в разных местах.
<script type="text/javascript">
var locations = new Array();
</script>
<div id="googlemap"><div>Loading..</div></div>
<ul>
<li>#1 - My Place, Euless, TX
<script type="text/javascript">
locations.push(['#1 - My Place','Euless, TX']);
</script>
</li>
<li>#2 - My Other Place, Dallas, TX
<script type="text/javascript">
locations.push(['#2 - My Other Place','Dallas, TX']);
</script>
</li>
</ul>
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery('#googlemap div').remove();
if(locations.length>0)
{
var map = new google.maps.Map(document.getElementById('googlemap'), {
zoom: 3,
center: new google.maps.LatLng(38.065392,-97.382812),
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var infowindow = new google.maps.InfoWindow();
var marker, i;
for (i=0;i<locations.length;i++) {
var thelocation = locations[i];
jQuery.ajax({
dataType: 'jsonp',
url: 'http://maps.google.com/maps/geo?output=json&oe=utf8&sensor=false&key=BLAHBLAH&q='+thelocation[1],
cache: false,
success: function(data){
if(data.Status.code==200)
{
marker = new google.maps.Marker({
position: new google.maps.LatLng(data.Placemark[0].Point.coordinates[1],data.Placemark[0].Point.coordinates[0]),
map: map
});
google.maps.event.addListener(marker, 'click', (function(marker, i) {
return function() {
infowindow.setContent(thelocation[0]);
infowindow.open(map, marker);
}
})(marker, i));
}
}
});
}
}
});
</script>
В настоящее время у меня много проблем с уничтожением предыдущей карты и загрузкой вновый.При загрузке содержимого с вкладками элемент карты отображается смещенным вверх и влево.Пользовательский интерфейс Google Maps по-прежнему отображается в правильных местах, но само содержимое карты перемещается вверх / влево.При перетаскивании карты она немного перемещается до определенной точки, и в этот момент видимая область обрезается вокруг этой же области обзора.Кто-нибудь может мне помочь с загрузкой новых карт через AJAX?