0

I am trying to generate a customized layer tree using GeoExt 2.0.2 My code is as follows:

var store = Ext.create('Ext.data.TreeStore', {
            model: 'GeoExt.data.LayerTreeModel',
            root: {
                expanded: true,
                children: [
                    {
                        plugins: ['gx_baselayercontainer'],
                        expanded: true,
                        text: "Mappe di base"
                    },{
                        expanded: true,
                        text: 'Dati amministrativi', 
                        leaf: false,          
                        children: [
                        {
                         text: "Area progetto",
                         layer: "area_progetto",
                         nodeType: "gx_layer",
                         iconCls: 'area_progetto',
                         checked: true
                        },
                        {
                         text: "Comuni italiani",
                         layer: "comuni_italia",
                         nodeType: "gx_layer",
                         iconCls: 'comuni_italia',
                         checked: true
                        }
                       ]
                     },{
                        expanded: true,
                        text: 'Percorso Via Regina', 
                        leaf: false,          
                        children: [
                        {
                         text: "Tratte",
                         layer: "via_regina_tratte",
                         nodeType: "gx_layer",
                         iconCls: 'via_regina_tratte',
                         checked: true
                        }
                       ]
                  }
               ]
             }
        });

tree = Ext.create('GeoExt.tree.Panel', {
        border: true,
        region: "west",
        title: "Layers",
        width: 250,
        split: true,
        collapsible: true,
        collapseMode: "mini",
        autoScroll: true,
        rootVisible: false,
        lines: false,
        store: store
    });

My purpose here is to create multiple folders with the layers that I select and I want to assign different icons for each layer. This code created subnodes as I want, and I can assign a different icon for each layer in the tree, but the checkboxes are not working. Do you have any ideas or suggestions about why they are not working and how I can make them work?

NOTE: radio buttons for base layers are working

NOTE2: Setting the "store" as follows actually work for overlay layers, but in this case one big folder is created containing every layer except the base maps and I cannot create different folders and assign different icons for each layer.

   var store = Ext.create('Ext.data.TreeStore', {
        model: 'GeoExt.data.LayerTreeModel',
        root: {
            expanded: true,
            children: [
                {
                    plugins: ['gx_baselayercontainer'],
                    expanded: true,
                    text: "Base Maps"
                },{
                    plugins: [{
                        ptype: 'gx_overlaylayercontainer'
                    }],
                    expanded: true,
                    text: 'Overlay Layers'
                }
            ]
        }
    });
  • Welcome to GIS SE. If possible, it is best to produce a minimal working example in jsFiddle (or similar), as any error might be in another part of the code you have not shown. – John Powell Jan 23 '15 at 9:36
0

For someone who may need the answer in the future I solved the problem by changing the definition of the node slightly:

{
  plugins: ['gx_layer'],
  text: "Area progetto",
  layer: area_progetto,
  iconCls: 'area_progetto',
  onCheckChange: true
}

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.