henrythasler / Leaflet.Geodesic

Add-on to draw geodesic lines with leaflet
GNU General Public License v3.0
156 stars 27 forks source link

getLatLngs() ? #3

Closed porjo closed 10 years ago

porjo commented 10 years ago

Would it be possible to get the lat, lng values for the points along the curve?

calling .getLatLngs() doesn't return anything sensible e.g.

        console.log("locs", locs);
        var latlngs = []; 
        for(var j=0; j < locs.length; j++) {
            latlngs.push(new L.LatLng(locs[j][0], locs[j][1]));
        }

        var geo = L.geodesic([latlngs],{
            color: "#FF21F0",
            weight: 5,
            opacity: 0.8,
        }); 
        console.log("geo latlngs", geo.getLatLngs());

Produces console output:

"locs" Array [ Array[2], Array[2], Array[2], Array[2], Array[2], Array[2] ]
"geo latlngs" Array [ Array[48], Array[9] ]

Also, isn't the outer [] around the latlngs array somewhat redundant? e.g. Geodesic.setLatLngs([[berlin, losangeles, capetown]]);

henrythasler commented 10 years ago

The Geodesic-Object is derived from Leaflet's MultiPolyline. So if you call getLatLngs on any Geodesic-Object you actually get an Array of Arrays of LatLng-Objects. Please refer to: http://leafletjs.com/reference.html#multipolyline

Let's say you make a geodesic line from Los Angeles to Tokyo. The shortest path obviously crossed the Pacific Ocean. Since Leaflet usually splits its maps in the middle of the Pacific, where the U.S. is left and Japan is right, you need some wrapping. Otherwise you get a line across the whole map (180° West to 180° East).

Leaflet.Geodesic detects that and splits the resulting geodesic line into two. The first going west starting at LA until the left border of the map (180° West). The second starting at the right border (180° East) and going all the way to Tokyo.

So what you get in your example is a split geodesic line that crosses the 180° line. Try to modify your example as follows to get the lat-property of the first point of the first part of your geodesic line:

console.log("geo latlngs", geo.getLatLngs()[0][0].lat); // you'll get the hang of it eventually

The outer [] are not redundant because Leaflet.Geodesic also starts from a MultiPolyline. So you can create independent geodesic lines with one object:

Geodesic.setLatLngs([[berlin, losangeles], [capetown, sydney]]);

Hope this was somehow illustrative...

porjo commented 10 years ago

Thankyou, that is very helpful.

Following on from that, is it possible to create a map view where the 2 split halves are joined in the middle, such that you see the line seamlessly cross the 180° longitude?

e.g. http://jsfiddle.net/te3xs8p4/5/

henrythasler commented 10 years ago

Let me know if this (http://jsfiddle.net/te3xs8p4/12/) is what you want. Please note the new "wrap"-property. Please do also note, that this required a modification of the vincenty algorithm. I'm not sure about possible side effects...

porjo commented 10 years ago

That's fantastic, thanks again! It appears to work as required in the few tests I've run.