Jak obliczyć odległość polilinii w ulotce takiej jak geojson.io?

Question

Pracuję nad mapą z Mapbox i ulotką i mam pozwolić użytkownikowi narysować wielokąty, obliczyć i pokazać, że są tego wielokąta, a także muszę pozwolić użytkownikowi narysować polilinię i pokazać odległość polilinii.

Wykreśliłem funkcję obszaru wielokąta, ale nie wiem, jak obliczyć odległość polilinii.

Mój kod wygląda następująco:

loadScript('https://api.tiles.mapbox.com/mapbox.js/plugins/leaflet-draw/v0.2.2/leaflet.draw.js', function(){ 
    loadScript('https://api.tiles.mapbox.com/mapbox.js/plugins/leaflet-geodesy/v0.1.0/leaflet-geodesy.js', function(){ 
     var featureGroup = L.featureGroup().addTo(map); 

     var drawControl = new L.Control.Draw({ 
     edit: { 
      featureGroup: featureGroup 
     }, 
     draw: { 
      polygon: true, 
      polyline: true, 
      rectangle: false, 
      circle: false, 
      marker: false 
     } 
    }).addTo(map); 

    map.on('draw:created', showPolygonArea); 
    map.on('draw:edited', showPolygonAreaEdited); 

    function showPolygonAreaEdited(e) { 
     e.layers.eachLayer(function(layer) { 
      showPolygonArea({ layer: layer }); 
     }); 
    } 
    function showPolygonArea(e) { 
     var type = e.layerType, 
     layer = e.layer; 

     if (type === 'polygon') { 
      featureGroup.clearLayers(); 
      featureGroup.addLayer(e.layer); 
      e.layer.bindPopup(((LGeo.area(e.layer)/1000000) * 0.62137).toFixed(2) + ' mi<sup>2</sup>'); 
      e.layer.openPopup(); 
     } 

     if (type === 'polyline') { 
      featureGroup.clearLayers(); 
      featureGroup.addLayer(e.layer); 
      // What do I do different here to calculate the distance of the polyline? 
      // Is there a method in the LGeo lib itself? 
      // e.layer.bindPopup(((LGeo.area(e.layer)/1000000) * 0.62137).toFixed(2) + ' mi<sup>2</sup>'); 
      e.layer.openPopup(); 
     } 

    } 
    }); 
}); 

Czy istnieje metoda w LGeo lib sobie co pomoże mi obliczyć odległość polilinii? Deweloperzy pod numerem geogson.io również mają sposób na obliczenie odległości, ale nie potrafię tego rozgryźć patrząc na ich kod. Nie jestem doświadczonym programistą JavaScript. Każda pomoc jest mile widziana. :)

Answer 1

W końcu wymyśliłem sobie algorytm. Zasadniczo odnalazłem właściwość polilinii, która zawiera wszystkie polilinię, a następnie wykonałem ją przez pętlę i użyłem metody distanceTo z Ulotki do obliczenia odległości między punktami i kontynuowałem dodawanie ich do zmiennej totalDistance.

if (type === 'polyline') { 
    featureGroup.clearLayers(); 
    featureGroup.addLayer(e.layer); 

    // Calculating the distance of the polyline 
    var tempLatLng = null; 
    var totalDistance = 0.00000; 
    $.each(e.layer._latlngs, function(i, latlng){ 
     if(tempLatLng == null){ 
      tempLatLng = latlng; 
      return; 
     } 

     totalDistance += tempLatLng.distanceTo(latlng); 
     tempLatLng = latlng; 
    }); 
    e.layer.bindPopup((totalDistance).toFixed(2) + ' meters'); 
    e.layer.openPopup(); 
} 

Answer 2

To także rozwiązanie do obliczania obszaru koła.

else if (type === 'circle') { 
    var area = 0; 
    var radius = e.layer.getRadius(); 
    area = (Math.PI) * (radius * radius); 
    e.layer.bindPopup((area/1000000).toFixed(2) + ' km<sup>2</sup>'); 
    e.layer.openPopup(); 
} 

Answer 3

I rozwiązać tego rozszerzając L.Polyline klasy i używając LatLng jest distanceTo metodę:

L.Polyline = L.Polyline.include({ 
    getDistance: function(system) { 
     // distance in meters 
     var mDistanse = 0, 
      length = this._latlngs.length; 
     for (var i = 1; i < length; i++) { 
      mDistanse += this._latlngs[i].distanceTo(this._latlngs[i - 1]); 
     } 
     // optional 
     if (system === 'imperial') { 
      return mDistanse/1609.34; 
     } else { 
      return mDistanse/1000; 
     } 
    } 
}); 

Hope it hepls kogoś.

Answer 4

Zachęcam także czytelników do zapoznania się z biblioteką torfów. Działa świetnie z ulotką i ma wiele użytecznych metod, w tym odległość polilinii. http://turfjs.org/docs