我怎样才能在地图上显示值守位置?

How can i show the watchposition lat lon on the map

本文关键字:显示 位置 地图      更新时间:2023-09-26

我使用cordova来查找使用watchPosition()方法的设备位置。我能成功找回位置,但是我想将watchposition()的纬度和经度值传递给Google地图。我该怎么做呢?

index . html

<div id="map"></div>
<script>
  var map;
  function initMap() {
    var myLatLng = {
        //here the lat and lon should update on intervals
    };
    var map = new google.maps.Map(document.getElementById('map'), {
      zoom: 12,
      center: myLatLng
    });
    var marker = new google.maps.Marker({
      position: myLatLng,
      map: map,
      title: 'Hello World!'
    });
  }
</script>

app.js

$("#getGeolocation").on('click', function(){
        document.addEventListener("deviceready", onDeviceReady, false);
            function onDeviceReady() {          
               function onSuccess(position) {
                    var element = document.getElementById('geolocation');
                    element.innerHTML = 'Latitude: '  + position.coords.latitude      + '<br />' +
                                        'Longitude: ' + position.coords.longitude     + '<br />' +
                                        '<hr />'      + element.innerHTML;
                }
                function onError(error) {
                    alert('code: '    + error.code    + ''n' +
                          'message: ' + error.message + ''n');
                }
                var watchID = navigator.geolocation.watchPosition(onSuccess, onError, { timeout: 3000 });
        }
    });

onSuccess事件处理程序中更新标记的位置,如下所示:

function onSuccess(position) {
   var pos = {
      lat: position.coords.latitude, 
      lng: position.coords.longitude 
   };
   // Center map
   map.setCenter(pos);
   // Update marker position
   marker.setPosition(pos);
}

这是通过传递经度和纬度来显示Google地图的javascript。

     var myLatlng = new google.maps.LatLng(-34.397, 150.644);
              var myOptions = {
                zoom: 8,
                center: myLatlng,
                mapTypeId: google.maps.MapTypeId.ROADMAP
              }
              var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);