Polyline, yaprakçıktaki yollara yapıştırarak

Question

Bir veritabanından işaretçileri yüklüyorum ve sonra işaretçiler arasında bir polyline çiziyorum. Markör-a'dan marker-b'ye marker-c'ye olan mesafeyi hesaplamak yerine, genel mesafeyi hesaplamak için polyline'ı kullanıyorum.

Mesafelerim yanlıştır, çünkü iki işaretleyici eğri bir yolun etrafındaysa, polyline sadece yol boyunca çekmek yerine onları bağlar.

Bunun Google Haritalar API'sında mümkün olduğunu biliyorum ancak kullanım kısıtlamaları bana uymuyordu, bu yüzden broşür kullanmaya karar verdim.

İşaretleyicilerim birbirinden çok uzak değil, çünkü gps aygıtım her 10 saniyede bir konum gönderiyor.

leaflet-routing-machine eklentisini buldum ve polyline'ımı yollara ayırmak için bunu kullanabilir miyim diye merak ediyordum?

benim haritaya işaretçileri ekliyorum nasıl budur:

function getlocationsfromdb(){ 
     group.clearLayers(); 
     latlngArray.length=0; 
     var deviceid = $("#selectid").val(); 

     $.ajax({ 
      type: "POST", 
      url: "functionhandlers/getlocations.php", 
      data: {deviceid:deviceid,start:start,end:end}, 
      dataType: 'json', 
      cache: false, 
     }) 
     .success(function(response) { 
      $('input').removeClass('error').next('.errormessage').html(''); 
      if(!response.errors && response.result) { 

       $.each(response.result, function(index, value) { 
        var latlng = L.latLng(value[7], value[8]); 
        var marker = L.circleMarker(latlng,{radius:2}).addTo(group);  
        latlngArray.push(latlng); 

       }); 
        var polyline = L.polyline(latlngArray, {color: '#605ca8'}).addTo(group); 
        map.fitBounds(group.getBounds()); 
        var distancetravelled=polyline.measuredDistance(); 
        $("#distancetravelled").html(distancetravelled); 


      } else { 
       $.each(response.errors, function(index, value) { 
        // add error classes 
        $('input[name*='+index+']').addClass('error').after('<div class="errormessage">'+value+'</div>') 
       }); 
      } 
     }); 
} 

birisi bana doğru yönde işaret edebilir?

Answer 1

Bu, broşür yönlendirme makinesiyle kolayca yapılabilir. Sadece ayarlayabilirsiniz Eğer yönlendirme kontrolünü başlatmak için latlngArray için waypoints: Bunun yerine, İşte

var control = L.Routing.control({ 
    waypoints: latlngArray, 
    show: false, 
    waypointMode: 'snap', 
    createMarker: function() {} 
}).addTo(map); 

, show: false harita üzerinde görüntülenmesini kontrol tutar ve boş createMarker fonksiyon yönlendirme makinesi oluşturur varsayılan işaretlerini geçersiz kılar hiçbir şey yapmadan (kontrolü kaldırdığımızda işaretleyiciler kaldırılmış olsa da, bir rota bulunduğunda ekranda yanıp sönmelerini engeller).

routeselected olayını dinleyerek yönlendirme makinesi sonuçlarının tüm köşelerini ayıklayabilirsiniz; bu, yolun tüm yönlerini ve geometrilerini içeren bir IRoute object döndürecektir. Yeni L.polyline nesneye .route.coordinates yerleştirilmesi etrafında rotayı tutacak, bu yüzden o zaman sadece yönlendirme kontrolü kurtulabilirsiniz: Reklam latlngArray gerektiğini doldurmak hemen sonra

control.on('routeselected', function(e) { 
    L.polyline(e.route.coordinates).addTo(group); 
    map.removeControl(control); 
}); 

sizin .success geri arama işlevi içinde yukarıdaki kod blokları yerleştirilmesi İstediğiniz rotayı verin. Eğer başka bir şey için yönlendirme kontrolü kullanarak ve tamamen bunun görünmesini tutmak istiyorum değilseniz

http://fiddle.jshell.net/nathansnider/ygktexbj/ Ayrıca

(küçük beyaz kontrol kutusu hala süre görünebilir: İşte iş yerinde bu gösteren bir keman var rota) hesaplanır, görebilmek css bunu gizlemek basitçe yapabilirsiniz:

.leaflet-routing-container { 
    display:none; 
} 

Answer 2

Ben bir denetimi oluşturur çünkü bu çözüm biraz dolambaçlı, ve daha sonra yarım kod sadece bu denetimi engelliyor fark harita üzerinde gösteriliyor

Aslında haritaya eklemek zorunda değilsiniz. Ayrıca, iç yönlendiricinin route işlevine doğrudan saldırabilirsiniz.

var routingControl = L.Routing.control({ 
    waypointMode: 'snap' 
}); 

sonra

routingControl._router.route(latLngCoordinates, function(err, waypoints) { 
    var a = waypoints; 
}); 

ham kopyala/yapıştır var, dikkatli olun: - gezi noktaları (inceleyebilirler) iç formata uyar - latLngCoordinates olmalıdır {lat :, Ing:} biçimi - Üretilen url bazı çok uzun "ipuçları" verileri kapsülleyeceği için bazı temizlik gerektirebilir.