×

Discussion Board

Results 1 to 6 of 6
  1. #1
    Registered User
    Join Date
    May 2012
    Posts
    43

    Exclamation how can i, create a nokia.maps.map.Polyline using a nokia.maps.routing.Manager?

    at this moment, im trying this:

    var poly = new nokia.maps.map.Polyline(routes.shape,{pen: {strokeColor: "#8dc72d", lineWidth: 5}});

    where routes its a nokia.maps.routing.Manager that have a calculated route.


    where is this wrong?

  2. #2
    Regular Contributor
    Join Date
    Aug 2011
    Location
    Berlin
    Posts
    289

    Re: how can i, create a nokia.maps.map.Polyline using a nokia.maps.routing.Manager?

    You can get a generated polyline and two markers directly from the RouteResultSet

    For a simple code example look at the developer playground:
    http://api.maps.nokia.com/en/playgro...xample_routing

    A commentary on this can be found in the community wiki:
    http://www.developer.nokia.com/Commu...een_two_points

    To extract multiple legs from a single route, check out the example at:
    http://www.developer.nokia.com/Commu...ween-waypoints

  3. #3
    Registered User
    Join Date
    May 2012
    Posts
    43

    Re: how can i, create a nokia.maps.map.Polyline using a nokia.maps.routing.Manager?

    Quote Originally Posted by jasfox View Post
    You can get a generated polyline and two markers directly from the RouteResultSet

    For a simple code example look at the developer playground:
    http://api.maps.nokia.com/en/playgro...xample_routing

    A commentary on this can be found in the community wiki:
    http://www.developer.nokia.com/Commu...een_two_points

    To extract multiple legs from a single route, check out the example at:
    http://www.developer.nokia.com/Commu...ween-waypoints

    im using this example precisely
    http://api.maps.nokia.com/en/playgro...xample_routing

    what i want to do is get the polyline from the result, and in a function, send the coordinate of a point, and by using the polyline`s getNearest (coord)
    know how much separate is the coordinate of the route

  4. #4
    Registered User
    Join Date
    May 2012
    Posts
    43

    Re: how can i, create a nokia.maps.map.Polyline using a nokia.maps.routing.Manager?

    can you help me with that?

  5. #5
    Regular Contributor
    Join Date
    Aug 2011
    Location
    Berlin
    Posts
    289

    Re: how can i, create a nokia.maps.map.Polyline using a nokia.maps.routing.Manager?

    You are on the right lines, use

    var nearestCoord =Polyline.getNearest(GeoCoordinate); to get the nearest point on a polyline
    and nearestCoord.distance(GeoCoordinate) to calculate the distance between the two.


    Move the red marker in the example below. The green marker will move to the closest point on the route to the red marker.
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html> 
    <head>
    		<script type="text/javascript" charset="UTF-8" src="http://api.maps.nokia.com/2.2.0/jsl.js?routing=auto"></script>
        <title>Nearest Point to a Route example</title>
    </head>
    <body>
    
    <div id="mapContainer" style="top:30%; width:100%; height:70%; position: absolute;"></div>
     
    <script type="text/javascript">
    /////////////////////////////////////////////////////////////////////////////////////
    // Don't forget to set your API credentials
    //
    // Replace with your appId and token which you can obtain when you 
    // register on http://api.developer.nokia.com/ 
    //
    			nokia.Settings.set( "appId", "YOUR APP ID GOES HERE"); 
    			nokia.Settings.set( "authenticationToken", "YOUR AUTHENTICATION TOKEN GOES HERE");
    			
    //			
    /////////////////////////////////////////////////////////////////////////////////////
     
     
    //initialize a new map 
    var display = new nokia.maps.map.Display(document.getElementById("mapContainer"), 
                         {     "components": [	
                                         new nokia.maps.map.component.ZoomBar(),                 
                                         new nokia.maps.map.component.Behavior(),                 
                                         new nokia.maps.map.component.TypeSelector()],     
                                         "zoomLevel": 13,
                                         "center" : [52.500556, 13.398889] }); 
    
    // This conatiner will hold the calculated route. 
    var legContainer = new nokia.maps.map.Container(); 
      
    // Place this anywhere on the route .
    var markerForNearestPoint = new nokia.maps.map.StandardMarker([48.133333, 11.566667], 
    {  
    brush: {color: '#00FF00'} ,                                   
    });  
    
    // Place this anywhere in the world.
    var draggableMarker = new nokia.maps.map.StandardMarker([52.4, 12.0], 
    {  
    text:  "X",  
    brush: {color: '#FF0000'} ,                 
    draggable: true,                     
    });   
    // Add the two markers to the map.
    
    display.objects.add(markerForNearestPoint);  
    display.objects.add(draggableMarker); 
    
    // When the red marker is moved, move the green marker to the nearest point on the route.
    draggableMarker.addListener("dragend", function(evt) {	 
    	 var markerCoord = draggableMarker.coordinate;
    	 // The Example contains separate legs, but could be done on any Polyline(s)....
    	 for (var i = 0;  i < legContainer.objects.getLength(); i++){
    	 			 if ( legContainer.objects.get(i) instanceof nokia.maps.map.Polyline ) { 
    	 			 			// this is a Polyline , it must be must a leg....
    	 			 			var nearestCoord =legContainer.objects.get(i).getNearest(draggableMarker.coordinate);
    	 			 		if (nearestCoord.distance(markerCoord) <  markerForNearestPoint.coordinate.distance(markerCoord)){
    	 			 				markerForNearestPoint.set( "coordinate", nearestCoord);
    	 			 	  }
    	 			}
    	 
    	 } 
    });
    
    
    
    
     
    var onRouteCalculated = function (observedRouter, key, value) {
      if (value == "finished") {
    	   var firstroute = observedRouter.getRoutes()[0];
    		 
    	    
    	    
    	    for (var i = 0;  i < firstroute.waypoints.length; i++){
    				
    					legContainer.objects.add(new nokia.maps.map.StandardMarker(
    						firstroute.waypoints[i].mappedPosition, 
    						{ text: i  + 1 }
    					));
    		}
    	    
    	    for (var i = 0;  i < firstroute.legs.length; i++){
    	    	
    	    		var strokeColor = "#22CA";
    	    	
    	    		if (i % 2 == 0){	    	  
    	    	  		strokeColor = "#CACA00"
    	    	  }
    	    		    		
    	    		legContainer.objects.add(new nokia.maps.map.Polyline(
    							firstroute.legs[i].points,
    							{	
    								pen: {
    									strokeColor: strokeColor, 
    									lineWidth: 5
    								}
    							}
    						));
    	    }	
    	    
    	    	
    	   display.objects.add(legContainer);
    	   display.zoomTo(legContainer.getBoundingBox(), true);
    	   
    	   
    	   
    	   
    	   
    	   
    
    	 } else if (value == "failed") {
          // Something has gone horribly wrong  e.g. route too long.
          alert("The routing request failed.");
      }
    
      
    };                 
    
    
    var  MunichBerlinHamburg = new nokia.maps.routing.WaypointParameterList();
    MunichBerlinHamburg.addCoordinate (new nokia.maps.geo.Coordinate(48.133333, 11.566667));
    MunichBerlinHamburg.addCoordinate (new nokia.maps.geo.Coordinate(52.500556, 13.398889));
    MunichBerlinHamburg.addCoordinate(new nokia.maps.geo.Coordinate(53.565278, 10.001389));
    
    
    	var router = new nokia.maps.routing.Manager(); 
    	 router.calculateRoute(MunichBerlinHamburg,  [{ 
    		                  type: "shortest", 
    		                  transportModes: ["car"],
    		                  options: "",
    		                  trafficMode: "default"
    		                  }]);
    	 router.addObserver("state", onRouteCalculated);
     
    </script> 
    </body> 
    </html>

  6. #6
    Registered User
    Join Date
    May 2012
    Posts
    43

    Re: how can i, create a nokia.maps.map.Polyline using a nokia.maps.routing.Manager?

    Quote Originally Posted by jasfox View Post
    You are on the right lines, use

    var nearestCoord =Polyline.getNearest(GeoCoordinate); to get the nearest point on a polyline
    and nearestCoord.distance(GeoCoordinate) to calculate the distance between the two.


    Move the red marker in the example below. The green marker will move to the closest point on the route to the red marker.
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html> 
    <head>
    		<script type="text/javascript" charset="UTF-8" src="http://api.maps.nokia.com/2.2.0/jsl.js?routing=auto"></script>
        <title>Nearest Point to a Route example</title>
    </head>
    <body>
    
    <div id="mapContainer" style="top:30%; width:100%; height:70%; position: absolute;"></div>
     
    <script type="text/javascript">
    /////////////////////////////////////////////////////////////////////////////////////
    // Don't forget to set your API credentials
    //
    // Replace with your appId and token which you can obtain when you 
    // register on http://api.developer.nokia.com/ 
    //
    			nokia.Settings.set( "appId", "YOUR APP ID GOES HERE"); 
    			nokia.Settings.set( "authenticationToken", "YOUR AUTHENTICATION TOKEN GOES HERE");
    			
    //			
    /////////////////////////////////////////////////////////////////////////////////////
     
     
    //initialize a new map 
    var display = new nokia.maps.map.Display(document.getElementById("mapContainer"), 
                         {     "components": [	
                                         new nokia.maps.map.component.ZoomBar(),                 
                                         new nokia.maps.map.component.Behavior(),                 
                                         new nokia.maps.map.component.TypeSelector()],     
                                         "zoomLevel": 13,
                                         "center" : [52.500556, 13.398889] }); 
    
    // This conatiner will hold the calculated route. 
    var legContainer = new nokia.maps.map.Container(); 
      
    // Place this anywhere on the route .
    var markerForNearestPoint = new nokia.maps.map.StandardMarker([48.133333, 11.566667], 
    {  
    brush: {color: '#00FF00'} ,                                   
    });  
    
    // Place this anywhere in the world.
    var draggableMarker = new nokia.maps.map.StandardMarker([52.4, 12.0], 
    {  
    text:  "X",  
    brush: {color: '#FF0000'} ,                 
    draggable: true,                     
    });   
    // Add the two markers to the map.
    
    display.objects.add(markerForNearestPoint);  
    display.objects.add(draggableMarker); 
    
    // When the red marker is moved, move the green marker to the nearest point on the route.
    draggableMarker.addListener("dragend", function(evt) {	 
    	 var markerCoord = draggableMarker.coordinate;
    	 // The Example contains separate legs, but could be done on any Polyline(s)....
    	 for (var i = 0;  i < legContainer.objects.getLength(); i++){
    	 			 if ( legContainer.objects.get(i) instanceof nokia.maps.map.Polyline ) { 
    	 			 			// this is a Polyline , it must be must a leg....
    	 			 			var nearestCoord =legContainer.objects.get(i).getNearest(draggableMarker.coordinate);
    	 			 		if (nearestCoord.distance(markerCoord) <  markerForNearestPoint.coordinate.distance(markerCoord)){
    	 			 				markerForNearestPoint.set( "coordinate", nearestCoord);
    	 			 	  }
    	 			}
    	 
    	 } 
    });
    
    
    
    
     
    var onRouteCalculated = function (observedRouter, key, value) {
      if (value == "finished") {
    	   var firstroute = observedRouter.getRoutes()[0];
    		 
    	    
    	    
    	    for (var i = 0;  i < firstroute.waypoints.length; i++){
    				
    					legContainer.objects.add(new nokia.maps.map.StandardMarker(
    						firstroute.waypoints[i].mappedPosition, 
    						{ text: i  + 1 }
    					));
    		}
    	    
    	    for (var i = 0;  i < firstroute.legs.length; i++){
    	    	
    	    		var strokeColor = "#22CA";
    	    	
    	    		if (i % 2 == 0){	    	  
    	    	  		strokeColor = "#CACA00"
    	    	  }
    	    		    		
    	    		legContainer.objects.add(new nokia.maps.map.Polyline(
    							firstroute.legs[i].points,
    							{	
    								pen: {
    									strokeColor: strokeColor, 
    									lineWidth: 5
    								}
    							}
    						));
    	    }	
    	    
    	    	
    	   display.objects.add(legContainer);
    	   display.zoomTo(legContainer.getBoundingBox(), true);
    	   
    	   
    	   
    	   
    	   
    	   
    
    	 } else if (value == "failed") {
          // Something has gone horribly wrong  e.g. route too long.
          alert("The routing request failed.");
      }
    
      
    };                 
    
    
    var  MunichBerlinHamburg = new nokia.maps.routing.WaypointParameterList();
    MunichBerlinHamburg.addCoordinate (new nokia.maps.geo.Coordinate(48.133333, 11.566667));
    MunichBerlinHamburg.addCoordinate (new nokia.maps.geo.Coordinate(52.500556, 13.398889));
    MunichBerlinHamburg.addCoordinate(new nokia.maps.geo.Coordinate(53.565278, 10.001389));
    
    
    	var router = new nokia.maps.routing.Manager(); 
    	 router.calculateRoute(MunichBerlinHamburg,  [{ 
    		                  type: "shortest", 
    		                  transportModes: ["car"],
    		                  options: "",
    		                  trafficMode: "default"
    		                  }]);
    	 router.addObserver("state", onRouteCalculated);
     
    </script> 
    </body> 
    </html>
    thank you so much! thats wath i wanted to do! domo arigato, muchas gracias, thanks! its perfect!

Similar Threads

  1. nokia.maps.routing.WaypointParameterList is not a function
    By Achmatov in forum [Archived] Maps API for Javascript
    Replies: 2
    Last Post: 2012-05-03, 12:07
  2. Is there a way to convert Maps Data from Nokia Maps 3 to be compatible with N Maps 2
    By dimchopicha in forum General Development Questions
    Replies: 6
    Last Post: 2011-01-09, 17:50
  3. Navigation route coordinates from Nokia Maps or Ovi Maps
    By selimsolmaz in forum Mobile Java Tools & SDKs
    Replies: 2
    Last Post: 2010-03-04, 10:02
  4. Replies: 3
    Last Post: 2010-03-03, 10:25
  5. Replies: 2
    Last Post: 2010-03-02, 18:34

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
×