0

我使用融合表在谷歌地图上加载多个 FusionTableLayer。但是今天突然我发现我无法在 google map api 中一次加载超过 5 个 fusiontablelayer。

js代码是

<script type="text/javascript" id="telerikClientEvents1">
        var layers = [];
        var map,jsg;
        var layerName, ctr = 0;
        jsg = new google.maps.FusionTablesLayer({
            query: {
                select: '\'geometry\'',
                from: '1jWdnG9b_mQP03PowydJufDpztjWo0AIipDpTjSU'
            }, suppressInfoWindows: true
        });

        function initialize() {
            var mapOptions = {
                center: new google.maps.LatLng(21.807007904182043, 83.90197012695307),
                zoom: 10,
                mapTypeId: google.maps.MapTypeId.ROADMAP
            };
            map = new google.maps.Map(document.getElementById("map_canvas"),
            mapOptions);

            // District Layer           
            jsg.setMap(map);

            google.maps.event.addListener(layers[2], 'click', show_info);
            google.maps.event.addListener(layers[3], 'click', show_info);
            google.maps.event.addListener(layers[4], 'click', show_info);

        } // End of INITIALIZE

        layers[1] = "";
        layers[2] = "";
        // Block Layer
        layers[2] = new google.maps.FusionTablesLayer({
            query: {
                select: '\'geometry\'',
                from: '1oZafm0cmC9L5FQVHuqLHNxcH3Pw1D_rJFEGnzK0'
            }, suppressInfoWindows: true
        });
        // Gp Layer
        layers[3] = new google.maps.FusionTablesLayer({
            query: {
                select: '\'geometry\'',
                from: '1NCtxMDVIcfDZc8bLiTT0nkVBSqwpv3mhsRJS8UM'
            }, suppressInfoWindows: true
        });
        // Village Layer
        layers[4] = new google.maps.FusionTablesLayer({
            query: {
                select: '\'geometry\'',
                from: '15erGSkOpR8L9HsxK25Ps4IfusUjN6996nwtC_qc'
            }, suppressInfoWindows: true
        });
        layers[6] = new google.maps.FusionTablesLayer({
            query: {
                select: '\'geometry\'',
                from: '1RxuDmSZLf5tfcpp0SDWb_50a0dAH1ePFCggby0U',
                where: 'PROJ_TYPE = \'Micro Irrigation\''
            }, suppressInfoWindows: true
        });
        layers[7] = "";
        layers[8] = new google.maps.FusionTablesLayer({
            query: {
                select: '\'geometry\'',
                from: '1RxuDmSZLf5tfcpp0SDWb_50a0dAH1ePFCggby0U',
                where: 'PROJ_TYPE = \'Water Conservation/Harvesting\''
            }, suppressInfoWindows: true
        });
        layers[9] = "";
        layers[10] = new google.maps.FusionTablesLayer({
            query: {
                select: '\'geometry\'',
                from: '1RxuDmSZLf5tfcpp0SDWb_50a0dAH1ePFCggby0U',
                where: 'PROJ_TYPE = \'Renovation of Traditional Waterbodies\''
            }, suppressInfoWindows: true
        });
        layers[11] = ""
        layers[12] = new google.maps.FusionTablesLayer({
            query: {
                select: '\'geometry\'',
                from: '1RxuDmSZLf5tfcpp0SDWb_50a0dAH1ePFCggby0U',
                where: 'PROJ_TYPE = \'Construction of Building\''
            }, suppressInfoWindows: true
        });

        //<![CDATA[
        //Information Window Shown in DIV

        function show_info(layerEvt) {
            //document.getElementById('show_info_details').innerHTML = layerEvt.infoWindowHtml;
            $("#show_info_details").html(layerEvt.infoWindowHtml);
            if (ctr == 0) {
                $(".panel").show("slow");
                $(".trigger").toggleClass("active");
                ctr = 1;
            }

        }
        // Checking and unchecking the treeview checked boxes in map
        function RadTreeView1_NodeChecked(sender, args) {
            var node = args.get_node();
            var childNodes = node.get_nodes();

            if (childNodes.get_count() > 0) {
                for (var i = 0; i < childNodes.get_count(); i++) {
                    var childNode = childNodes.getNode(i);
                    childNode.select();
                    if (childNode.get_checked()) {
                        alert("checked called");
                        layers[childNode.get_value()].setMap(map);
                    }
                    else {
                        alert("Entering");
                        if (layers[childNode.get_value()] != "") {
                            alert("Unchecked called");
                            layers[childNode.get_value()].setMap(null);
                        }

                    }

                }
            }
            //checking for node checked
            else {
                if (node.get_checked()) {
                    layers[node.get_value()].setMap(map);
                }

                else {
                    layers[node.get_value()].setMap(null);
                }
            }
        }
        //]]>
    </script>

树视图代码是

<asp:Panel ID="Panel1" runat="server" Height="410px">
                <telerik:RadTreeView ID="RadTreeView1" Runat="server" CheckBoxes="True" CheckChildNodes="True" 
                    ShowLineImages="False" Skin="Transparent" TriStateCheckBoxes="False" 
                    onclientnodechecked="RadTreeView1_NodeChecked">
                    <Nodes>
                        <telerik:RadTreeNode runat="server" Text="Administartive Boundaries">
                            <Nodes>
                                <telerik:RadTreeNode runat="server" Text="District" Value="1" Checkable="False">
                                </telerik:RadTreeNode>
                                <telerik:RadTreeNode runat="server" Text="Block" Value="2">
                                </telerik:RadTreeNode>
                                <telerik:RadTreeNode runat="server" Text="GP" Value="3">
                                </telerik:RadTreeNode>
                                <telerik:RadTreeNode runat="server" Text="Village" Value="4">
                                </telerik:RadTreeNode>
                            </Nodes>
                        </telerik:RadTreeNode>
                        <telerik:RadTreeNode runat="server" Text="Schemes">
                            <Nodes>
                                <telerik:RadTreeNode runat="server" Text="Micro Irrigation" Value="6">
                                </telerik:RadTreeNode>
                                <telerik:RadTreeNode runat="server" Text="Flood Control" Value="7" Checkable="False">
                                </telerik:RadTreeNode>
                                <telerik:RadTreeNode runat="server" Text="Water Conservation/Harvesting" Value="8">
                                </telerik:RadTreeNode>
                                <telerik:RadTreeNode runat="server" Text="Drought ?" Value="9" Checkable="False">
                                </telerik:RadTreeNode>
                                <telerik:RadTreeNode runat="server" Text="Renovation of Traditional Waterbodies" Value="10" >
                                </telerik:RadTreeNode>
                                <telerik:RadTreeNode runat="server" Text="nOTHING" Value="11" Checkable="false" >
                                </telerik:RadTreeNode>
                                <telerik:RadTreeNode runat="server" Text="Construction of Building" Value="12" >
                                </telerik:RadTreeNode>
                            </Nodes>
                        </telerik:RadTreeNode>
                    </Nodes>
                </telerik:RadTreeView>
            </asp:Panel>
4

1 回答 1

1

"限制

您可以使用 Maps API 将最多五个 Fusion Tables 图层添加到地图中,其中一个可以使用最多五个样式规则设置样式。”

https://developers.google.com/maps/documentation/javascript/layers#FusionTables

于 2012-09-22T20:00:07.860 回答