2

i'm trying to write a script that will get a user's geolocation - if they have it enabled, and plot a route to a predefined destination. if they don't have geolocation enabled, it should just plot the predefined location. the script isn't working, but you should be able to get a good idea of what i'm trying do do by looking through the code. am i on the right track? can anyone spot why it isn't working?

<script type="text/javascript">
       $(function (){

        var dest = "Unit 20, Tallaght Business Centre, Whitestown Road, Tallaght Business Park, Ireland";

        if(geolocEnabled()){
            getLocation();
        }else{
            plotMarker(dest);
        }

        //check if geolocation enabled
        function geolocEnabled(){
            return navigator.geolocation;
        }

        //plot marker for VRF office
        function plotMarker(dest){
            $('#map').gmap3(
              { action: 'addMarker',
                address: dest,
                map:{
                  center: true,
                  zoom: 14
                },
                marker:{
                  options:{
                    draggable: false
                  }
                }
              }
            );
        }

        //get user's location
        function getLocation(){
            $('#map').gmap3(
            { action : 'geoLatLng',
              callback : function(latLng){
                if (latLng){
                  plotRoute(latLng, dest);  
                  return;
                } else {
                  alert("Unable to determine your location. Enable geolocation services and try again, or consult the map for our location.");
                  plotMarker(dest);
                }
              }
            });
          }

        //plot route
        function plotRoute(latLng, dest){
        $('#map').gmap3(
          { action:'getRoute',
            options:{
              origin: latLng,
              destination: dest,
              travelMode: google.maps.DirectionsTravelMode.DRIVING
            },
            callback: function(results){
              if (!results) return;
              $(this).gmap3(
                { action:'init', 
                  zoom: 7, 
                  mapTypeId: google.maps.MapTypeId.ROADMAP, 
                  streetViewControl: true,
                  center: [53.337433,-6.2661]
                },
                { action:'addDirectionsRenderer',
                  panelID: 'directions-panel',
                  options:{
                    preserveViewport: true,
                    draggable: false,
                    directions:results
                  }
                }
              );
            }
          }
        );
      }

    });
    </script>

all help much appreciated.

EDIT: i'm not even getting a geolocation warning in-browser when i run the script.

EDIT: i removed the {timeout: 10000} from getLocation, it's now getting to the alert. script updated.

MattSull
  • 5,514
  • 5
  • 46
  • 68

1 Answers1

3

geolocating is an asynchronous process, the result will not be available yet when getLocation() is finished.

Call plotRoute() inside the callback of $.gmap3.geoLatLng and provide the expected arguments(latLng, dest)

Dr.Molle
  • 116,463
  • 16
  • 195
  • 201
  • Thanks, that's pretty much working now. I've edited the question and put in the working version. One thing, getLocation() seems to default to the centre of Dublin, rather than the place I'm working, which is the same as 'dest'. Would you have any idea why this is happening? – MattSull Aug 20 '12 at 13:43
  • that should have read the place I'm working on the code, which is the same as 'dest'. – MattSull Aug 20 '12 at 13:50