Error with “new google.maps.directionService()” on google maps api-Collection of common programming errors

I’m tryng to do a map with google maps api and jquery-mobile, the map I want to do it’s a directions map. I’ve two GPS coordinate and I wanto to show the way betwen the two points when the map is initialized. This is the code:

and the code of the script is:

var dirService;

var render;

function calcolateRoute(){

   dirService = new google.maps.directionService();

   var myOrigin = new google.maps.LatLng( 46.448327,12.37707);

   var myDestination = new google.maps.LatLng( 46.443993,12.388498)

   var mapOptions = {

  zoom:7,

  mapTypeId: google.maps.MapTypeId.ROADMAP,

  center: myOrigin};

  var map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);

  var renderOpt = { map:map };
render = new google.maps.directionRenderer(renderOpt);

var requestRoute = {

        origin: myOrigin,

        destination: myDestination,

        travelMode: google.maps.travelMode.BICYCLING};

dirService.route(requestRoute, function(result, status){

if(status == google.maps.DirectionsStatus.OK){

    render.setDirection(result);                        

}else{

            alert('ERROR ');}

});



}
 

When the browser render the page i receive this error:

Uncaught TypeError: undefined is not a function

at the line

dirService = new google.maps.directionService();

I don’t understand why the script return the error…. Someone can help me? Sorry for my bad english!!

1. You are spelling the DirectionsService incorrectly

   Should be:

   dirService = new google.maps.directionsService();
   

   Not:

   dirService = new google.maps.directionService();
   

Originally posted 2013-11-13 09:48:32.