title: Google Api map with directions using javascript
body: <pre><code>  (function(){
  window.onload =function(){
  var directionsDisplay;
  var directionsService = new google.maps.DirectionsService();
  
  directionsDisplay = new google.maps.DirectionsRenderer();
      document.getElementById("lat").style.visibility = "hidden";
      document.getElementById("longi").style.visibility = "hidden";
      document.getElementById("number").style.visibility = "hidden";
      document.getElementById("addressone").style.visibility = "hidden";
      document.getElementById("city").style.visibility = "hidden";
      document.getElementById("countie").style.visibility = "hidden";
      document.getElementById("postcode").style.visibility = "hidden";
      var mapDiv = document.getElementById('map');
      var latitude = document.frmOne.lat.value;
      var longitude = document.frmOne.longi.value;
      var number = document.frmOne.number.value;
      var addressone = document.frmOne.addressone.value;
      var city = document.frmOne.city.value;
      var countie = document.frmOne.countie.value;
      var postcode = document.frmOne.postcode.value;
      var latlng = new google.maps.LatLng(latitude,longitude);
      var options ={
          center:latlng,
          zoom:18,
          mapTypeId:google.maps.MapTypeId.ROADMAP
  
      };
  
      var map= new google.maps.Map(document.getElementById('map'),options);
       directionsDisplay.setMap(map);
  
        var marker = new google.maps.Marker({
      position: new google.maps.LatLng(latitude,longitude),
    map: map,
    title: 'Click me'
     });
  
      var infowindow = new google.maps.InfoWindow({
    content: number+" "+addressone+"&lt;br&gt;"+city+"&lt;br&gt;"+countie+"&lt;br&gt;"+postcode
     });
  
      google.maps.event.addListener(marker, 'click', function() {
    // Calling the open method of the infoWindow
    infowindow.open(map, marker);
  });
  
  
   var start = (latitude,longitude);
   var end = "51.403650,-1.323252";
   var request = {
  origin:start,
  destination:end,
  travelMode: google.maps.TravelMode.DRIVING
    };
      directionsService.route(request, function(result, status) {
      if (status == google.maps.DirectionsStatus.OK) {
    directionsDisplay.setDirections(result);
      }
      });
  
  
  
      };
     })();
  </code></pre>
  
  <p>The longitude and latitude is generated with php and works perfect. The map loads including the marker but the directions do not show.</p>
  
  <p>I can't find a good tutorial on directions so if anyone know of that would also be a help
  I know my code isn't very tidy but I'm not very good with java script.</p>