HTML5ジオロケーションを使用してジオロケーション（現在のユーザーの位置）を使用してGoogle Maps APIを初期化する方法javascript

showPostion functionから返される値をinitializeに渡す方法このスクリプトの目的は、GoogleMapにユーザーの現在の位置を表示することです。HTML5ジオロケーションを使用してジオロケーション（現在のユーザーの位置）を使用してGoogle Maps APIを初期化する方法javascript

してください、以下のスクリプト内のコメントを参照してください。

<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"/>

出典

2013-10-18 Anonymous

解決策は、google.maps.LatLng classを使用し、このオブジェクトの10及びlng()方法を次のよう

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());

出典

2013-10-21 19:28:53

私は最善の方法を知られていないが、あなたが得るためにあなたの位置を分割したよりあなたは2位

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

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

を解析でき経度と緯度

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

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

出典

2013-10-18 14:57:27 seb

HTML5ジオロケーションを使用してジオロケーション（現在のユーザーの位置）を使用してGoogle Maps APIを初期化する方法javascript

答えて

関連する問題