Доброго времени суток всем. Возникла необходимость сделать карту на сайте с отметкой определённых координат маркерами. Суть задачи состоит в том, что координаты постоянно обновляютяся и их необходимо выводить на карту динамически, т.е., без перезагрузки всей страници. Вопрос к знающим как реализовать данную идею? Всем откликнувшимся заранее благодарен.
собсно сам код, который имеется на данный момент.
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript"
src="http://www.google.com/jsapi?key=ABQIAAAAy23H4tb_-nbUA-SrqfCxexT5qFbc1hQi-_1Oq7AZn5a9RWE5p2dJa8tz9Q"></script>
<script type="text/javascript">
google.load("maps", "2", {"language" : "ru"});
google.load("search", "1");
function initialize() {
var map = new google.maps.Map2(document.getElementById("map"));
map.setCenter(new google.maps.LatLng(-37.717888, 84.460350), 15);
GDownloadUrl("data.xml", function(data, responseCode) {
var xml = GXml.parse(data);
//Распарсиваем маркеры
var markers = xml.documentElement.getElementsByTagName("marker");
for (var i = 0; i < markers.length; i++) {
var point = new GLatLng(parseFloat(markers[i].getAttribute("lat")),
parseFloat(markers[i].getAttribute("lng")));
var marker = new GMarker(point);
map.addOverlay(marker); //отображаем маркер
}
});
map.addControl(new GOverviewMapControl());
var map_ctrl=new GLargeMapControl();
var map_type_ctrl=new GMapTypeControl();
var map_scale_ctrl=new GScaleControl();
map.addControl(map_ctrl);
map.addControl(map_type_ctrl);
}
google.setOnLoadCallback(initialize);
</script>
<style type="text/css">
.block1
{
border: solid 0px black;
float: left;
}
.block2
{
width: 250px;
background: #E6E6FA;
padding: 10px;
border: solid 1px black;
float: left;
position: relative;
top: 0px;
left: 5px;
}
.block3
{
width: 250px;
background: #FFE4C4;
padding: 10px;
border: solid 1px black;
float: left;
position: relative;
top: 5px;
left: 5px;
}
</style>
</head>
<body>
<script type="text/javascript">
</script>
<div class="block1" id="map" style="width: 75%; height: 90%"></div>
</font>
</div>
</body>
</html>