×

Discussion Board

Results 1 to 4 of 4
  1. #1
    Registered User
    Join Date
    Apr 2012
    Posts
    11

    Polyline between waypoints

    Hi, I'm having the following issue:

    I need to calculate a route between 3 coordinates, but I want the result to contain two distinct shapes (I want to be able to draw 2 polylines from the result, not just one big polyline).

    For example something like this (I know this code is not valid; I'm just trying to make a point):

    Code:
    router.addObserver("state", function(obj, prop, value){                
         if (value == "finished") {  
             var route = obj.routes[0];
             for(s in route.shapes){
                     new nokia.maps.map.Polyline(route.shapes[s], {
                          pen: {
                              lineWidth: 6,
                              lineJoin: 'round'
                          }
                     })
         // ...
    Or could I somehow receive obj.routes as an array of 2 objects (route from A to B and route from B to C). I'm not sure why routes always has one single element.

    Best regards,
    Stefan
    Last edited by sdfanq; 2012-04-30 at 16:41.

  2. #2
    Nokia Developer Moderator
    Join Date
    Aug 2011
    Location
    Berlin
    Posts
    288

    Re: Polyline between waypoints

    I think you need to make two concurrent route requests.

    You can modify the Search example found here:
    http://www.developer.nokia.com/Commu...earch_requests

    But substitute a call the routing service instead.

    Try the following ( I've left in console calls and used arrays, so it probably won't work as is in IE, but you should get the idea - I've tested it with Firefox.
    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>Concurrent Routing 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] }); 
      
    
    var onAllManagersFinished = function() {     
        for (i = 0; i <routesArr.length; i++){
     	
    			console.log(routesArr[i]);
    
    	    var mapRoute = new nokia.maps.routing.component.RouteResultSet(routesArr[i]).container;
    	    display.objects.add(mapRoute);
    	    display.zoomTo(mapRoute.getBoundingBox(), true);
    	  }  
    };
    
    // we will use the same state observer function for all managers     
     
    var onRouteCalculated = function (observedRouter, key, value) {
      if (value == "finished") {
    	    routesArr[observedRouter.$index] = observedRouter.getRoutes()[0];
    	    managersFinished++;
    	 } else if (value == "failed") {
          // Something has gone horribly wrong  e.g. route too long.
          alert("The routing request failed.");
          managersFinished++;
      }
      
    
      if(managersFinished === waypointsArr.length) {
    			 onAllManagersFinished(); 
    		}   
      
    };                 
    
    
     
    var  routesArr = new Array();
    var  waypointsArr = new Array();
    var  MunichBerlin = new nokia.maps.routing.WaypointParameterList();
    MunichBerlin.addCoordinate (new nokia.maps.geo.Coordinate(48.133333, 11.566667));
    MunichBerlin.addCoordinate (new nokia.maps.geo.Coordinate(52.500556, 13.398889));
    
    var  BerlinHamburg = new nokia.maps.routing.WaypointParameterList();
    BerlinHamburg.addCoordinate(new nokia.maps.geo.Coordinate(52.500556, 13.398889));
    BerlinHamburg.addCoordinate(new nokia.maps.geo.Coordinate(53.565278, 10.001389));
    
    waypointsArr.push(MunichBerlin);
    waypointsArr.push(BerlinHamburg);
    
    
    
    var  i = waypointsArr.length;  
    var  managersFinished = 0; 
     
    // iterate over all route requests, create a manager for each of them, 
    // add the observer and call the claculateRoute method 
     
    while(i--) {    
    	var router = new nokia.maps.routing.Manager(); 
    	 router.$index = i;
    	 router.calculateRoute(waypointsArr[i],  [{ 
    		                  type: "shortest", 
    		                  transportModes: ["car"],
    		                  options: "",
    		                  trafficMode: "default"
    		                  }]);
    	 router.addObserver("state", onRouteCalculated);
    } 
     
    </script> 
    </body> 
    </html>

  3. #3
    Registered User
    Join Date
    Apr 2012
    Posts
    11

    Re: Polyline between waypoints

    Thank you for the answer. It's too bad that it would use 2 API calls though.

    Will the (free, non-commercial) API usage limit apply per app_key or IP ?

    Best regards,
    Stefan

  4. #4
    Nokia Developer Moderator
    Join Date
    Aug 2011
    Location
    Berlin
    Posts
    288

    Re: Polyline between waypoints

    Quote Originally Posted by sdfanq View Post
    Thank you for the answer. It's too bad that it would use 2 API calls though.
    You can make a single API call and interrogate the legs of the route to display what you want, but you will need to write your own version of RouteResultSet to do this:

    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>Concurrent Routing 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] }); 
      
    
    // we will use the same state obeserver function for all managers     
     
    var onRouteCalculated = function (observedRouter, key, value) {
      if (value == "finished") {
    	   var firstroute = observedRouter.getRoutes()[0];
    
    		var legContainer = new nokia.maps.map.Container();
    	    
    	    
    	    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>


    Quote Originally Posted by sdfanq View Post
    Will the (free, non-commercial) API usage limit apply per app_key or IP ?
    The terms and conditions can be found here: http://www.developer.nokia.com/Develop/Maps/TC.html
    Details of the various licensing options can be found here: http://www.developer.nokia.com/Develop/Maps/FAQ/

    You should create an API Id + Token for each application you create. The limits are applied on a per application basis, not on I.P.

Similar Threads

  1. QGeoMapRouteObject + polyline display issue
    By Shubz in forum [Archived] Qt Mobility Project
    Replies: 3
    Last Post: 2011-06-14, 20:13
  2. Replies: 14
    Last Post: 2008-03-12, 03:30
  3. Re: Error in polyline/polygon using S60 3rd Edition
    By RB_Sahu in forum Symbian C++
    Replies: 12
    Last Post: 2007-12-27, 12:48

Posting Permissions

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