2016-04-06 3 views
-1

GoogleマップをJavaScriptでGoogleマップAPIを使用して現在の場所に読み込もうとしました。 JavaScriptを使ってこのコードを試しましたが、うまくいきません。 私は多くの方法を試した後、私はこのコードに来て、それは完璧に動作します。 は私のGoogleマップアプリケーションはGoogleマップapiを使用して現在の住所で地図を読み込む方法

<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=true&libraries=places&key=YOUR_API"> 
    </script> 

    <script> 
     var x = document.getElementById("map"); 
     var map; 
     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; 
      var center = new google.maps.LatLng(latitude,longitude); 
      var myOptions = { 
       center: center, 
       zoom: 13, 
       mapTypeId: google.maps.MapTypeId.ROADMAP 
      }; 
      map = new google.maps.Map(document.getElementById('map'), myOptions); 

      // Create a marker and set its position. 
      var marker = new google.maps.Marker({ 
       map: map, 
       position: center, 
       title: 'You are here' 
      }); 
     } 

     google.maps.event.addDomListener(window, 'load', initialize); 
    </script> 

    <script type="text/javascript"> 
     function comple() 
     { 
       var org = document.getElementById('org'); 
       var des = document.getElementById('des'); 
       var autocomplete = new google.maps.places.Autocomplete(org); 
       var autocomplete2 = new google.maps.places.Autocomplete(des); 
     } 
     google.maps.event.addDomListener(window, 'load', comple); 
    </script> 

</head> 
<body onload="getLocation()"> 
<p><h1>Car Direction Finder</h1></p> 
<br> 
<form name="form1" id="form1" action="Direction.php" method="post"> 
<p> 
Source: 
<input type="text" name="org" id="org" placeholder="Enter Original Source" size="50" autocomplete="on"> 
Destination: 
<input type="text" name="des" id="des" placeholder="Enter Destination Source" size="50" autocomplete="on"> 
<label for="des"></label> 
<input type="submit" value="GO"/> 
<br> 
</form> 
<div align="center"> 
<table border="2" width="750" height="550" align="center"> 
    <tr> 
     <td id="map"></td> 
    </tr> 
</table> 
</div> 
</body> 
</html> 

私の現在の場所としてこのコードは、私の現在の場所としてフィラデルフィアを返しますが、私はそれは私のホームアドレスを返すようにしたい誰かがそれで私を助けることはできますか?あなたはAPIキーを持っていない場合
https://developers.google.com/maps/documentation/javascript/examples/places-autocomplete-directions?hl=fr

は&キー= IPutMyKeyHereを入れないでください:

答えて

0

が、これはあなたを助けることができます試してみてください。

+0

場所を自動補完したいが、地図がロードされているときに現在地を取得したい場合は – Tiger07

+0

と[https://developers.google.com/maps/documentation/javascript/examples/map-geolocation? hl = fr](https://developers.google.com/maps/documentation/javascript/examples/map-geolocation?hl=fr) –

関連する問題