Google Maps API 3 - 不支持缩放

Question

我正在尝试开发一个通过 Google Maps API 显示 KML 文件的 HTML 页面。

页面链接： http://www.slocleanair.org/air/AQI_III/mapTest.html

我的问题是，当我用更新的缩放值替换文件时，缩放选项没有得到遵守。我认为这通常是 Web 的缓存问题，但 JavaScript 应该添加一个后缀，通过创建一个唯一的 urlSuffix 来破坏缓存。

var kmlPath = "http://www.slocleanair.org/air/AQI_III/AQI_2015_xx_xx.kml";
// Add unique number to this url - as with images - to avoid caching issues during development
var urlSuffix = (new Date).getTime().toString();
var layer = new google.maps.KmlLayer(kmlPath + '?' + urlSuffix );
layer.setMap(map);

这种技术是否可以让我在不从缓存中提取先前版本的情况下引用同名文件？或者这是 Google Maps API 的问题？还是我的编码错误？

代码sn-p：

var mylocation = {
  'latitude': 35.3,
  'longitude': -120.3
};
var map;

function initialize() {
  var myLatlng = new google.maps.LatLng(mylocation.latitude, mylocation.longitude);
  var mapOptions = {
    zoom: 12,
    center: myLatlng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  };
  var map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);
  // This needs to be the Full URL - not a relative URL
  var kmlPath = "http://www.slocleanair.org/air/AQI_III/AQI_2015_xx_xx.kml";
  // Add unique number to this url - as with images - to avoid caching issues during development
  var urlSuffix = (new Date).getTime().toString();
  var layer = new google.maps.KmlLayer(kmlPath + '?' + urlSuffix);
  layer.setMap(map);
}

google.maps.event.addDomListener(window, 'load', initialize);

#map_canvas {
  margin-left: auto;
  margin-right: auto;
  padding: 0;
  width: 260px;
  height: 180px;
}

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

Answer 1

如果您不希望地图缩放以适​​应 KmlLayer 内容，请将 preserveViewport 选项设置为 true。

工作代码sn-p：

  var mylocation = {'latitude':  35.3,'longitude':  -120.3};
  var map;
  function initialize() {
    var myLatlng = new google.maps.LatLng( mylocation.latitude, mylocation.longitude );
    var mapOptions = {zoom: 12,center: myLatlng,mapTypeId: google.maps.MapTypeId.ROADMAP};
    var map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);
    // This needs to be the Full URL - not a relative URL
    var kmlPath = "http://www.slocleanair.org/air/AQI_III/AQI_2015_xx_xx.kml";
    // Add unique number to this url - as with images - to avoid caching issues during development
    var urlSuffix = (new Date).getTime().toString();
    var layer = new google.maps.KmlLayer({url:kmlPath + '?' + urlSuffix, preserveViewport: true} );
    layer.setMap(map);
  }

  google.maps.event.addDomListener(window, 'load', initialize);

#map_canvas {margin-left: auto;margin-right: auto;padding: 0;width: 260px;height: 180px;}

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