leaflet - Drawing line following the road

المشرف العام

Administrator
طاقم الإدارة
Short version:What I wish to be able to do is drawing a polyline along part of a road. In that way marking certain houses, along this road.

Long Version:I have several houses that I wish to mark using a polyline. This polyline needs to follow the road. Meaning that when it road turns so does the polyline. I already have the Latitude and Longitude for every house that needs to be marked. What I have been trying so far is to look up these addresses by using NavEngine by CloudMade Using the first house on the road, and the last house on the road. Then marking all the houses that are left on the road to be way points. The reason I have done this is if the road splits but does not change the name of the road, it would not mark the addresses that are on the road then. So by using waypoints I hope to hit all houses on the road.

This result I am getting back as a JSON format I then split this up, so I only have the route_geometry. The result of this looks like this:

[ [ 55.46814, 8.4648 ], [ 55.46814, 8.4648 ], [ 55.468109, 8.46511 ], [ 55.468102, 8.46523 ], [ 55.468071, 8.46554 ], [ 55.46806, 8.46559 ], [ 55.468071, 8.46589 ], [ 55.46843, 8.46834 ], [ 55.468071, 8.46589 ], [ 55.46806, 8.46559 ], [ 55.468079, 8.46543 ], [ 55.468182, 8.46444 ], [ 55.46806, 8.46559 ], [ 55.468071, 8.46589 ], [ 55.468071, 8.46594 ], [ 55.46843, 8.46834 ], [ 55.468071, 8.46589 ], [ 55.46806, 8.46559 ], [ 55.468071, 8.46557 ], [ 55.468182, 8.46444 ], [ 55.46806, 8.46559 ], [ 55.468071, 8.46589 ], [ 55.468102, 8.46611 ], [ 55.46843, 8.46834 ], [ 55.468281, 8.46844 ], [ 55.467838, 8.46846 ], [ 55.46751, 8.46621 ], [ 55.467461, 8.46587 ], [ 55.467541, 8.46433 ], [ 55.468182, 8.46444 ], [ 55.46806, 8.46559 ], [ 55.468071, 8.46589 ], [ 55.468128, 8.46634 ], [ 55.46843, 8.46834 ], [ 55.468281, 8.46844 ], [ 55.467838, 8.46846 ], [ 55.467602, 8.46684 ], [ 55.467461, 8.46587 ], [ 55.467541, 8.46433 ], [ 55.468182, 8.46444 ], [ 55.46806, 8.46559 ], [ 55.468071, 8.46589 ], [ 55.468159, 8.46651 ], [ 55.46843, 8.46834 ], [ 55.468281, 8.46844 ], [ 55.467838, 8.46846 ], [ 55.46769, 8.46748 ], [ 55.467461, 8.46587 ], [ 55.467541, 8.46433 ], [ 55.468182, 8.46444 ], [ 55.46806, 8.46559 ], [ 55.468071, 8.46589 ], [ 55.468189, 8.46672 ], [ 55.46843, 8.46834 ], [ 55.468281, 8.46844 ], [ 55.467838, 8.46846 ], [ 55.467781, 8.46811 ], [ 55.467461, 8.46587 ], [ 55.467541, 8.46433 ], [ 55.468182, 8.46444 ], [ 55.46806, 8.46559 ], [ 55.468071, 8.46589 ], [ 55.46843, 8.46834 ], [ 55.468521, 8.46898 ], [ 55.468609, 8.46958 ], [ 55.468681, 8.47012 ], [ 55.46867, 8.47027 ], [ 55.468681, 8.47012 ], [ 55.468472, 8.46858 ], [ 55.46843, 8.46834 ], [ 55.468491, 8.46879 ], [ 55.468529, 8.46904 ], [ 55.468559, 8.46925 ], [ 55.46859, 8.4695 ], [ 55.46859, 8.4695 ] ]Now my plan was just to take these points and draw a polyline though all of them, and thereby creating the wanted result. But this does not work! The result I am getting back is a line that breaks up and goes over itself several times.

Now my question to you is if I am on my the right track, or have am I making it much harder then it really is?

Thank you for taking you time to read all this. If you need any more information please let me know.

EDIT:Also if you it can help, the page is coded in ASP.net with c# for server side code. And Javascript for the map...I am using as mention above Leaflet as API and OSM for the map data..

Updated:Still stuck with this problem..

What I am trying to get is something kinda like this. But instead of having to click too click each of them to get it to load the road. I want to have it do this when the page load. I know that there might be performance issues.. But for now just ignore that ;)

Hope this might explain it a little better...



أكثر...
 
أعلى