Google Maps用循环更改缩放

Question

我正在使用Google Maps API生成地图。是否可以制作一个JavaScript循环，该循环会在5秒后将地图缩放更改1直到Zoom达到10？

该地图不是静态地图，所以我认为更改Zoom的方法是刷新页面，但这将重置循环。

var map = null;
     function initialize() {
        var myOptions = {
            center: {
              lat: 34.052234, 
              lng: -118.243685
            },
          zoom: 1,
          scale: 2,
          disableDefaultUI: true,
          // mapTypeId: 'roadmap'
          mapTypeId: google.maps.MapTypeId.SATELLITE
          };
          map = new google.maps.Map(document.getElementById("map"),myOptions);
    }

Answer 1

您可以使用map.setZoom：

将映射缩放级别从JavaScript更改

var timer = setInterval(function() {
  map.setZoom(map.getZoom() + 1);
  if (map.getZoom() == 10)
    clearInterval(timer);
}, 5000)

概念证明小提琴

代码段：

var map = null;
function initialize() {
  var myOptions = {
    center: {
      lat: 34.052234,
      lng: -118.243685
    },
    zoom: 1,
    scale: 2,
    disableDefaultUI: true,
    // mapTypeId: 'roadmap'
    mapTypeId: google.maps.MapTypeId.SATELLITE
  };
  map = new google.maps.Map(document.getElementById("map"), myOptions);
  var timer = setInterval(function() {
    map.setZoom(map.getZoom() + 1);
    if (map.getZoom() == 10)
      clearInterval(timer);
  }, 5000)
}
google.maps.event.addDomListener(window, "load", initialize);

html,
body,
#map {
  height: 100%;
  width: 100%;
  margin: 0px;
  padding: 0px
}

<script src="https://maps.googleapis.com/maps/api/js"></script>
<div id="map"></div>