Inserting varianble GPS coordinates in google maps

2018-06-16 17:14:28

I want my script to get the latitude and longittude coordinates from a GPS(mobile phone) and then insert them into a google map and display the location of the Mobile phone. Well , i am able to retrieve the Lat,Long coordinates from the GPS but it won't insert them as the çentre'of the map displayed. My code :

<script>
    $(document).ready(function(){
        navigator.geolocation.getCurrentPosition(useposition); 
    });
                function useposition(position){  
            lat = position.coords.latitude;
            lon = position.coords.longitude;   
            $("#location").html('Lat: ' + lat + '<br />Lon: ' + lon);

        }
</script><meta name="viewport" content="initial-scale=1.0, user-scalable=no"<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script><script type="text/javascript">
function initialize() {
    var latlng = new google.maps.LatLng(54,-1);
    var settings = {
        zoom: 15,
        center: latlng,
        mapTypeControl: true,
        mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU},
        navigationControl: true,
        navigationControlOptions: {style: google.maps.NavigationControlStyle.SMALL},
        mapTypeId: google.maps.MapTypeId.ROADMAP }; var map = new google.maps.Map(document.getElementById("map"), settings);
var marker = new google.maps.Marker({      position: latlng,      map: map,      title:"Yeah buddy!"  })};

                </script>

As You can see i Fetch the GPs coordinates and i want to insert them in my map which i load with : <body onload="initialize ()" > </body> I just do not know how to make a variable from lat,lon and how to insert it properly in gogle maps . Help me please.

I assume by 'insert coordinates into the map' you mean add a marker at that location?

The first problem you'll have is your map variable is a local variable to your initialize function. So you could make that a global variable. Then in your useposition function you can simply create a new marker.

<script>
    var map;

    $(document).ready(function(){
        navigator.geolocation.getCurrentPosition(useposition); 
    });

    function useposition(position){  
            lat = position.coords.latitude;
            lon = position.coords.longitude;   
            $("#location").html('Lat: ' + lat + '<br />Lon: ' + lon);
            var marker = new google.maps.Marker({      
                position: new google.maps.LatLng(lat,lon),      
                map: map,      
                title:"Your Mobile"  });
        }

function initialize() {
    var latlng = new google.maps.LatLng(54,-1);
    var settings = {
        zoom: 15,
        center: latlng,
        mapTypeControl: true,
        mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU},
        navigationControl: true,
        navigationControlOptions: {style: google.maps.NavigationControlStyle.SMALL},
        mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 

    map = new google.maps.Map(document.getElementById("map"), settings);
    var marker = new google.maps.Marker({      position: latlng,      map: map,      title:"Yeah buddy!"  })
};
</script>

链接地址: http://www.djcxy.com/p/47304.html

上一篇: 像素坐标到GPS坐标

下一篇: 在Google地图中插入可变GPS坐标