Тема: Google Map API
Показать сообщение отдельно
  #1 (permalink)  
Старый 04.09.2010, 16:44
Новичок на форуме
Отправить личное сообщение для HugoBorz Посмотреть профиль Найти все сообщения от HugoBorz
 
Регистрация: 04.09.2010
Сообщений: 1

Google Map API
Доброго времени суток всем. Возникла необходимость сделать карту на сайте с отметкой определённых координат маркерами. Суть задачи состоит в том, что координаты постоянно обновляютяся и их необходимо выводить на карту динамически, т.е., без перезагрузки всей страници. Вопрос к знающим как реализовать данную идею? Всем откликнувшимся заранее благодарен.
собсно сам код, который имеется на данный момент.
<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>
Ответить с цитированием