救援的地面覆盖

您可以使用地面叠加层在地图中叠加图像。地面叠加层是与纬度/经度坐标相关联的对象，因此在拖动或缩放地图时它们会移动。

有关地面叠加层的更多信息，请查看以下文档：

https://developers.google.com/maps/documentation/javascript/groundoverlays

代码

我还有一个文档中的代码示例，您可以在地图上覆盖jpeg图像：

<!DOCTYPE html>
<html>

<head>
  <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
  <meta charset="utf-8">
  <title>Ground Overlays</title>
  <style>
    html,
    body {
      height: 100%;
      margin: 0;
      padding: 0;
    }
    #map {
      height: 100%;
    }
  </style>
</head>

<body>
  <div id="map"></div>
  <script>
    // This example uses a GroundOverlay to place an image on the map
     // showing an antique map of Newark, NJ.

    var historicalOverlay;

    function initMap() {
      var map = new google.maps.Map(document.getElementById('map'), {
        zoom: 13,
        center: {
          lat: 40.740,
          lng: -74.18
        }
      });

      var imageBounds = {
        north: 40.773941,
        south: 40.712216,
        east: -74.12544,
        west: -74.22655
      };

      historicalOverlay = new google.maps.GroundOverlay(
        'https://www.lib.utexas.edu/maps/historical/newark_nj_1922.jpg',
        imageBounds);
      historicalOverlay.setMap(map);
    }
  </script>
  <script async defer src="https://maps.googleapis.com/maps/api/js?callback=initMap">
  </script>
</body>

</html>

注意：在示例中，我没有使用密钥，因此它适用于StackOverflow。但作为用户，您应始终使用API密钥，否则您的网站可能会被Google阻止。只需更换

https://maps.googleapis.com/maps/api/js?callback=initMap

通过

https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap

tiff怎么样？

目前我还不完全确定我们支持tiff格式。 GroundOverlay上的文档仅提到您需要添加URL，但它没有指定任何有关图像类型的内容。在这种情况下，你将不得不尝试，但我的教育猜测是它应该工作。

如果不支持`tiff`怎么办？

如果不支持tiff格式，您始终可以将该格式的图片转换为png或jpeg。以下两个链接将为您添加：

但是那里还有很多很多。

我希望这个答案可以帮到你。如果由于某种原因tiff不受支持，请告诉我，以便我可以提出功能请求！

在谷歌地图中显示tiff图像

1 个答案:

救援的地面覆盖

代码

tiff怎么样？

如果不支持`tiff`怎么办？

在谷歌地图中显示tiff图像

1 个答案:

救援的地面覆盖

代码

tiff怎么样？

如果不支持tiff怎么办？

如果不支持`tiff`怎么办？