0

私はこれを困惑させるために2日間を費やし、失敗しました。どんな援助も大歓迎です。

1500px x 900pxのキャンバスに、-18.975750、32.669184を中心とするマップが必要です。次に、カバレッジPNG(www.heywhatsthat.comから取得)を設定されたコード透過性でオーバーレイする必要があります。

最終的に次のコードに到達しましたが、失敗します。その座標によってバインドされた複数のPNGを追加したいのですが、1つを機能させることさえできません。

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

function initialize() {
  if (GBrowserIsCompatible()) {
    var map = new google.maps.MAP(document.getElementById("map_canvas"));
    map.setCenter(new GLatLng(-18.975750, 32.669184), 13);
    map.setUIToDefault();

  var imageBounds = new google.maps.LatLngBounds(
  new google.maps.LatLng(-19.000417,30.999583),
  new google.maps.LatLng(-17.999583,32.000417));

   var oldmap = new google.maps.GroundOverlay(
  "http://www.earthstation.mobi/cloakpS19E031.png",imageBounds);
   oldmap.setMap(map);
}

</script>
</head>
 <body onload="initialize()" onunload="GUnload()">
<div id="map_canvas" style="width: 1500px; height: 900px"></div>
 </body>
 </html>

私が何をしているのか、正しい方向に向けてください。オプションに透明度のある複数のpngオーバーレイを追加してください。

ありがとうブライアンジンバブエ

4

1 に答える 1

1

コードに多くの問題があります。V2からV3に移行しようとしているようですが、コードにはまだV2メソッドとオブジェクトが含まれています。また、HTMLを呼び出すときに、JSAPiが正しくロードされていません。

これは、V3 APIを使用してオーバーレイを表示する関数型コードですが、使用した元の中心座標は、マップをオーバーレイの中心に配置していないようです(自分で把握する必要があります)。どこに迷ったかがわかるように、必要に応じてコメントを追加しました。最初のスクリプトタグでのAPIライブラリの呼び出しに注意してください。

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

  function initialize() {
    //You don't need to use GBrowserIsCompatible, it's only for V2 of the API
    //if (GBrowserIsCompatible()) {
      //You need to set up options for the map that you reference when you
      //instantiate the map object
      var myOptions = {
                center: new google.maps.LatLng(-18.975750, 32.669184),
                zoom: 13,
                mapTypeId: google.maps.MapTypeId.ROADMAP
              };
      //Your code references google.maps.MAP; it's google.maps.Map
      var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

      var imageBounds = new google.maps.LatLngBounds(
        new google.maps.LatLng(-19.000417,30.999583),
        new google.maps.LatLng(-17.999583,32.000417));

      var oldmap = new google.maps.GroundOverlay(
        "http://www.earthstation.mobi/cloakpS19E031.png",imageBounds);
        oldmap.setMap(map);
   //} <--Your code was missing this closing bracket for the conditional
       //But the conditional is not even needed, since GBrowserCompatible is a V2 thing
  }

  </script>
  </head>
   <body onload="initialize()">
  <div id="map_canvas" style="width: 1500px; height: 900px"></div>
   </body>
   </html>
于 2012-06-20T16:44:08.743 に答える