динамическое рисование полилиний в googlemaps с использованием php / mysql - PullRequest
2 голосов
/ 13 марта 2010

Я новичок в googlemaps API. Я написал небольшое приложение для моего мобильного телефона, которое периодически обновляет свое местоположение до базы данных SQL.

Я хотел бы отобразить эту информацию на карте Google в моем браузере. В идеале я хотел бы периодически опрашивать базу данных и, если появятся какие-либо новые координаты, добавить их в строку.

Лучший способ описать это это .

В поисках того, чтобы туда добраться, я начал с документов в Google и модифицировал их, чтобы попытаться получить то, что я хочу. Это не работает - и я не знаю достаточно, чтобы понять почему. Я хотел бы получить несколько советов о том, почему, и любые указания на мою конечную цель будут очень приветствоваться Google Maps AJAX + MySQL / PHP Пример

   <script type="text/javascript">
  //<![CDATA[

function load() {
  if (GBrowserIsCompatible()) {
    var map = new GMap2(document.getElementById("map"));
    map.addControl(new GSmallMapControl());
    map.addControl(new GMapTypeControl());
    map.setCenter(new GLatLng(47.614495, -122.341861), 13);

    GDownloadUrl("phpsqlajax_genxml.php", function(data) {
      var xml = GXml.parse(data);
      var line = [];
      var markers = xml.documentElement.getElementsByTagName("points");
        for (var i = 0; i < points.length; i++) {
            var point = points.item(i);
            var lat  = point.getAttribute("lat");
            var lng  = point.getAttribute("lng");

            var latlng = new GLatLng(lat, lng);

       line.push(latlng);
       if (point.firstChild) {
         var station = point.firstChild.nodeValue;
         var marker = createMarker(latlng, station);
         map.addOverlay(marker);
       }
     }

     var polyline = new GPolyline(line, "#ff0000", 3, 1);
     map.addOverlay(polyline);
});
}
//]]>

Мой php-файл генерирует следующий XML;

<?xml version="1.0" encoding="UTF-8" ?>
<points>
<point lng="-122.340141" lat="47.608940"/>
<point lng="-122.344391" lat="47.613590"/>
<point lng="-122.356445" lat="47.624561"/>
<point lng="-122.337654" lat="47.606365"/>
<point lng="-122.345673" lat="47.612823"/>
<point lng="-122.340363" lat="47.605961"/>
<point lng="-122.345467" lat="47.613976"/>
<point lng="-122.326584" lat="47.617214"/>
<point lng="-122.342834" lat="47.610126"/>
</points>

Я успешно прошел через это; http://code.google.com/apis/maps/articles/phpsqlajax.html перед попыткой настройки кода.

Есть указатели? Где я ошибаюсь?

1 Ответ

1 голос
/ 13 марта 2010

Вы, кажется, на правильном пути.

Ваш php-скрипт должен принимать параметр временной метки и проверять, были ли новые точки добавлены в базу данных после этой временной метки. Если да, он должен возвратить ответ с самой последней записью (или списком записей после этой отметки времени, если вы хотите показать живой след при движении транспортного средства).

На стороне клиента может потребоваться инициировать запрос AJAX для сценария на стороне сервера, используя обычный или длинный опрос с параметром отметки времени последнего обновления.

Когда ваш AJAX-запрос получает новую информацию с сервера, вы просто перемещаете свои маркеры на карте. Затем инициируйте новый запрос AJAX с обновленным параметром метки времени.

Пример псевдокодирования с использованием jQuery :

var lastUpdate = '2000/01/01 00:00:00';

function autoUpdate () {
    $.ajax({
       type: "GET",
       url: "phpsqlajax_genxml.php?last_update=" + lastUpdate,
       dataType: 'xml',
       success: function(xmlData) {

          // 1. Check if the xmlData is empty. If not we received 
          //    some fresh data.
          // 2. Update lastUpdate from the xmlData with the timestamp from 
          //    the server. Don't use JavaScript to update the timestamp, 
          //    because the time on the client and on the server will 
          //    never be exactly in sync.
          // 3. Move the markers on Google Map.

          // Relaunch the autoUpdate() function in 5 seconds.
          setTimeout(autoUpdate, 5000);
       }
    });
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...