Google Maps -根据缩放级别显示融合表图层
Google Maps -根据缩放级别显示融合表图层
提问于 2013-06-23 20:37:47
我试图根据Zoom level显示Fusion Table层，但地图上只显示了Zoom level 1的第一个层，而代码中的其他层根本不显示(无论缩放级别是什么，zoom level 1的层都会一直显示在地图上)。代码如下：
<html>
<head>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
var center = new google.maps.LatLng(-40.979898,173.305662);
function init() {
map = new google.maps.Map(document.getElementById('map_canvas'), {
center: center,
zoom: 6,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var parcel_boundary = new google.maps.FusionTablesLayer({
query: {
select: 'parcel_boundary_1_9999',
from: '1ouLS0fm8tPPQNQRpr-bwE4ct-cBkMB-Ru_XttDQ'
},
styles: [{
polygonOptions: {
strokeColor: "#333333",
strokeOpacity: 0.8,
strokeWeight: 0.7,
fillColor: "#36549C",
fillOpacity: 0.3
}
}]
});
var meshblock_1_24113 = new google.maps.FusionTablesLayer({
query: {
select: 'meshblock_1_24113',
from: '1nLxnoXlipws7PfjBihBBGL2BVd7OKdxThSuLVRs'
}
});
var territorial_authority = new google.maps.FusionTablesLayer({
query: {
select: 'territorial_authority',
from: '1YBAtek3BB_sQsxHPJxDTP6Pa6Fy_N12iQ8bIZQQ'
},
styles: [{
polygonOptions: {
strokeColor: "#333333",
strokeOpacity: 0.8,
strokeWeight: 0.7,
fillColor: "#C42D24",
fillOpacity: 0.3
}
}]
});
var zoom = map.getZoom();
if (zoom >=1 && zoom <=8) {
territorial_authority.setMap(map);
meshblock_1_24113.setMap(null);
parcel_boundary.setMap(null);
}
if (zoom >9 && zoom <=10) {
territorial_authority.setMap(null);
meshblock_1_24113.setMap(map);
parcel_boundary.setMap(null);
}
else if (zoom >11 && zoom <=15) {
territorial_authority.setMap(null);
meshblock_1_24113.setMap(null);
parcel_boundary.setMap(map);
}
;
}
</script>
</head>
<body id="body" onload="init();">
<div id="map_canvas" style="position:absolute; border-style:solid; border-width:1px; border-color:#333333; left:50%; top:20px; width:1000px; height:860px; z-index:1; margin-left: -500px;"></div>
</body>
</html>有没有人遇到过这样的问题？
回答 1
Stack Overflow用户
回答已采纳
发布于 2013-06-23 22:18:30
您的代码不包括地图上"zoom_changed“事件的侦听器，该事件将在地图上的缩放更改时触发，并允许您按照新的缩放级别进行操作。
google.maps.event.addListener(map,"zoom_changed", function() {
var zoom = map.getZoom();
if (zoom >=1 && zoom <=9) {
territorial_authority.setMap(map);
meshblock_1_24113.setMap(null);
parcel_boundary.setMap(null);
}
else if (zoom >9 && zoom <=11) {
territorial_authority.setMap(null);
meshblock_1_24113.setMap(map);
parcel_boundary.setMap(null);
}
else if (zoom >11) {
territorial_authority.setMap(null);
meshblock_1_24113.setMap(null);
parcel_boundary.setMap(map);
}
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/17260806
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号