2012-04-26 21 views
1

ここで少し助けが必要だと思うね。しかし、私は地図を除去するのに必要な、http://leongaban.com/_stack/googlemaps/firstmap.html ポインタがその場で示され|:Googleマップ:オーバーレイポイントが表示されない

まず私はここで働いてマップを作成しましたサテライト|地形ボタン。

少し深く掘り下げてみると、私はここに例を見つけましたdisablingDefaults。しかし、私はgoogle.map.jsファイルと私のAPIキーを使ってマップを動かすことができませんでした。だから私はちょうどGoogle's example pageからスクリプトを使用しました。

は今私の第二マップは私が削除さマップビューのオプションを持っていますが、:( http://leongaban.com/_stack/googlemaps/

を表示するオーバーレイを取得することはできません

目標助けてください!

  • GoogleマップAPIキーを使用
  • マップビューのオプションボタンを削除します
  • 場所にオーバーレイポインタを置きます。私のGoogleのAPIと私の最初のマップの

コード2キー:

<head> 
    <title>Test Google Maps</title> 

    <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=AIzaSyAXsNu2EwRNqKJn9OmC19WPkEJFM0r6ALk&sensor=true" 
     type="text/javascript"></script> 

    <script type="text/javascript"> 

     function initialize() { 

      // var myOptions = { 
      //  zoom: 16, 
      //  center: new google.maps.LatLng(40.750159, -73.976473), 
      //  disableDefaultUI: true, 
      //  mapTypeId: google.maps.MapTypeId.ROADMAP 
      // } 

      // var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 

      // var point = new GLatLng(40.750159, -73.976473); 
      // map.addOverlay(new GMarker(point)); 

      var map = new GMap2(document.getElementById("map_canvas")); 
      map.setCenter(new GLatLng(40.750159, -73.976473), 13); 
      map.setUIToDefault(); 

      var myGeographicCoordinates = new GLatLng(40.750159, -73.976473) 
      map.addOverlay(new GMarker(myGeographicCoordinates)); 

      // map.addOverlay(new GMarker(40.750159, -73.976473)); 


     } 

    </script> 

</head> 

<body onload="initialize()" onunload="GUnload()"> 
    <div id="map_canvas" style="width: 450px; height: 370px"></div> 
</body> 


WORKING CODEを更新しました!スタッカーに感謝!

<head> 
    <title>Test Google Maps</title> 

    <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false"></script> 

    <script type="text/javascript"> 

     function initialize() { 

      var myOptions = { 
       zoom: 16, 
       center: new google.maps.LatLng(40.750159, -73.976473), 
       disableDefaultUI: true, 
       mapTypeId: google.maps.MapTypeId.ROADMAP 
       } 

      var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 

      var myGeographicCoordinates = new google.maps.LatLng(40.750159, -73.976473); 

      var marker = new google.maps.Marker({ 
       map:  map, 
       position: myGeographicCoordinates, 
       title:  "My First Test Marker", 
       visible: true 
      }); 
      } 

    </script> 

</head> 

<body onload="initialize()" onunload="GUnload()"> 
    <div id="map_canvas" style="width: 450px; height: 370px"></div> 
</body> 

答えて

1

latLngオブジェクトの定義方法に問題があります。

new GLatLng(40.750159, -73.976473); 

これはGoogle Maps API v2で使用されました。今、あなたは、最新のAPI(V3)を使用している、そして新しいAPIで、これはあなたがそれを行うべきかです:

new google.maps.LatLng(40.750159, -73.976473); 

EDIT:あなたの編集した後、私はマーカーでいくつかの問題がある参照してください。API v3ではでは、これはあなたが新しいマーカー作る方法です:マーカーを設定し、次のコード

var marker = new google.maps.Marker({ 
    map:  map, 
    position: latLng 
}); 

は、マップを設定するデフォルトのUIを無効にすると、地図上に置きます。

function initialize() { 
var myOptions = { 
    zoom: 16, 
    center: new google.maps.LatLng(40.750159, -73.976473), 
    disableDefaultUI: true, 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
} 

var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 
var myGeographicCoordinates = new GLatLng(40.750159, -73.976473); 
var marker = new google.maps.Marker({ 
    map:  map, 
    position: myGeographicCoordinates 
}); 
} 
+0

ここでコードを更新しました:http://leongaban.com/_stack/googlemaps/でもオーバーレイが表示されません:( –

+0

オーバーレイでは、ピンクのバルーンですか? – keune

+0

はいマップ上のどこに実際に表示されているか、上下逆さまの涙のように見えます。 –

1

今、あなたはv3のAPIに移動してきた、あなたからあなたのマーカーの作成コードを変更したいこと:に

map.addOverlay(new GMarker(myGeographicCoordinates)); 

var marker = new google.maps.Marker({ 
    map:  map, 
    position: myGeographicCoordinates, 
    title:  "My First Test Marker", 
    visible: true 
}); 

必要であれば、あなたもかもしれませんMarkerOptionのカスタムマーカーiconをマーカーコンストラクタ関数に渡して定義し、値を画像ファイルのパスと名前と同じに設定します。

var marker = new google.maps.Marker({ 
    map:  map, 
    icon:  "images/my-nice-marker.png", 
    position: myGeographicCoordinates, 
    title:  "My First Test Marker", 
    visible: true 
}); 
+0

上記のコードを実行している場合、古いv2クラスを使用しています: 'var myGeographicCoordinates = new GLatLng(40.750159 、-73.976473); '。その行を次のように変更します: 'var myGeographicCoordinates = new google.maps.LatLng(40.750159、-73.976473); –

+0

ああ、私はAPIについて間違っていた、私は正しいリンクを持っていた。助けてくれてありがとう! –

関連する問題