0

我花了两天时间对此感到困惑并且失败了。任何帮助将不胜感激。

我需要在 1500px x 900px 的画布上以 -18.975750、32.669184 为中心的地图。然后我需要使用设置的代码透明度覆盖覆盖率 PNG（从 www.heywhatsthat.com 获得）。

我最终到达了以下代码，但它失败了。我想添加多个受其 co-ords 约束的 PNG，但连一个都无法使用。

 <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

You have a lot of issues with your code. It looks like you're trying to migrate from V2 to V3, and you still have V2 methods and objects in your code. You're also not loading the JS APi correctly when you call in the of your HTML.

Here is functional code that displays the overlay using the V3 API, but it looks like the original center coordinates that you used do not place the map at the center of the overlay (you'll need to figure that out yourself). I've added comments where relevant so that you can see where you went astray. Note the call to the API library in the first script tag.

<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 回答