0

私は自分のウェブサイトでGoogleマップを使用するという概念にかなり慣れていません。このスクリプトを使用して、自分のウェブページのdiv内の特定の場所を読み込みます。ただし、目的の場所がページに読み込まれません。

BIT Main Bldg Patna, Bihar, India 12 m Eたとえば、ページを開くたびにdiv内の場所をロードしたいとします。ただし、結果は正確ではないため、さらにいくつかのレイヤーを拡大する必要があります。

<!DOCTYPE html>
<html> 
<head> 
   <meta http-equiv="content-type" content="text/html; charset=UTF-8"/> 
   <title>Google Maps Geocoding Demo</title> 
   <script src="http://maps.google.com/maps/api/js?sensor=false" 
           type="text/javascript"></script> 
</head> 
<body> 
   <div id="map" style="width: 400px; height: 300px;"></div> 

   <script type="text/javascript"> 

   var address = 'BIT Main Bldg Patna, Bihar, India 12 m E';

   var map = new google.maps.Map(document.getElementById('map'), { 
       mapTypeId: google.maps.MapTypeId.TERRAIN,
       zoom: 8
   });

   var geocoder = new google.maps.Geocoder();

   geocoder.geocode({
      'address': address
   }, 
   function(results, status) {
      if(status == google.maps.GeocoderStatus.OK) {
         new google.maps.Marker({
            position: results[0].geometry.location,
            map: map
         });
         map.setCenter(results[0].geometry.location);
      }
      else {
         // Google couldn't geocode this request. Handle appropriately.
      }
   });

   </script> 
</body> 
</html>

このページBIT Main Bldg Patna, Bihar, India 12 m Eの出力テキストボックスに入力すると、正確に希望する結果が表示される場合があります。ここの間違いは何ですか？

4

3 に答える 3

3

リンク先のページと同じような地図をページに表示するには、地図コンストラクタで提供するオプションを変更する必要があります。zoom属性を 15 または 16 およびmapTypeIdに変更するgoogle.maps.MapTypeId.ROADMAPと、マップが思い描いたものに近くなります。

于 2012-11-25T09:55:41.883 に答える
1

次のことを試してください：

 var map = new google.maps.Map(document.getElementById('map'), { 
       mapTypeId: google.maps.MapTypeId.ROADMAP,
       zoom: 15
   });
于 2012-11-25T10:01:36.033 に答える
1

マークアップを再編成します。</body>すべての要素がブラウザーのDOMに適切にロードされた後に関数が実行されるように、スクリプトはヘッドセクションまたはタグの後に配置する必要があります。

次のような関数を作成します

<script type="text/javascript"> 

function initialise()
{
   var address = 'BIT Main Bldg Patna, Bihar, India 12 m E';

   var map = new google.maps.Map(document.getElementById('map'), { 
       mapTypeId: google.maps.MapTypeId.TERRAIN,
       zoom: 10 //to get to a desirable zoom level change this value
   });

   var geocoder = new google.maps.Geocoder();

   geocoder.geocode({
      'address': address
   }, 
   function(results, status) {
      if(status == google.maps.GeocoderStatus.OK) {
         new google.maps.Marker({
            position: results[0].geometry.location,
            map: map
         });
         map.setCenter(results[0].geometry.location);
      }
      else {
         // Google couldn't geocode this request. Handle appropriately.
      }
   });
}
   </script>

次に、<body>タグでonloadイベントを使用してスクリプトを実行する必要があります。

<body onload="initialise()">
于 2012-11-25T10:05:54.943 に答える