Easyui 框架下 arcgis for js 图层控制简单实现

前端代码：

<div id="MapTreewindow" class="easyui-window" title="图层控制" closed="true" minimizable="false" 
     maximizable="false" data-options="iconCls:'icon-large-smartart'" style="width: 220px;
     height: 300px; padding: 10px;top:10px;left:calc(100% - 550px);">
<div id="tocmap"></div>
</div>

 

后端代码：      

 function loadmaptoc() {
        zjdkmap.infoWindow.resize(260, 240);
        var treeList = [];//jquery-easyui的tree用到的tree_data.json数组
        var root = { "id": "rootnode", "text": "全部图层", "children": [] };//增长一个根节点
        appendLayer(tubanlayer, "", root);    //增长节点
        appendLayer(fangyanglayer, "", root);
        appendLayer(tdt_basemap, "", root);
        appendLayer(tdt_annolayer, "", root);
        appendLayer(tdt_imgbasemap, "", root);
        appendLayer(tdt_imgannolayer, "", root);
        treeList.push(root);
        //jquery-easyui的树        
        $('#tocmap').tree({
            data: treeList,
            checkbox: true, //使节点增长选择框
            onCheck: function (node, checked) {//更新显示选择的图层
                //var nodes = $('#tocmap').tree("getChecked");
                if (node.id == "rootnode") {
                    dojo.forEach(node.children, function (node) {
                        var layer = zjdkmap.getLayer(node.id)
                        layer.setVisibility(checked);
                    });
                }
                else {
                    var layer = zjdkmap.getLayer(node.id)
                    layer.setVisibility(checked);
                }
            }
        });
        $('#MapTreewindow').window('open', function () {
        });
    }

 function appendLayer(layer, icon, root) {
        var node = {
            "id": layer.id,
            "text": layer.id,
            "pid": root.id,
            "iconCls": icon,
            "checked": layer.visible ? true : false,
            "children": []
        };
        root.children.push(node);
    }

 更多GIS开发相关问题请加入 GIS开发学习QQ交流群 192251607 共同交流学习！