Direction api: check if a place falls in the route path between 2 places

Adarsh Konchady picture Adarsh Konchady · Dec 10, 2013 · Viewed 19k times · Source

I am using Google Direction API to plot the route path between 2 places A and B. I am able to do this. Now, I have a requirement to check if given a place C falls in the route path of A and B.

Here is the snapshot of the route path that I have generated from my code.

Route map between A and B

Here is the corresponding code:

function initialize() {
                var input = document.getElementById('searchTextFieldSource');
                var input1 = document.getElementById('searchTextFieldDestination');

                var autocomplete = new google.maps.places.Autocomplete(input);
                var autocomplete1 = new google.maps.places.Autocomplete(input1);
                google.maps.event.addListener(autocomplete1, 'place_changed', function () {
                    var place = autocomplete.getPlace();
                    document.getElementById('city1').value = place.name;
                    var place1Lat = place.geometry.location.lat();
                    var place1Lng = place.geometry.location.lng();
                    document.getElementById('cityLat1').value = place1Lat;
                    document.getElementById('cityLng1').value = place1Lng;

                    var obj = new Object();
                    obj.city =place.name;
                    obj.latitude = place.geometry.location.lat();
                    obj.longitude = place.geometry.location.lng();
                    locations.push(obj);


                    var place2 = autocomplete1.getPlace();
                    document.getElementById('city2').value = place2.name;
                    var place2Lat = place2.geometry.location.lat();
                    var place2Lng = place2.geometry.location.lng();
                    document.getElementById('cityLat2').value = place2Lat;
                    document.getElementById('cityLng2').value = place2Lng;

                    var obj = new Object();
                    obj.city = place2.name;
                    obj.latitude = place2.geometry.location.lat();
                    obj.longitude = place2.geometry.location.lng();
                    locations.push(obj);

                    directionsDisplay = new google.maps.DirectionsRenderer();
                    var startPlace = new google.maps.LatLng(place1Lat, place1Lng);

                    var mapOptions = {
                        zoom:7,
                        center: startPlace
                    }

                    var map = new google.maps.Map(document.getElementById('map'), mapOptions);
                    directionsDisplay.setMap(map);
                    //refreshMap(locations);

                    var start = $("#city1").val();
                    var end = $("#city2").val();
                    var request = {
                          origin:start,
                          destination:end,
                          travelMode: google.maps.TravelMode.DRIVING
                    };
                    directionsService.route(request, function(response, status) {
                        if (status == google.maps.DirectionsStatus.OK) {
                          directionsDisplay.setDirections(response);
                        }
                    });
                });
            }

How can I go about it?

Answer

Adam picture Adam · Dec 10, 2013

You can use the geometry library that (you can request with google maps by changing your script src to https://maps.googleapis.com/maps/api/js?sensor=false&libraries=geometry) and use isLocationOnEdge and use the LatLng of point C and the polyline that is returned from the DirectionsService.

https://developers.google.com/maps/documentation/javascript/geometry#isLocationOnEdge

Then again, point C could ALWAYS be on the way between A and B if you added it as a waypoint, so determining if point C is "on the way" is actually a bit of a tricky concept - how far out of the way is too far for it to not be "on the way"?