Calling this from inside of navigator.geolocation.getCurrentPosition

The easiest way to show you what I am trying to do with the working version at: http://jsfiddle.net/t8Brm/11/ Required modern browers with GEO Location support.

In the JS code I have commented out the code that is causing the problem so that you can see it working first.

The question is: how can I uncomment the code below that uses the geo location to add marker and center the map without getting the Error: position.coords is undefined

$(this).trigger("gMap.addMarker", {
     latitude: latitude,
     longitude: longitude,
     content: "You Are Here"
});
$(this).trigger("gMap.centerAt", {
     latitude: latitude,
     longitude: longitude
});

This is the original plugin: http://github.com/marioestrada/jQuery-gMap I have added the extra functionality for the GEO Location. Shown below:

function generateDirections(from, to, directionHtml){
            var directionsDisplay;
            var directionsService = new google.maps.DirectionsService();

            $('#'+directionHtml).html('');

            var request = {
                origin: from,
                destination: to,
                travelMode: google.maps.DirectionsTravelMode.DRIVING
            };

            directionsDisplay = new google.maps.DirectionsRenderer();
            directionsDisplay.setMap($gm开发者_高级运维ap);
            directionsDisplay.setPanel(document.getElementById(directionHtml));
            directionsService.route(request, function(response, status){
                if(status == google.maps.DirectionsStatus.OK){
                    directionsDisplay.setDirections(response);
                    if($("#gmaps_from").val().length === 0)
                        $("#gmaps_from").val(response.routes[0].legs[0].start_address);
                }
            });

            setTimeout(function(){
                $("#"+directionHtml).slideDown("slow");
            },1000);
        }

        //make this available to the click element
        $.data($('#gmaps_getdirections')[0], 'inst', this);

        $('#gmaps_getdirections').click(function(e) {
            e.preventDefault();

            var from = $('#gmaps_from').val();
            if(opts.address){
                var to = opts.address;
            } else {
                var to = parseFloat(opts.latitude) + ", " + parseFloat(opts.longitude);
            }

            generateDirections(from, to, "gmaps_directions");

            //open the google window
            //window.open("http://maps.google.com/maps?saddr=" + from + "&daddr=" + to, "GoogleWin", "menubar=1,resizable=1,scrollbars=1,width=750,height=500,left=10,top=10");
        });

        if(opts.geolocation && navigator.geolocation) {
            navigator.geolocation.getCurrentPosition(function(position){
                var latitude = position.coords.latitude;
                var longitude = position.coords.longitude;

                var from = parseFloat(latitude) + ", " + parseFloat(longitude);

                if(opts.address){
                    var to = opts.address;
                } else {
                    var to = parseFloat(opts.latitude) + ", " + parseFloat(opts.longitude);
                }

                /*$(this).trigger("gMap.addMarker", {
                    latitude: latitude,
                    longitude: longitude,
                    content: "You Are Here"
                });
                $(this).trigger("gMap.centerAt", {
                    latitude: latitude,
                    longitude: longitude
                });*/

                generateDirections(from, to, "gmaps_directions");                    
            });
        }

You could execute the equivalent JavaScript API v3 code like so:

new google.maps.Marker({position:new google.maps.LatLng(latitude,longitude),
    map:$gmap,
    title:"You Are Here"});
$gmap.setCenter(new google.maps.LatLng(latitude,longitude));

Replacing your commented-out code with this in the jsFiddle places the marker on the map and momentarily centers the map on your location.

It appears that the centering of the other location is fired after that at some point. (I assume you can take care of turning that off but if not, just say so in the comments and I or someone else will no doubt look some more.)

Ok - in testing in FF - here's what a I found - $(this).trigger("gMap.addMarker", {... causes your function to be evaluated again. The first time it does find the lat/long, but after the trigger call, the same function is called again with position pointing to the function again.

I'm not familiar with the plugin but I tried to trigger it on the element (#google_maps): http://jsfiddle.net/t8Brm/18.

This fixes the recursive call problem but throws another exception An invalid or illegal string was specified.

Hope this points you in the right direction.