Question

I am working on a simple web app using jquery mobile. I am attempting to show a google map which shows the visitors gps location on a map. The code below is what i’m currently using, however it shows specific co-ordinates instead.

Can anyone help me change this so that it shows the visitors location? I have tried several solutions but have had no luck. Thank you!

<script>
$('#map_result').live('pageshow',function(event){
loadMap(48.870181,2.779852);
});
function loadMap(Lat, Long){
 var myLatlng = new google.maps.LatLng(Lat, Long);
 var myOptions = {
zoom: 13,
center: myLatlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
 }
 map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
}
</script>

Answer 1

Try this:

$('#map_result').live('pageshow', function (event) {
    navigator.geolocation.getCurrentPosition(function (location) {
        loadMap(location.coords.latitude, location.coords.longitude);
    });

});

function loadMap(Lat, Long) {
    var myLatlng = new google.maps.LatLng(Lat, Long);
    var myOptions = {
        zoom: 13,
        center: myLatlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
}