Подтвердить что ты не робот

В режиме реального времени GPS Tracker на JUST HTML/JS и Google Maps для запуска на ручном телефоне? Является ли это возможным?

Я прочитал о GPS-наблюдении в режиме реального времени и узнал об этом несколько вещей, в основном требующих PHP, zope и базы данных для хранения входящих данных. Некоторые другие методы используют ajax с отношениями к PHP.

Что касается моего вопроса, можно ли это сделать только с помощью html и JS, используя маркеры или что-нибудь еще, чтобы заполнить карту Google, когда вы перемещаетесь в любом месте города? Нужна помощь по этому поводу, спасибо!

4b9b3361

Ответ 1

Да, это возможно. Большинство браузеров на последних смартфонах реализовали API-интерфейс W3C Geolocation:

API геолокации определяет интерфейс высокого уровня для информации о местоположении, связанной только с устройством, реализующим реализацию, например широтой и долготой. Сам API является агностиком источников информации о местоположении, лежащих в основе. Общие источники информации о местоположении включают в себя Глобальную систему определения местоположения (GPS) и местоположение, исходящее из сетевых сигналов, таких как IP-адрес, RFID, WiFi и MAC-адреса Bluetooth, а также идентификаторы сотовой сети GSM/CDMA, а также пользовательский ввод. Нет гарантии, что API вернет фактическое местоположение устройства.

API предназначен для включения как "одноразовых" запросов местоположения, так и повторных обновлений местоположения, а также возможность явного запроса кэшированных позиций.

Использование API геолокации для построения точки на Картах Google будет выглядеть примерно так:

if (navigator.geolocation) { 
  navigator.geolocation.getCurrentPosition(function(position) {  

    var point = new google.maps.LatLng(position.coords.latitude, 
                                       position.coords.longitude);

    // Initialize the Google Maps API v3
    var map = new google.maps.Map(document.getElementById('map'), {
       zoom: 15,
      center: point,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    });

    // Place a marker
    new google.maps.Marker({
      position: point,
      map: map
    });
  }); 
} 
else {
  alert('W3C Geolocation API is not available');
} 

Вышеуказанное будет только собирать позицию один раз и не будет автоматически обновляться, когда вы начнете движение. Чтобы справиться с этим, вам нужно будет сохранить ссылку на ваш маркер, периодически называть метод getCurrentPosition() и перемещать маркер в новые координаты. Код может выглядеть примерно так:

// Initialize the Google Maps API v3
var map = new google.maps.Map(document.getElementById('map'), {
  zoom: 15,
  mapTypeId: google.maps.MapTypeId.ROADMAP
});

var marker = null;

function autoUpdate() {
  navigator.geolocation.getCurrentPosition(function(position) {  
    var newPoint = new google.maps.LatLng(position.coords.latitude, 
                                          position.coords.longitude);

    if (marker) {
      // Marker already created - Move it
      marker.setPosition(newPoint);
    }
    else {
      // Marker does not exist - Create it
      marker = new google.maps.Marker({
        position: newPoint,
        map: map
      });
    }

    // Center the map on the new position
    map.setCenter(newPoint);
  }); 

  // Call the autoUpdate() function every 5 seconds
  setTimeout(autoUpdate, 5000);
}

autoUpdate();

Теперь, если отслеживание означает, что вы также должны хранить эту информацию на сервере (чтобы кто-то другой мог видеть, как вы перемещаетесь из удаленного места), вам нужно будет отправить точки на серверную сторону script используя AJAX.

Кроме того, убедитесь, что Условия использования Google Maps API позволяют использовать это использование до того, как вы включите такой проект.


UPDATE: API-интерфейс W3C Geolocation предоставляет метод watchPosition(), который можно использовать вместо setTimeout(), который использовался в приведенном выше примере.