是否有可能隐藏(切换)主地图层，只显示地面覆盖图像本身?

Question

我有一个groundOverlay图像，我希望主地图可以打开/关闭，这样只有覆盖图像可以显示。这可能吗?

PS:我正在使用javascript api v3

Answer 1

你可以实现一个自定义的MapType(它不渲染tile)，然后你只需要在这个自定义的MapType和一个内置的MapType之间切换。路线图):

function initialize() {
  var goo = google.maps,
    map = new goo.Map(document.getElementById('map-canvas'), {
      zoom: 11,
      center: new goo.LatLng(40.740, -74.18),
      mapTypeControl: false
    }),
    mt = function() {
      this.getTile = function() {
        var n = document.createElement('div');
        n.style.cssText = 'background:#fff;width:256px;height:256px;';
        return n;
      };
      this.tileSize = new google.maps.Size(256, 256);
      this.maxZoom = 20;
    },
    //maptype-control
    mtc = document.createElement('div');
  mtc.id = 'mtc';
  map.controls[google.maps.ControlPosition.LEFT_BOTTOM].push(mtc);
  google.maps.event.addDomListener(mtc, 'click', function() {
    console.log(map.getMapTypeId())
    map.setMapTypeId((map.getMapTypeId() === 'hidden') ? google.maps.MapTypeId.ROADMAP : 'hidden');
  });
  google.maps.event.addListener(map, 'maptypeid_changed', function() {
    mtc.style.textDecoration = ((this.getMapTypeId() === 'hidden') ? 'none' : 'line-through');
  });
  map.mapTypes.set('hidden', new mt);
  map.setMapTypeId('hidden');
  new goo.GroundOverlay(
    'https://www.lib.utexas.edu/maps/historical/newark_nj_1922.jpg',
    new goo.LatLngBounds(
      new goo.LatLng(40.712216, -74.22655),
      new goo.LatLng(40.773941, -74.12544)
    ), {
      map: map
    }
  );
}
google.maps.event.addDomListener(window, 'load', initialize);

html,
body,
#map-canvas {
  height: 100%;
  margin: 0px;
  padding: 0px
}
#mtc {
  border: 1px solid #000;
  background: tomato;
  padding: 2px;
  margin: 4px;
  cursor: pointer;
  font-size: 1.4em;
  font-weight: bold;
  border-radius:2px;
}
#mtc:after {
  content: 'Tiles';
}

<script src="https://maps.googleapis.com/maps/api/js?v=3"></script>
<div id="map-canvas"></div>