Question

我正在尝试将多个kml图层添加到可以使用复选框打开和关闭的地图中。我得到那部分工作（耶！）。当我点击一个图层打开它时，它会放大（这很好），但是当我取消关闭以关闭图层时，它会缩小回我的地图范围。如何保持最后加载的图层的缩放？代码如下。

<script>
var map;
var watershedLayer = new google.maps.KmlLayer ({
url: 'http://mvihes.bc.ca/mapping/watersheds.kmz'
});

var ere1949Layer = new google.maps.KmlLayer ({
url: 'http://mvihes.bc.ca/mapping/ere1949.kmz'
});
function initialize() {
var parksville= new google.maps.LatLng(49.316786, -124.308768);
var mapOptions = {
zoom: 9,
center: parksville
};
map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
check();
}
function check()
{
    if(document.getElementById('watersheds').checked)
      {watershedLayer.setMap(map);}
    else
      {watershedLayer.setMap(null);}
    if(document.getElementById('ere1949').checked)
      {ere1949Layer.setMap(map);}
    else
      {ere1949Layer.setMap(null);}

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

</script>

我尝试使用preserveViewport函数，但它只是停止了放大图层，这不是我想要的。我是javaScript的新手，所以我可能会遗漏一些明显的东西......任何帮助都会受到赞赏！

jsfiddle

Answer 1

仅在尚未设置的情况下设置所选图层的地图属性：

function check()
{
    if(document.getElementById('watersheds').checked)
      {if(!watershedLayer.getMap())watershedLayer.setMap(map);}
    else
      {watershedLayer.setMap(null);}
    if(document.getElementById('ere1949').checked)
      {if(!ere1949Layer.getMap())ere1949Layer.setMap(map);}
    else
      {ere1949Layer.setMap(null);}

}

http://jsfiddle.net/jhagmq7L/16/

Answer 2

您还可以将最大和最小缩放级别附加到地图，以便在加载kml图层时考虑全部地图缩放。

// sets the min and max zoom levels of the map
    var opt = { minZoom: 6, maxZoom: 18 };
    map.setOptions(opt);

在复选框点击时保留Google地图缩放到kml图层

2 个答案: