Wie Google Maps API mit Geolocation (aktuelle Position des Benutzers) mit HTML5 Geolocation Javascript

initialisieren So übergeben Sie Rückgabewerte von showPostion function in initialize. Das Ziel dieses Skripts ist es, GoogleMap mit der aktuellen Position des Benutzers anzuzeigen.Wie Google Maps API mit Geolocation (aktuelle Position des Benutzers) mit HTML5 Geolocation Javascript

Bitte, die Kommentare im folgenden Skript sehen:

<head> 
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 
    <style type="text/css"> 
     html { height: 100% } 
     body { height: 100%; margin: 0; padding: 0 } 
     #map-canvas { height: 100% } 
    </style> 
    <script type="text/javascript" 
      src="https://maps.googleapis.com/maps/api/js?<%= API_KEYS['google']['api_key'] %>&sensor=true"> 
    </script> 

    <script type="text/javascript"> 

     function getLocation(){ 
      { 
       if (navigator.geolocation) 
       { 
        navigator.geolocation.getCurrentPosition(showPosition); 
       } 
       else{x.innerHTML="Geolocation is not supported by this browser.";} 
      } 

     } 

     function showPosition(position) { 
      var latitude = position.coords.latitude; 
      var longitude = position.coords.longitude; 
      alert('latitude:' + latitude + 'longitude:' + longitude) 

     // This function is supposed to return the current latitude and longitude of user 
     // example: 48.1673341, 17.0830998 
     } 


     function initialize() { 

      var mapOptions = { 


     // How to pass the result from function showPosition to LatLng ? 
     // see the line below:     
     center: new google.maps.LatLng(48.1673341,17.0830998), 
       zoom: 13, 
       mapTypeId: google.maps.MapTypeId.ROADMAP 
      }; 
      var map = new google.maps.Map(document.getElementById("map-canvas"), 
        mapOptions); 

     } 

     google.maps.event.addDomListener(window, 'load', initialize); 

    $(document).ready(function(){  // events before the windows loads 
    getLocation(); 
    }); 


    </script> 
</head> 


<h3>Hello from Google maps </h3> 


<div id="map-canvas"/>

Quelle

2013-10-18 Anonymous

Lösung ist google.maps.LatLng class zu verwenden undnennen als 10 und lng() Methoden auf diesem Objekt folgt:

lat() number Returns the latitude in degrees. 
lng() number Returns the longitude in degrees.

function getLocation(){ 

     { 
      if (navigator.geolocation) 

      { 

       var options = { 
        enableHighAccuracy: true, 
        timeout: 5000, 
        maximumAge: 0 
       }; 

       navigator.geolocation.getCurrentPosition(success, error,options); 
      } 

      else 

      { x.innerHTML= "Geolocation is not supported by this browser."; } 
     } 

    } 

    function error(e) { 

    console.log("error code:" + e.code + 'message: ' + e.message); 

    } 

    function success(position) { 
    var lat = position.coords.latitude; 
    var lng = position.coords.longitude; 

    var myLocation = new google.maps.LatLng(lat, lng); 


    var mapOptions = { 
      center: new google.maps.LatLng(myLocation.lat(),myLocation.lng()), 
      zoom: 13, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     }; 

     var map = new google.maps.Map(document.getElementById("map-canvas"), 
       mapOptions); 


     var marker = new google.maps.Marker({ 
      position: myLocation, 
      map: map, 
      title:"you are here" 
     }); 

    } 
    google.maps.event.addDomListener(window, 'load', getLocation());

Quelle

2013-10-21 19:28:53

ich die beste Art und Weise nicht bekannt machen, aber man konnte die zwei Positionen

function showPosition(position) { 
      var latitude = position.coords.latitude; 
      var longitude = position.coords.longitude; 

      return latitude.concat(';',longitude); 
     }

als Sie die teilen Sie Ihre Position analysieren zu bekommen Längen- und Breitengrad

var position = showPosition(position); 
position = position.split(';'); 

// position[0] -> latitude 
// position[1] -> longitude

Quelle

2013-10-18 14:57:27 seb

Wie Google Maps API mit Geolocation (aktuelle Position des Benutzers) mit HTML5 Geolocation Javascript

Antwort

Verwandte Themen