如果我们为两个层添加不同的样式,融合表不能显示两个层

时间:2012-08-25 04:40:23

标签: styles google-fusion-tables

由于5个融合表层和5个样式的一个融合表层的限制,我必须尝试它:使用5个融合表层,每个使用两个样式,然后我可以实现我的目的:显示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>

1 个答案:

答案 0 :(得分:1)

限制是(来自documentation&#34;您可以使用Maps API将最多五个Fusion Tables图层添加到地图中,其中一个可以使用最多五个样式规则进行样式设置。 #34;

您可以使用FusionTable用户界面设置图层的样式,但只有一个可以动态设置样式,而且只能有5个样式规则。