cập nhật vị trí điểm đánh dấu với tờ rơi API

Question

Tôi muốn xây dựng ứng dụng web với API Leaflet. Đầu tiên người dùng của tôi là geolocated với IP sau đó nếu anh ta chấp nhận tôi cố gắng cập nhật vị trí của mình với vị trí địa lý HTML5 (độ chính xác là tốt hơn).

Vấn đề của tôi là vị trí điểm đánh dấu không được cập nhật trên bản đồ và mã bên dưới không thành công mà không có lỗi. Tôi đã thử hàng trăm cú pháp và phương pháp khác nhau từ leaflet documentation để cập nhật vị trí điểm đánh dấu (ví dụ: setLatLng) nhưng tôi đã không thành công. Tôi muốn hiểu những gì sai với mã của tôi.

---

Vấn đề của tôi được giải quyết bằng cách làm như thế này:

var lat = (e.latlng.lat); 
    var lng = (e.latlng.lng); 
    var newLatLng = new L.LatLng(lat, lng); 
    marker.setLatLng(newLatLng); 

Cũ mã đã:

//initial IP based geolocation 

var lat = google.loader.ClientLocation.latitude; 
var lng = google.loader.ClientLocation.longitude; 

//place marker on the map 

var marker = L.marker([lat,lng]).addTo(map); 

//start HTML5 geolocation 

map.locate({setView: true, maxZoom: 16}); 

function onLocationFound(e) { 

    var marker = L.marker([e.latlng.lat,e.latlng.lng]).update(marker); 
    alert ('New latitude is ' + e.latlng.lat) 
} 

map.on('locationfound', onLocationFound); 

Answer 1

Các mã bên trong câu hỏi của bạn là một chút bối rối, thật khó để nói những gì vấn đề là khi bạn chỉ đăng đoạn trích.

Vì nó là, mã này:

var lat = (e.latlng.lat); 
    var lng = (e.latlng.lng); 
    var newLatLng = new L.LatLng(lat, lng); 
    marker.setLatLng(newLatLng); 

việc ..should như mong đợi bên onLocationFound().

Bạn có thể đơn giản hóa nó:

marker.setLatLng(e.latlng); 

Tuy nhiên, tôi đoán vấn đề là một phạm vi-vấn đề, một số các biến của bạn (ví dụ marker) không thể truy cập bên trong onLocationFound.

Dưới đây là một ví dụ làm thế nào để đạt được điều đó:

function init(){ 
    var map    = L.map('map', {center: [51.505, -0.09], zoom: 13}), 
     marker   = L.marker(map.getCenter()).addTo(map), 
     glcl   = google.loader.ClientLocation, 
     onLocationfound = function(e){ 
      marker.setLatLng(e.latlng); 
      map.setView(marker.getLatLng(),map.getZoom()); 
      alert('Marker has been set to position :'+marker.getLatLng().toString()); 
     }; 

    L.tileLayer('http://{s}.tile.cloudmade.com/[yourCloudmadeKey]/997/256/{z}/{x}/{y}.png').addTo(map); 

    map.on('locationfound', onLocationfound); 

    if(glcl){//when google.loader.ClientLocation contains result 
     onLocationfound({latlng:[glcl.latitude,glcl.longitude]}); 
    }else{alert('google.loader.ClientLocation fails');} 

    map.locate(); 
} 

Demo: http://jsfiddle.net/doktormolle/6ftGz/

Answer 2

Hãy thử update() của phương pháp đánh dấu nó làm việc cho tôi

var lat = (e.latlng.lat); 
var lng = (e.latlng.lng); 
marker.setLatLng([lat, lng]).update(); // Updates your defined marker position