main.js

var map; // introduce the map variable first, otherwise it only shows up inside the initialize() function and is unknown outside of it.

// funcion that creates the map
function initialize() {
  // this code here are the functions that make the directions api work
  var directionsRenderer = new google.maps.DirectionsRenderer();
  var directionsService = new google.maps.DirectionsService();
  map = new google.maps.Map(document.getElementById("map"), {
    zoom: 1,
    center: { lat: 122.15674, lng: 10.21076 }
  });
  directionsRenderer.setMap(map);
  document
    .getElementById("directionsForm")
    .addEventListener("submit", function(e) {
      e.preventDefault();
      calculateAndDisplayRoute(directionsService, directionsRenderer);
    });

  var options = {
    componentRestrictions: { country: "dk" }
  };

  var acInputs = document.getElementsByClassName("autocomplete");

  for (var i = 0; i < acInputs.length; i++) {
    var autocomplete = new google.maps.places.Autocomplete(
      acInputs[i],
      options
    );
    autocomplete.inputId = acInputs[i].id;
  }
}

function calculateAndDisplayRoute(directionsService, directionsRenderer) {
  var mode = document.getElementById("mode").value;
  var start = document.getElementById("ac1").value;
  var end = document.getElementById("ac2").value;

  directionsService.route(
    {
      origin: start,
      destination: end,
      travelMode: google.maps.TravelMode[mode]
    },
    function(response, status) {
      if (status == "OK") {
        // start
        console.log(response.routes[0].overview_path[0].lat());
        console.log(response.routes[0].overview_path[0].lng());

        url =
          "/test?lat=" +
          response.routes[0].overview_path[0].lat() +
          "&lng=" +
          response.routes[0].overview_path[0].lng();
        console.log(url);

        // turns ot we don't even need jQuery's ajax function 
        map.data.loadGeoJson(url);

        // end
        route_length = response.routes[0].overview_path.length;

        console.log(response.routes[0].overview_path[route_length - 1].lat());
        console.log(response.routes[0].overview_path[route_length - 1].lng());

        directionsRenderer.setDirections(response);
      } else {
        window.alert("Directions request failed due to " + status);
      }
    }
  );
}