howto: динамическое обновление маркеров с JSON на картах google

Я пытаюсь обновить местоположение маркера без обновления всей страницы. Я попытался использовать setTimeout(function() но мне не повезло ..

вот мой код, который у меня есть до сих пор ..

заранее спасибо

 function initialize() { var mapOptions = { center: new google.maps.LatLng(35.66, -80.50), zoom: 8, mapTypeId: google.maps.MapTypeId.ROADMAP }; var map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions); var json = (function () { var json = null; $.ajax({ 'async': false, 'global': false, 'url': "getjson.php", 'dataType': "json", 'success': function (data) { json = data; } }); return json;})(); for (var i = 0, length = json.length; i < length; i++) { var data = json[i], latLng = new google.maps.LatLng(data.lat, data.lng); var marker = new google.maps.Marker({ position: latLng, map: map, title: data.title }); } var infoWindow = new google.maps.InfoWindow(); google.maps.event.addListener(marker, "click", function(e) { infoWindow.setContent(data.description); infoWindow.open(map, marker); }); (function(marker, data) { google.maps.event.addListener(marker, "click", function(e) { infoWindow.setContent(data.description); infoWindow.open(map, marker); }); })(marker, data); } google.maps.event.addDomListener(window, 'load', initialize); 

вот мой вывод JSON.

 [{"lat":35.6606376,"lng":-80.5048653,"content":"bca"}, {"lat":42.6799504,"lng":-36.4949205,"content":"abc"}] 

Я бы предложил использовать setInterval, а не setTimeout.

Вот какой код, который имитирует обновление через JSON в скрипке , используя предоставленный JSON с добавленным членом «описание» для каждого маркера:

 var map = null; var gmarkers = []; var intervalNumber = 0; setInterval(function () { new Request.JSON({ url: '/echo/json/', data: { json: JSON.encode([{ "lat": 35.6606376 + (0.01 * intervalNumber), "lng": -80.5048653 + (0.1 * intervalNumber), "content": "bca", "description":"first marker" }, { "lat": 42.6799504 + (0.01 * intervalNumber), "lng": -36.4949205 - (0.1 * intervalNumber), "content": "abc", "description": "second marker" }]), delay: 3 }, onSuccess: function (response) { update_map(response); intervalNumber++; } }).send(); }, 5000); update_map = function (data) { var bounds = new google.maps.LatLngBounds(); // delete all existing markers first for (var i = 0; i < gmarkers.length; i++) { gmarkers[i].setMap(null); } gmarkers = []; // add new markers from the JSON data for (var i = 0, length = data.length; i < length; i++) { latLng = new google.maps.LatLng(data[i].lat, data[i].lng); bounds.extend(latLng); var marker = new google.maps.Marker({ position: latLng, map: map, title: data[i].title }); var infoWindow = new google.maps.InfoWindow(); google.maps.event.addListener(marker, "click", function (e) { infoWindow.setContent(data.description+"<br>"+marker.getPosition().toUrlValue(6)); infoWindow.open(map, marker); }); (function (marker, data) { google.maps.event.addListener(marker, "click", function (e) { infoWindow.setContent(data.description+"<br>"+marker.getPosition().toUrlValue(6)); infoWindow.open(map, marker); }); })(marker, data[i]); gmarkers.push(marker); } // zoom the map to show all the markers, may not be desirable. map.fitBounds(bounds); }; function initialize() { // initialize the map on page load. var mapOptions = { center: new google.maps.LatLng(35.66, -80.50), zoom: 8, mapTypeId: google.maps.MapTypeId.ROADMAP }; map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions); // add the markers to the map if they have been loaded already. if (gmarkers.length > 0) { for (var i = 0; i < gmarkers.length; i++) { gmarkers[i].setMap(map); } } } google.maps.event.addDomListener(window, 'load', initialize); 

https://developers.google.com/maps/documentation/javascript/reference

 markerObject.setPosition(latlng:LatLng|LatLngLiteral) 

Я не думаю, что вам нужно перерисовать карту, но если вы это сделаете:

 google.maps.event.trigger(mapObject, 'resize');