如何将USGS地形图层添加到Google Maps Javascript API

时间:2018-05-18 05:14:10

标签: javascript google-maps google-maps-api-3

我找到了一些资源,但所有链接都已死或信息已过时。我真的只想在我的谷歌地图窗口中有一个显示USGS地形图图层的附加图层。

1 个答案:

答案 0 :(得分:0)

您可以使用google.maps.ImageMapType添加自定义图层,如下所示:

google.maps.event.addDomListener(window, "load", function () {
	// Create map
  var map = new google.maps.Map(document.getElementById("map"), {
    zoom: 11,
    center: {lat: 62.323907, lng: -150.109291},
    mapTypeId: 'satellite'
  });
 
	// Replace this url with any url you want
  // It's actually a url template
	var tileUrl = "http://b.tile.stamen.com/terrain/{z}/{x}/{y}.png";

  // Create a new ImageMapType layer.
  var layer = new google.maps.ImageMapType({
    name: "stamen_terrain",
    getTileUrl: function(coord, zoom) {
      return tileUrl.replace("{x}", coord.x).replace("{y}", coord.y).replace("{z}", zoom);
    },
    tileSize: new google.maps.Size(256, 256),
    minZoom: 1,
    maxZoom: 20
  });

  // Register the new layer, then activate it.
  map.mapTypes.set("stamen_terrain", layer);
  map.setMapTypeId("stamen_terrain");
});
body {
  margin: 0;
  padding: 0;
}

#map {
  height: 400px;
  width: 400px;
}
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?v=3&amp;sensor=false"></script>
<div id="map"></div>