Q:

Google maps giving directions to the wrong place

I maintain the website for a local trail association, and include an annotated Google map of the trail and amenities.  I've added markers to show the trailheads, and a call to Google's directions.  The problem is that Google decides to send people to someplace other than the location I've specified.  My example shows two trailheads (the little green icons).  If you click on either, and request directions, the directions result takes you to a point about 1/3 mile from the specified location. 
I think this problem is limited to locations that are right along the trail, as I've been able to fix the problem to some extent by making the input locations a little less accurate.  But this doesn't always work.
Any ideas?  I thought I might be missing an attribute somewhere, but I can't find anything.
     
    
        
            #map_canvas {width:900px; height:80%; float:left}
        
    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
    <script type="text/javascript" src="http://www.montourtrail.org/utilities/infobox_packed.js"></script>
    <script type="text/javascript" src="http://www.montourtrail.org/utilities/keydragzoom_packed.js"></script>

    <script type="text/javascript">
    //define trailheads
    var accesses = new Array(40.2823, -79.986433, 40.28177, -79.98584)

    //text for building directions box
    dirStr = '<br />Directions from:<br /><input type="text" id="start" size="25" />'
        + 'by <select id="mode"><option value="DRIVING" selected>car</option><option value="BICYCLING">bicycle</option>'
        + '<option value="WALKING">foot</option></select>'
        + '<input type="button" value="Go" onclick="calcRoute(\''

    //for displaying directions
    var directionsService = new google.maps.DirectionsService();

   function initialize() {
        //position the directions box so it will print properly
        var w = 900
        directionsDisplay = new google.maps.DirectionsRenderer();
        //create base map
        var latlng = new google.maps.LatLng(40.28217, -79.9864);
        var myOptions = {
        zoom: 18,
        center: latlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        scaleControl: true,
        mapTypeControl: true,
          mapTypeControlOptions: {
            style: google.maps.MapTypeControlStyle.DROPDOWN_MENU
          }
        };
        var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
        map.enableKeyDragZoom({key: 'ctrl'});

        //create infowindow to hold content
        var infowindow = new google.maps.InfoWindow({
            content: "holding..."
        });

        var markers = []
        //show trailheads markers
        for (i = 0; i<accesses.length; i=i+2) {
            //locations that have ammenities but no access have names starting with ' '.
            //display only areas that don't start with ' '.
                var myLatlng = new google.maps.LatLng(accesses[i],accesses[i+1]);
                var marker = new google.maps.Marker({
                    position: myLatlng,
                    map: map,
                    icon: "../images/trailsign.gif",
                    animation: google.maps.Animation.DROP,
                    zIndex:15,
                    html: ''
                });
                markers.push(marker)
        }

        //now add the popup content
        for (i = 0; i < markers.length; i++) {
            var thismarker = markers[i];
            google.maps.event.addListener(thismarker, 'click', function () {
            infowindow.setContent(this.html + dirStr +  this.position + '\')" \>');
            infowindow.open(map, this);
            });
        }

        directionsDisplay.setMap(map);
        directionsDisplay.setPanel(document.getElementById("directions"));
    }

    function calcRoute(end) {
        var output = document.getElementById("directions")
        var start = document.getElementById("start").value
        var mode = document.getElementById('mode')
        var modeval = mode.options[mode.selectedIndex].value
        var request = {
            origin:start,
            destination:end,
            travelMode: google.maps.TravelMode[modeval]
        };
        directionsService.route(request, function(response, status) {
        if (status == google.maps.DirectionsStatus.OK) {
        directionsDisplay.setDirections(response);
        }
    });
  }
    </script>
</head>

<body onload="initialize()">
<div id="map_canvas"></div>
<div id="directions"></div>
</body>
</html>

A:

Instead of passing a comma separated string containing coordinates, use a google.maps.LatLng.  If you pass the comma separated string containing coordinates, the API reverse geocodes them, finds the nearest place it knows about and routes you there.  If you use a google.maps.LatLng, it gets as close as it can on a road (at least for driving directions).
One option is to change:
//text for building directions box
dirStr = '<br />Directions from:<br /><input type="text" id="start" size="25" />'
    + 'by <select id="mode"><option value="DRIVING" selected>car</option><option value="BICYCLING">bicycle</option>'
    + '<option value="WALKING">foot</option></select>'
    + '<input type="button" value="Go" onclick="calcRoute(\''

and 
infowindow.setContent(this.html + dirStr +  this.position + '\')" \>');

to:
dirStr = '<br />Directions from:<br /><input type="text" id="start" size="25" />'
    + 'by <select id="mode"><option value="DRIVING" selected>car</option><option value="BICYCLING">bicycle</option>'
    + '<option value="WALKING">foot</option></select>'
    + '<input type="button" value="Go" onclick="calcRoute(new google.maps.LatLng(';

and 
infowindow.setContent(this.html + dirStr + this.getPosition().toUrlValue(6) + '))" \>');

proof of concept fiddle
code snippet:

//define trailheads
     var accesses = new Array(40.2823, -79.986433, 40.28177, -79.98584)

      //text for building directions box
      dirStr = '<br />Directions from:<br /><input type="text" id="start" size="25" />' + 'by <select id="mode"><option value="DRIVING" selected>car</option><option value="BICYCLING">bicycle</option>' + '<option value="WALKING">foot</option></select>' + '<input type="button" value="Go" onclick="calcRoute(new google.maps.LatLng(';

      //for displaying directions
     var directionsService = new google.maps.DirectionsService();

     function initialize() {
       //position the directions box so it will print properly
       var w = 900
       directionsDisplay = new google.maps.DirectionsRenderer();
       //create base map
       var latlng = new google.maps.LatLng(40.28217, -79.9864);
       var myOptions = {
         zoom: 18,
         center: latlng,
         mapTypeId: google.maps.MapTypeId.ROADMAP,
         scaleControl: true,
         mapTypeControl: true,
         mapTypeControlOptions: {
           style: google.maps.MapTypeControlStyle.DROPDOWN_MENU
         }
       };
       var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
       map.enableKeyDragZoom({
         key: 'ctrl'
       });

       //create infowindow to hold content
       var infowindow = new google.maps.InfoWindow({
         content: "holding..."
       });

       var markers = []
         //show trailheads markers
       for (i = 0; i < accesses.length; i = i + 2) {
         //locations that have ammenities but no access have names starting with ' '.
         //display only areas that don't start with ' '.
         var myLatlng = new google.maps.LatLng(accesses[i], accesses[i + 1]);
         var marker = new google.maps.Marker({
           position: myLatlng,
           map: map,
           animation: google.maps.Animation.DROP,
           zIndex: 15,
           html: ''
         });
         markers.push(marker)
       }

       //now add the popup content
       for (i = 0; i < markers.length; i++) {
         var thismarker = markers[i];
         google.maps.event.addListener(thismarker, 'click', function() {
           infowindow.setContent(this.html + dirStr + this.getPosition().toUrlValue(6) + '))" \>');
           infowindow.open(map, this);
         });
       }

       directionsDisplay.setMap(map);
       directionsDisplay.setPanel(document.getElementById("directions"));
     }

     function calcRoute(end) {
       var output = document.getElementById("directions")
       var start = document.getElementById("start").value
       var mode = document.getElementById('mode')
       var modeval = mode.options[mode.selectedIndex].value
       var request = {
         origin: start,
         destination: end,
         travelMode: google.maps.TravelMode[modeval]
       };
       directionsService.route(request, function(response, status) {
         if (status == google.maps.DirectionsStatus.OK) {
           directionsDisplay.setDirections(response);
         }
       });
     }
     google.maps.event.addDomListener(window, "load", initialize);
html,
body,
#map_canvas {
  height: 100%;
  width: 100%;
  margin: 0px;
  padding: 0px
}
<script src="https://maps.googleapis.com/maps/api/js?libraries=geometry,places&ext=.js"></script>
<script src="https://cdn.rawgit.com/googlemaps/v3-utility-library/07f15d84/keydragzoom/src/keydragzoom_packed.js"></script>
<script src="https://cdn.rawgit.com/googlemaps/v3-utility-library/master/infobox/src/infobox_packed.js"></script>
<div id="map_canvas"></div>
<div id="directions"></div>

