Jump to content


 


Register a free account to unlock additional features at BleepingComputer.com
Welcome to BleepingComputer, a free community where people like yourself come together to discuss and learn how to use their computers. Using the site is easy and fun. As a guest, you can browse and view the various discussions in the forums, but can not create a new topic or reply to an existing one unless you are logged in. Other benefits of registering an account are subscribing to topics and forums, creating a blog, and having no ads shown anywhere on the site.


Click here to Register a free account now! or read our Welcome Guide to learn how to use this site.

Photo

Showing multiple directions in Google Maps API?


  • Please log in to reply
3 replies to this topic

#1 David7626

David7626

  • Members
  • 29 posts
  • OFFLINE
  •  
  • Local time:01:04 PM

Posted 22 June 2015 - 09:59 AM

i'm trying to show multiple routes on a map from city to city in Google Maps, but I so far I only have one route working.

 

This is the code I have at the moment.

 

 

 

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<title>Display directions</title>
<style>
html, body, #map-canvas {
height: 100%;
margin: 0px;
padding: 0px
}
</style>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&signed_in=true"></script>
<script>

var rendererOptions = {
draggable: false
};
var directionsDisplay = new google.maps.DirectionsRenderer(rendererOptions);;
var directionsService = new google.maps.DirectionsService();
//var directionsDisplay2 = new google.maps.DirectionsRenderer(rendererOptions);;
//var directionsService2 = new google.maps.DirectionsService();
var map;

var australia = new google.maps.LatLng(-25.274398, 133.775136);

function initialize() {

var mapOptions = {
zoom: 5,
center: australia
};
map = new google.maps.Map(document.getElementById('map-canvasmapOptions);
directionsDisplay.setMap(map);
directionsDisplay.setPanel(document.getElementById('directionsPanel'));

google.maps.event.addListener(directionsDisplay, 'directions_changed', function() {
computeTotalDistance(directionsDisplay.getDirections());
});

calcRoute1();
/* calcRoute2(); */
}

function calcRoute1() {

var request = {
origin: 'Sydney, NSW',
destination: 'Melbourne, VIC',

travelMode: google.maps.TravelMode.DRIVING
};

directionsService.route(request, function(response, status) {
if (status == google.maps.DirectionsStatus.OK) {
directionsDisplay.setDirections(response);
}
});
}

/*function calcRoute2() {

var request2 = {
origin: 'Melbourne, VIC',
destination: 'Hobart, TAS',

travelMode: google.maps.TravelMode.DRIVING
};

directionsService2.route(request2, function(response, status) {
if (status == google.maps.DirectionsStatus.OK) {
directionsDisplay2.setDirections(response);
}
});
}*/


function computeTotalDistance(result) {
var total = 0;
var myroute = result.routes[0];
for (var i = 0; i < myroute.legs.length; i++) {
total += myroute.legs[i].distance.value;
}
total = total / 1000.0;
document.getElementById('total').innerHTML = total + ' km';
}

google.maps.event.addDomListener(window, 'load', initialize);

</script>
</head>
<body>
<div id="map-canvas"></div>
</div>
</body>
</html>

 



BC AdBot (Login to Remove)

 


#2 David7626

David7626
  • Topic Starter

  • Members
  • 29 posts
  • OFFLINE
  •  
  • Local time:01:04 PM

Posted 22 June 2015 - 09:15 PM

I've modified my code, and I've nearly managed to get it working completely. My only problem is the last two directions (routeSeventeen and routeEighteen) are NOT rendering on screen for some reason.

 

 

<head>

<script>
function initialize() {
    var goo         = google.maps,
        map         = new goo.Map(document.getElementById('map-canvas'),
                                  {
                                    center  : new goo.LatLng(-25.274398, 133.775136),
                                    zoom    : 2
                                  }
                                 ),
        App         = { map               : map,
                        bounds            : new goo.LatLngBounds(),
                        directionsService : new goo.DirectionsService(),    
                        directionsDisplay1: new goo.DirectionsRenderer({
                                              map             : map,
                                              preserveViewport: true,
                                              suppressMarkers : true,
                                              polylineOptions : {strokeColor:'green'},
                                              panel           : document.getElementById('panel').appendChild(document.createElement('li'))}),
                        directionsDisplay2: new goo.DirectionsRenderer({
                                              map             : map,
                                              preserveViewport: true,
                                              suppressMarkers : true,
                                              polylineOptions : {strokeColor:'green'},
                                              panel           : document.getElementById('panel').appendChild(document.createElement('li'))}),
                        directionsDisplay3: new goo.DirectionsRenderer({
                                              map             : map,
                                              preserveViewport: true,
                                              suppressMarkers : true,
                                              polylineOptions : {strokeColor:'green'},
                                              panel           : document.getElementById('panel').appendChild(document.createElement('li'))}),
directionsDisplay4: new goo.DirectionsRenderer({
 map    : map,
 preserveViewport : true,
                                              suppressMarkers  : true,
     polylineOptions  : {strokeColor:'green'},
 panel    : document.getElementById('panel').appendChild(document.createElement('li'))}),
directionsDisplay5: new goo.DirectionsRenderer({
 map    : map,
 preserveViewport : true,
                                              suppressMarkers  : true,
     polylineOptions  : {strokeColor:'green'},
 panel    : document.getElementById('panel').appendChild(document.createElement('li'))}),
directionsDisplay6: new goo.DirectionsRenderer({
 map    : map,
 preserveViewport : true,
                                              suppressMarkers  : true,
     polylineOptions  : {strokeColor:'green'},
 panel    : document.getElementById('panel').appendChild(document.createElement('li'))}),
directionsDisplay7: new goo.DirectionsRenderer({
 map    : map,
 preserveViewport : true,
                                              suppressMarkers  : true,
     polylineOptions  : {strokeColor:'green'},
 panel    : document.getElementById('panel').appendChild(document.createElement('li'))}),
directionsDisplay8: new goo.DirectionsRenderer({
 map    : map,
 preserveViewport : true,
                                              suppressMarkers  : true,
     polylineOptions  : {strokeColor:'green'},
 panel    : document.getElementById('panel').appendChild(document.createElement('li'))}),
directionsDisplay9: new goo.DirectionsRenderer({
 map    : map,
 preserveViewport : true,
                                              suppressMarkers  : true,
     polylineOptions  : {strokeColor:'green'},
 panel    : document.getElementById('panel').appendChild(document.createElement('li'))}),
directionsDisplay10: new goo.DirectionsRenderer({
 map : map,
 preserveViewport  : true,
 suppressMarkers   : true,
 polylineOptions   : {strokeColor:'green'},
 panel : document.getElementById('panel').appendChild(document.createElement('li'))}),
directionsDisplay11: new goo.DirectionsRenderer({
 map : map,
 preserveViewport  : true,
 suppressMarkers   : true,
 polylineOptions   : {strokeColor:'green'},
 panel : document.getElementById('panel').appendChild(document.createElement('li'))}),
directionsDisplay12: new goo.DirectionsRenderer({
 map : map,
 preserveViewport  : true,
 suppressMarkers   : true,
 polylineOptions   : {strokeColor:'green'},
 panel : document.getElementById('panel').appendChild(document.createElement('li'))}),
directionsDisplay13: new goo.DirectionsRenderer({
 map : map,
 preserveViewport  : true,
 suppressMarkers   : true,
 polylineOptions   : {strokeColor:'green'},
 panel : document.getElementById('panel').appendChild(document.createElement('li'))}),
directionsDisplay14: new goo.DirectionsRenderer({
 map : map,
 preserveViewport : true,
 suppressMarkers   : true,
 polylineOptions   : {strokeColor:'green'},
 panel : document.getElementById('panel').appendChild(document.createElement('li'))}),
directionsDisplay15: new goo.DirectionsRenderer({
 map : map,
 preserveViewport  : true,
 suppressMarkers   : true,
 polylineOptions   : {strokeColor:'green'},
 panel      : document.getElementById('panel').appendChild(document.createElement('li'))}),
directionsDisplay16: new goo.DirectionsRenderer({
map : map,
preserveViewport   : true,
suppressMarkers    : true,
polylineOptions    : {strokeColor:'green'},
panel : document.getElementById('panel').appendChild(document.createElement('li'))}),
directionsDisplay17: new goo.DirectionsRenderer({
map : map,
preserveViewport    : true,
suppressMarkers     : true,
polylineOptions     : {strokeColor:'green'},
panel : document.getElementById('panel').appendChild(document.createElement('li'))}),
directionsDisplay18: new goo.DirectionsRenderer({
map : map,
preserveViewport    : true,
suppressMarkers     : true,
polylineOptions     : {strokeColor:'green'},
panel : document.getElementById('panel').appendChild(document.createElement('li'))
})
            },
         routeOne   = {  origin     :  'Sydney, NSW',
                        destination :  'Brisbane, QLD', //Pacific Highway - coast
                        travelMode  :  goo.TravelMode.DRIVING},        
         routeTwo  = {  origin      :  'Hexham, NSW',
                        destination :  'Yarraman, QLD', 
                        travelMode  :  goo.TravelMode.DRIVING},        
        routeThree = { origin       :  'Sydney, NSW',
                        destination :  'Melbourne, VIC',
                        travelMode  :  goo.TravelMode.DRIVING},
routeFour  = { origin       : 'Sydney, NSW',
  destination  : 'Adelaide, SA',
  travelMode   : goo.TravelMode.DRIVING},
routeFive  = { origin      : 'Sydney, NSW',
  destination  : 'Perth, WA',
  travelMode   : goo.TravelMode.DRIVING},
routeSix  = { origin        : 'Sydney, NSW',
  destination  : 'Darwin, NT',
  travelMode   : goo.TravelMode.DRIVING},
routeSeven  = { origin      : 'Melbourne, VIC',
  destination  : 'Adelaide, SA',
  travelMode   : goo.TravelMode.DRIVING},
routeEight  = { origin      : 'Melbourne, VIC',
  destination  : 'Perth, WA',
  travelMode   : goo.TravelMode.DRIVING},
routeNine   = { origin      : 'Melbourne, VIC',
   destination : 'Darwin, NT',
travelMode  : goo.TravelMode.DRIVING},
routeTen    = { origin      : 'Melbourne, VIC',
destination : 'Brisbane, QLD',
travelMode  : goo.TravelMode.DRIVING},
routeEleven = { origin      : 'Adelaide, SA',
destination : 'Perth, WA',
travelMode  : goo.TravelMode.DRIVING},
routeTwelve = { origin      : 'Adelaide, SA',
destination : 'Darwin, NT',
travelMode  : goo.TravelMode.DRIVING},
routeThirteen = {origin     : 'Adelaide, SA',
destination : 'Brisbane, QLD',
travelMode : goo.TravelMode.DRIVING},
routeFourteen = { origin     : 'Perth, WA',
 destination : 'Darwin, NT', 
 travelMode : goo.TravelMode.DRIVING},
routeFifteen =  { origin     : 'Perth, WA',
                          destination : 'Brisbane, QLD',
 travelMode  : goo.TravelMode.DRIVING},
routeSixteen =  {origin      : 'Darwin, NT',
                         destination : 'Brisbane, QLD',
travelMode  : goo.TravelMode.DRIVING},
routeSeventeen =  {origin      : 'Hobart, TAS',
                         destination : 'Burnie, TAS',
travelMode  : goo.TravelMode.DRIVING},
routeEighteen = { origin    : 'Perth, WA',
                           destination : 'Port Hedland, WA', 
travelMode : goo.TravelMode.DRIVING};
      
      App.directionsService.route(routeOne, function(result, status) {
        if (status == google.maps.DirectionsStatus.OK) {
          App.directionsDisplay1.setDirections(result);
          App.map.fitBounds(App.bounds.union(result.routes[0].bounds));
        }
      }); 
      
      App.directionsService.route(routeTwo, function(result, status) {
        if (status == google.maps.DirectionsStatus.OK) {
          App.directionsDisplay2.setDirections(result);
          App.map.fitBounds(App.bounds.union(result.routes[0].bounds));
        }
      });
      
      App.directionsService.route(routeThree, function(result, status) {
        if (status == google.maps.DirectionsStatus.OK) {
          App.directionsDisplay3.setDirections(result);
          App.map.fitBounds(App.bounds.union(result.routes[0].bounds));
        }
      });
 
 App.directionsService.route(routeFour, function(result, status) {
        if (status == google.maps.DirectionsStatus.OK) {
          App.directionsDisplay4.setDirections(result);
          App.map.fitBounds(App.bounds.union(result.routes[0].bounds));
        }
      });
 
 App.directionsService.route(routeFive, function(result, status) {
        if (status == google.maps.DirectionsStatus.OK) {
          App.directionsDisplay5.setDirections(result);
          App.map.fitBounds(App.bounds.union(result.routes[0].bounds));
        }
      });
 
  App.directionsService.route(routeSix, function(result, status) {
        if (status == google.maps.DirectionsStatus.OK) {
          App.directionsDisplay6.setDirections(result);
          App.map.fitBounds(App.bounds.union(result.routes[0].bounds));
        }
      });
 
 App.directionsService.route(routeSeven, function(result, status) {
        if (status == google.maps.DirectionsStatus.OK) {
          App.directionsDisplay7.setDirections(result);
          App.map.fitBounds(App.bounds.union(result.routes[0].bounds));
        }
      });
 
 App.directionsService.route(routeEight, function(result, status) {
        if (status == google.maps.DirectionsStatus.OK) {
          App.directionsDisplay8.setDirections(result);
          App.map.fitBounds(App.bounds.union(result.routes[0].bounds));
        }
      });
 
 App.directionsService.route(routeNine, function(result, status) {
  if (status == google.maps.DirectionsStatus.OK) {
 App.directionsDisplay9.setDirections(result);
 App.map.fitBounds(App.bounds.union(result.routes[0].bounds));
  }
 });
 
 App.directionsService.route(routeTen, function(result, status) {
  if (status == google.maps.DirectionsStatus.OK) {
 App.directionsDisplay10.setDirections(result);
 App.map.fitBounds(App.bounds.union(result.routes[0].bounds));
  }
 });
 
 App.directionsService.route(routeEleven, function(result, status) {
  if (status == google.maps.DirectionsStatus.OK) {
 App.directionsDisplay11.setDirections(result);
 App.map.fitBounds(App.bounds.union(result.routes[0].bounds));
  }
 });
 
 App.directionsService.route(routeTwelve, function(result, status) {
  if (status == google.maps.DirectionsStatus.OK) {
 App.directionsDisplay12.setDirections(result);
 App.map.fitBounds(App.bounds.union(result.routes[0].bounds));
  }
 });
 
 App.directionsService.route(routeThirteen, function(result, status) {
  if (status == google.maps.DirectionsStatus.OK) {
 App.directionsDisplay13.setDirections(result);
 App.map.fitBounds(App.bounds.union(result.routes[0].bounds));
  }
 });
 
 App.directionsService.route(routeFourteen, function(result, status) {
  if (status == google.maps.DirectionsStatus.OK) {
 App.directionsDisplay14.setDirections(result);
 App.map.fitBounds(App.bounds.union(result.routes[0].bounds));
  }
 });
 
 App.directionsService.route(routeFifteen, function(result, status) {
  if (status == google.maps.DirectionsStatus.OK) {
 App.directionsDisplay15.setDirections(result);
 App.map.fitBounds(App.bounds.union(result.routes[0].bounds));
  }
 });
 
 App.directionsService.route(routeSixteen, function(result, status) {
  if (status == google.maps.DirectionsStatus.OK) {
 App.directionsDisplay16.setDirections(result);
 App.map.fitBounds(App.bounds.union(result.routes[0].bounds));
  }
 });
 
 App.directionsService.route(routeSeventeen, function(result, status) {
  if (status == google.maps.DirectionsStatus.OK) {
 App.directionsDisplay17.setDirections(result);
 App.map.fitBounds(App.bounds.union(result.routes[0].bounds));
  }
 });
 
 App.directionsService.route(routeEighteen, function(result, status) {
  if (status == google.maps.DirectionsStatus.OK) {
 App.directionsDisplay18.setDirections(result);
 App.map.fitBounds(App.bounds.union(result.routes[0].bounds));
  }
 });   
}
 
google.maps.event.addDomListener(window, 'load', initialize);
</script>
<style>
      html, body, #map-canvas {
        height: 100%;
        margin: 0px;
        padding: 0px
      }
      #panel li:before{
        
        padding: 3px;
        display:block;
        color:#fff;
        font-weight:bold;
      } 
 
</style>
</head>
<body>
<div id="map-canvas"></div>
<ol id="panel"></ol>
</body>
</html>
 

 


Please help?



#3 technonymous

technonymous

  • Members
  • 2,516 posts
  • OFFLINE
  •  
  • Gender:Male
  • Local time:07:04 PM

Posted 27 June 2015 - 08:28 PM

I am in no way an expert in coding this, but it seems like it's not showing up because you possibly have to include another function for latitiude longitude etc for Tasmania by itself and include that code there since they are two different bodies. Or code a new html map entirely just for Tasmania. That would be my best guess. It's been a long time since I done any hmtl scripting stuff.


Edited by technonymous, 27 June 2015 - 09:08 PM.


#4 David7626

David7626
  • Topic Starter

  • Members
  • 29 posts
  • OFFLINE
  •  
  • Local time:01:04 PM

Posted 02 July 2015 - 10:25 PM

It turns out that Google Maps has a limit of certain directions you can display on screen. OVER_QUERY_LIMIT states anything over ten directions won't be displayed on screen.

 

 

<html>

<head>
<style>
html, body, #map-canvas {
    height: 100%;
    margin: 0px;
    padding: 0px
}
#panel li:before {
    padding: 3px;
    display:block;
    color:#fff;
    font-weight:bold;
}
</style>
<script>
 
function initialize() {
wait = true;
    setTimeout("wait = true", 2000);
  var goo = google.maps,
    map = new goo.Map(document.getElementById('map-canvas'), {
      center: new goo.LatLng(-25.274398, 133.775136),
      zoom: 2
    }),
    App = {
      map: map,
      bounds: new goo.LatLngBounds(),
      directionsService: new goo.DirectionsService(),
      directionsDisplay1: new goo.DirectionsRenderer({
        map: map,
        preserveViewport: true,
        suppressMarkers: true,
        polylineOptions: {
          strokeColor: 'green'
        },
        panel: document.getElementById('panel').appendChild(document.createElement('li'))
      }),
      directionsDisplay2: new goo.DirectionsRenderer({
        map: map,
        preserveViewport: true,
        suppressMarkers: true,
        polylineOptions: {
          strokeColor: 'green'
        },
        panel: document.getElementById('panel').appendChild(document.createElement('li'))
      }),
      directionsDisplay3: new goo.DirectionsRenderer({
        map: map,
        preserveViewport: true,
        suppressMarkers: true,
        polylineOptions: {
          strokeColor: 'green'
        },
        panel: document.getElementById('panel').appendChild(document.createElement('li'))
      }),
      directionsDisplay4: new goo.DirectionsRenderer({
        map: map,
        preserveViewport: true,
        suppressMarkers: true,
        polylineOptions: {
          strokeColor: 'green'
        },
        panel: document.getElementById('panel').appendChild(document.createElement('li'))
      }),
      directionsDisplay5: new goo.DirectionsRenderer({
        map: map,
        preserveViewport: true,
        suppressMarkers: true,
        polylineOptions: {
          strokeColor: 'green'
        },
        panel: document.getElementById('panel').appendChild(document.createElement('li'))
      }),
      directionsDisplay6: new goo.DirectionsRenderer({
        map: map,
        preserveViewport: true,
        suppressMarkers: true,
        polylineOptions: {
          strokeColor: 'green'
        },
        panel: document.getElementById('panel').appendChild(document.createElement('li'))
      }),
      directionsDisplay7: new goo.DirectionsRenderer({
        map: map,
        preserveViewport: true,
        suppressMarkers: true,
        polylineOptions: {
          strokeColor: 'green'
        },
        panel: document.getElementById('panel').appendChild(document.createElement('li'))
      }),
      directionsDisplay8: new goo.DirectionsRenderer({
        map: map,
        preserveViewport: true,
        suppressMarkers: true,
        polylineOptions: {
          strokeColor: 'green'
        },
        panel: document.getElementById('panel').appendChild(document.createElement('li'))
      }),
      directionsDisplay9: new goo.DirectionsRenderer({
        map: map,
        preserveViewport: true,
        suppressMarkers: true,
        polylineOptions: {
          strokeColor: 'green'
        },
        panel: document.getElementById('panel').appendChild(document.createElement('li'))
      }),
      directionsDisplay10: new goo.DirectionsRenderer({
        map: map,
        preserveViewport: true,
        suppressMarkers: true,
        polylineOptions: {
          strokeColor: 'green'
        },
        panel: document.getElementById('panel').appendChild(document.createElement('li'))
      }),
      directionsDisplay11: new goo.DirectionsRenderer({
        map: map,
        preserveViewport: true,
        suppressMarkers: true,
        polylineOptions: {
          strokeColor: 'green'
        },
        panel: document.getElementById('panel').appendChild(document.createElement('li'))
      }),
      directionsDisplay12: new goo.DirectionsRenderer({
        map: map,
        preserveViewport: true,
        suppressMarkers: true,
        polylineOptions: {
          strokeColor: 'green'
        },
        panel: document.getElementById('panel').appendChild(document.createElement('li'))
      }),
      directionsDisplay13: new goo.DirectionsRenderer({
        map: map,
        preserveViewport: true,
        suppressMarkers: true,
        polylineOptions: {
          strokeColor: 'green'
        },
        panel: document.getElementById('panel').appendChild(document.createElement('li'))
      }),
      directionsDisplay14: new goo.DirectionsRenderer({
        map: map,
        preserveViewport: true,
        suppressMarkers: true,
        polylineOptions: {
          strokeColor: 'green'
        },
        panel: document.getElementById('panel').appendChild(document.createElement('li'))
      }),
      directionsDisplay15: new goo.DirectionsRenderer({
        map: map,
        preserveViewport: true,
        suppressMarkers: true,
        polylineOptions: {
          strokeColor: 'green'
        },
        panel: document.getElementById('panel').appendChild(document.createElement('li'))
      }),
      directionsDisplay16: new goo.DirectionsRenderer({
        map: map,
        preserveViewport: true,
        suppressMarkers: true,
        polylineOptions: {
          strokeColor: 'green'
        },
        panel: document.getElementById('panel').appendChild(document.createElement('li'))
      }),
      directionsDisplay17: new goo.DirectionsRenderer({
        map: map,
        preserveViewport: true,
        suppressMarkers: true,
        polylineOptions: {
          strokeColor: 'green'
        },
        panel: document.getElementById('panel').appendChild(document.createElement('li'))
      }),
      directionsDisplay18: new goo.DirectionsRenderer({
        map: map,
        preserveViewport: true,
        suppressMarkers: true,
        polylineOptions: {
          strokeColor: 'green'
        },
        panel: document.getElementById('panel').appendChild(document.createElement('li'))
      })
    },
    routeOne = {
      origin: 'Sydney, NSW',
      destination: 'Brisbane, QLD', //Pacific Highway - coast
      travelMode: goo.TravelMode.DRIVING
    },
    routeTwo = {
      origin: 'Hexham, NSW',
      destination: 'Yarraman, QLD',
      travelMode: goo.TravelMode.DRIVING
    },
    routeThree = {
      origin: 'Sydney, NSW',
      destination: 'Melbourne, VIC',
      travelMode: goo.TravelMode.DRIVING
    },
    routeFour = {
      origin: 'Sydney, NSW',
      destination: 'Adelaide, SA',
      travelMode: goo.TravelMode.DRIVING
    },
    routeFive = {
      origin: 'Sydney, NSW',
      destination: 'Perth, WA',
      travelMode: goo.TravelMode.DRIVING
    },
    routeSix = {
      origin: 'Sydney, NSW',
      destination: 'Darwin, NT',
      travelMode: goo.TravelMode.DRIVING
    },
    routeSeven = {
      origin: 'Melbourne, VIC',
      destination: 'Adelaide, SA',
      travelMode: goo.TravelMode.DRIVING
    },
    routeEight = {
      origin: 'Melbourne, VIC',
      destination: 'Perth, WA',
      travelMode: goo.TravelMode.DRIVING
    },
    routeNine = {
      origin: 'Melbourne, VIC',
      destination: 'Darwin, NT',
      travelMode: goo.TravelMode.DRIVING
    },
    routeTen = {
      origin: 'Melbourne, VIC',
      destination: 'Brisbane, QLD',
      travelMode: goo.TravelMode.DRIVING
    },
    routeEleven = {
      origin: 'Adelaide, SA',
      destination: 'Perth, WA',
      travelMode: goo.TravelMode.DRIVING
    },
    routeTwelve = {
      origin: 'Adelaide, SA',
      destination: 'Darwin, NT',
      travelMode: goo.TravelMode.DRIVING
    },
    routeThirteen = {
      origin: 'Adelaide, SA',
      destination: 'Brisbane, QLD',
      travelMode: goo.TravelMode.DRIVING
    },
    routeFourteen = {
      origin: 'Perth, WA',
      destination: 'Darwin, NT',
      travelMode: goo.TravelMode.DRIVING
    },
    routeFifteen = {
      origin: 'Perth, WA',
      destination: 'Brisbane, QLD',
      travelMode: goo.TravelMode.DRIVING
    },
    routeSixteen = {
      origin: 'Darwin, NT',
      destination: 'Brisbane, QLD',
      travelMode: goo.TravelMode.DRIVING
    },
    routeSeventeen = {
      origin: 'Hobart, TAS',
      destination: 'Burnie, TAS',
      travelMode: goo.TravelMode.DRIVING
    },
    routeEighteen = {
      origin: 'Perth, WA',
      destination: 'Port Hedland, WA',
      travelMode: goo.TravelMode.DRIVING
    };
 
  App.directionsService.route(routeOne, function(result, status) {
    if (status == google.maps.DirectionsStatus.OK) {
      App.directionsDisplay1.setDirections(result);
      App.map.fitBounds(App.bounds.union(result.routes[0].bounds));
    } else {
      document.getElementById('status').innerHTML += "directionsDisplay1:" + status + "<br>";
    }
  });
 
  App.directionsService.route(routeTwo, function(result, status) {
    if (status == google.maps.DirectionsStatus.OK) {
      App.directionsDisplay2.setDirections(result);
      App.map.fitBounds(App.bounds.union(result.routes[0].bounds));
    } else {
      document.getElementById('status').innerHTML += "directionsDisplay2:" + status + "<br>";
    }
  });
 
  App.directionsService.route(routeThree, function(result, status) {
    if (status == google.maps.DirectionsStatus.OK) {
      App.directionsDisplay3.setDirections(result);
      App.map.fitBounds(App.bounds.union(result.routes[0].bounds));
    } else {
      document.getElementById('status').innerHTML += "directionsDisplay3:" + status + "<br>";
    }
  });
 
  App.directionsService.route(routeFour, function(result, status) {
    if (status == google.maps.DirectionsStatus.OK) {
      App.directionsDisplay4.setDirections(result);
      App.map.fitBounds(App.bounds.union(result.routes[0].bounds));
    } else {
      document.getElementById('status').innerHTML += "directionsDisplay4:" + status + "<br>";
    }
  });
 
  App.directionsService.route(routeFive, function(result, status) {
    if (status == google.maps.DirectionsStatus.OK) {
      App.directionsDisplay5.setDirections(result);
      App.map.fitBounds(App.bounds.union(result.routes[0].bounds));
    } else {
      document.getElementById('status').innerHTML += "directionsDisplay5:" + status + "<br>";
    }
  });
 
  App.directionsService.route(routeSix, function(result, status) {
    if (status == google.maps.DirectionsStatus.OK) {
      App.directionsDisplay6.setDirections(result);
      App.map.fitBounds(App.bounds.union(result.routes[0].bounds));
    } else {
      document.getElementById('status').innerHTML += "directionsDisplay6:" + status + "<br>";
    }
  });
 
  App.directionsService.route(routeSeven, function(result, status) {
    if (status == google.maps.DirectionsStatus.OK) {
      App.directionsDisplay7.setDirections(result);
      App.map.fitBounds(App.bounds.union(result.routes[0].bounds));
    } else {
      document.getElementById('status').innerHTML += "directionsDisplay7:" + status + "<br>";
    }
  });
 
  App.directionsService.route(routeEight, function(result, status) {
    if (status == google.maps.DirectionsStatus.OK) {
      App.directionsDisplay8.setDirections(result);
      App.map.fitBounds(App.bounds.union(result.routes[0].bounds));
    } else {
      document.getElementById('status').innerHTML += "directionsDisplay8:" + status + "<br>";
    }
  });
 
  App.directionsService.route(routeNine, function(result, status) {
    if (status == google.maps.DirectionsStatus.OK) {
      App.directionsDisplay9.setDirections(result);
      App.map.fitBounds(App.bounds.union(result.routes[0].bounds));
    } else {
      document.getElementById('status').innerHTML += "directionsDisplay9:" + status + "<br>";
    }
  });
 
  App.directionsService.route(routeTen, function(result, status) {
    if (status == google.maps.DirectionsStatus.OK) {
      App.directionsDisplay10.setDirections(result);
      App.map.fitBounds(App.bounds.union(result.routes[0].bounds));
    } else {
      document.getElementById('status').innerHTML += "directionsDisplay10:" + status + "<br>";
    }
  });
 
  App.directionsService.route(routeEleven, function(result, status) {
    if (status == google.maps.DirectionsStatus.OK) {
      App.directionsDisplay11.setDirections(result);
      App.map.fitBounds(App.bounds.union(result.routes[0].bounds));
    } else {
      document.getElementById('status').innerHTML += "directionsDisplay11:" + status + "<br>";
    }
  });
 
  App.directionsService.route(routeTwelve, function(result, status) {
    if (status == google.maps.DirectionsStatus.OK) {
      App.directionsDisplay12.setDirections(result);
      App.map.fitBounds(App.bounds.union(result.routes[0].bounds));
    } else {
      document.getElementById('status').innerHTML += "directionsDisplay12:" + status + "<br>";
    }
  });
 
  App.directionsService.route(routeThirteen, function(result, status) {
    if (status == google.maps.DirectionsStatus.OK) {
      App.directionsDisplay13.setDirections(result);
      App.map.fitBounds(App.bounds.union(result.routes[0].bounds));
    } else {
      document.getElementById('status').innerHTML += "directionsDisplay13:" + status + "<br>";
    }
  });
 
  App.directionsService.route(routeFourteen, function(result, status) {
    if (status == google.maps.DirectionsStatus.OK) {
      App.directionsDisplay14.setDirections(result);
      App.map.fitBounds(App.bounds.union(result.routes[0].bounds));
    } else {
      document.getElementById('status').innerHTML += "directionsDisplay14:" + status + "<br>";
    }
  });
 
  App.directionsService.route(routeFifteen, function(result, status) {
    if (status == google.maps.DirectionsStatus.OK) {
      App.directionsDisplay15.setDirections(result);
      App.map.fitBounds(App.bounds.union(result.routes[0].bounds));
    } else {
      document.getElementById('status').innerHTML += "directionsDisplay15:" + status + "<br>";
    }
  });
 
  App.directionsService.route(routeSixteen, function(result, status) {
    if (status == google.maps.DirectionsStatus.OK) {
      App.directionsDisplay16.setDirections(result);
      App.map.fitBounds(App.bounds.union(result.routes[0].bounds));
    } else {
      document.getElementById('status').innerHTML += "directionsDisplay16:" + status + "<br>";
    }
  });
 
  App.directionsService.route(routeSeventeen, function(result, status) {
    if (status == google.maps.DirectionsStatus.OK) {
      App.directionsDisplay17.setDirections(result);
      App.map.fitBounds(App.bounds.union(result.routes[0].bounds));
    } else {
      document.getElementById('status').innerHTML += "directionsDisplay17:" + status + "<br>";
    }
  });
 
  App.directionsService.route(routeEighteen, function(result, status) {
    if (status == google.maps.DirectionsStatus.OK) {
      App.directionsDisplay18.setDirections(result);
      App.map.fitBounds(App.bounds.union(result.routes[0].bounds));
    } else {
      document.getElementById('status').innerHTML += "directionsDisplay18:" + status + "<br>";
    }
  });
}
 
 
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<div id="status"></div>
<div id="map-canvas"></div>
<ol id="panel"></ol>
</body>
</html>

 

If I'm not mistaken, the only possible way to bypass the geolocating limit is if you activate a key and paste it into the JavaScript URL. I haven't tried it yet.






0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users