google maps: check if a city lies on a route

see: http://stackoverflow.com/a/13464069/459897

by secretgspot

HTML

<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&amp;sensor=false&amp;libraries=geometry&amp;.js"></script>
    <div>
    <b>Start: </b>
    <select id="start" onchange="calcRoute();">
      <option selected value="41.8781136, -87.62979819999998">Chicago</option>
      <option value="38.6220845, -90.17469740000001">St Louis</option>
      <option value="37.08422710000001, -94.513281">Joplin, MO</option>
      <option value="35.4675602, -97.51642759999999">Oklahoma City</option>
      <option value="35.2219971, -101.8312968999999">Amarillo</option>
      <option value="35.5280783, -108.74258429999998">Gallup, NM</option>
      <option value="35.20449800000001,-111.40509800000001">Winona</option>
      <option value="35.189443, -114.05300649999998">Kingman</option>
      <option value="34.0522342, -118.2436849">Los Angeles</option>
    </select>
    <b>End: </b>
    <select id="end" onchange="calcRoute();">
      <option value="41.8781136, -87.62979819999998">Chicago</option>
      <option value="38.6220845, -90.17469740000001">St Louis</option>
      <option value="37.08422710000001, -94.513281">Joplin, MO</option>
      <option selected value="35.4675602, -97.51642759999999">Oklahoma City</option>
      <option value="35.2219971, -101.8312968999999">Amarillo</option>
      <option value="35.5280783, -108.74258429999998">Gallup, NM</option>
      <option value="35.20449800000001,-111.40509800000001">Winona</option>
      <option value="35.189443, -114.05300649999998">Kingman</option>
      <option value="34.0522342, -118.2436849">Los Angeles</option>
    </select>is via?
    <select id="via" onchange="checkVia();">
      <option value="41.8781136, -87.62979819999998">Chicago</option>
      <option value="38.6220845, -90.17469740000001">St Louis</option>
      <option value="37.08422710000001, -94.513281">Joplin, MO</option>
      <option value="35.4675602, -97.51642759999999">Oklahoma City</option>
      <option value="35.2219971,...

JavaScript

var directionDisplay,
          directionsService = new google.maps.DirectionsService(),
          map,
          response,marker;
      function checkVia(dir){
        if(dir)response=dir;
        
        var LatLngOfCity = document.getElementById('via').value.split(',');
            LatLngOfCity = new google.maps.LatLng(parseInt(LatLngOfCity[0],10),parseInt(LatLngOfCity[1],10));
        if(!marker){
        marker=new google.maps.Marker({map:map,position:LatLngOfCity});
        }
        else{
          marker.setPosition(LatLngOfCity);
        }
       
        if(response){
        document.getElementById('is_via').innerHTML=google.maps.geometry.poly
                        .isLocationOnEdge(LatLngOfCity,
                                          new google.maps.Polyline({path:google.maps.geometry.encoding.decodePath(response.routes[0].overview_polyline.points)}),
                                          00000000000001);
        var bounds=response.routes[0].bounds;
         bounds.extend(LatLngOfCity);
         map.fitBounds(bounds);
        }
         
         
        else{
          document.getElementById('is_via').innerHTML='';
          map.setCenter(LatLngOfCity);
        }
      }
      function initialize() {
        directionsDisplay = new google.maps.DirectionsRenderer();
        var chicago = new google.maps.LatLng(41.850033, -87.6500523);
        var mapOptions = {
          zoom:7,
          mapTypeId: google.maps.MapTypeId.ROADMAP,
          center: chicago
        }
        map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);
        directionsDisplay.setMap(map);
        calcRoute();
        checkVia();
      }

      function calcRoute() {
        checkVia();
        var start = document.getElementById('start').value.split(',');
            start =new google.maps.LatLng(parseInt(start[0],10),parseInt(start[1],10));
        var end = document.getElementById('end').value.split(',');
            end =new...