0
다섯 개의 퓨전 테이블 레이어와 하나의 퓨전 테이블 레이어의 다섯 가지 스타일의 한계로 인해 다음과 같이 시도해야합니다. 각각 하나는 두 가지 스타일을 사용하고 그 다음에는 내 목적대로 갈 수 있습니다 :지도에 10 가지 스타일을 보여줍니다.퓨전 테이블은 두 개의 레이어에 다른 스타일을 추가하면 두 레이어를 표시 할 수 없습니다
하지만 구현 한 후 첫 번째 융합 테이블 레이어 만 표시한다는 것을 알았습니다.
그런 다음 테스트 케이스를 작성하여 그 이유를 확인했습니다. 발견 된 부분 : 두 개의 레이어로 스타일을 설정하면 첫 번째 레이어 만 표시되고 두 번째 레이어는 사라집니다. 한 레이어의 스타일을 설정하면 잘 작동합니다.
아래 코드는 누군가 도와 드릴 수 있습니까? 이제는 하나의 레이어 만 표시됩니다. 스타일 설정이나 그 중 하나의 스타일 설정에 주석을 달면 두 레이어를 모두 표시 할 수 있습니다.
미리 감사드립니다.
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
html { height: 100% }
body { height: 100%; margin: 0px; padding: 0px }
#top-box {padding: 10px; background-color:#336699;}
.para-line {font-weight:bold;}
#map_canvas { height: 100% }
</style>
<script type="text/javascript"src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
var map;
function initialize() {
map = new google.maps.Map(document.getElementById("map_canvas"));
map.setMapTypeId('roadmap');
map.setCenter(new google.maps.LatLng(38.4985464, -98.3834298));
map.setZoom(4);
var tableid1 = 4436842;
var style = [{
where: "State in('IL','PA')",
polygonOptions:
{
fillColor: "#rrggbb",
fillOpacity: 0.7
}
},{
where: "State in('AL')",
polygonOptions:
{
fillColor: "#006400",
fillOpacity: 0.7
}
}
];
var query1 = {
select: ['geometry','name'],
from: tableid1,
where: "State in('IL','PA')"
}
var query2 = {
select: ['geometry','name'],
from: tableid1,
where: "State in('AL')"
}
var layer1 = new google.maps.FusionTablesLayer({
query:query1,
styles: style,
suppressInfoWindows: false,
clickable:true
});
layer1.setMap(map);
var layer2 = new google.maps.FusionTablesLayer({
query:query2,
styles:style,
suppressInfoWindows: false,
clickable:true
});
layer2.setMap(map);
return;
}
</script>
</head>
<body onload="initialize()">
<div id="map_canvas" style="width:100%; height:100%"></div>
</body>
</html>
알았어. – yonghua