[Users] How can I Edit GeoExt (from examples) Tree.js to be Nested Tree

[Alexandre Dubé]

Hi,

   You might be interested in the unofficial LayerTreeBuilder widget, 
which takes care of creating the layer tree with nested folders for you 
using a single and simple option: 'group', inside your OpenLayers.Layer 
objects.  Its value is a string of folder names, separated by '/'.

   See it live:
http://dev.geoext.org/geoext/sandbox/mapgears/geoext.ux/ux/LayerTreeBuilder/examples/tree-builder.html

   Its source is in svn, you can get it at:
http://svn.geoext.org/sandbox/mapgears/geoext.ux/ux/LayerTreeBuilder/

   If you'd rather build your own tree, you can look at the tree builder 
source to see how it works.

   Note: this version is for GeoExt 1.x, and ExtJS 3.x.

HTH,

Alexandre


On 12-12-02 12:23 PM, Shariful Islam wrote:
> Hi all,
>
> It may be a very disgusting question from me a noob .
> I am very Upset to be failed to create nested tree in the tree.js file 
> (included in the examples folder).
> I need it very much, very much(not a superfluous word). I failed to do 
> it after trying a month
>
> THANKS A LOT IN ADVANCE
>
> var mapPanel, tree;
> Ext.onReady(function() {
>     // create a map panel with some layers that we will show in our 
> layer tree
>     // below.
>     mapPanel = new GeoExt.MapPanel({
>         border: true,
>         region: "center",
>         // we do not want all overlays, to try the OverlayLayerContainer
>         map: new OpenLayers.Map({allOverlays: 1}),
>         center: [146.1569825, -41.6109735],
>         zoom: 6,
>         layers: [
>             new OpenLayers.Layer.WMS("Global Imagery",
> "http://maps.opengeo.org/geowebcache/service/wms", {
>                     layers: "bluemarble"
>                 }, {
>                     isBaseLayer: false,
>                     buffer: 0,
>                     visibility: false
>                 }
>             ),
>             new OpenLayers.Layer.WMS("Tasmania State Boundaries",
>                 "http://demo.opengeo.org/geoserver/wms", {
>                     layers: "topp:tasmania_state_boundaries"
>                 }, {
>                     isBaseLayer: false,
>                     buffer: 0
>                 }
>             ),
>             new OpenLayers.Layer.WMS("Water",
>                 "http://demo.opengeo.org/geoserver/wms", {
>                     layers: "topp:tasmania_water_bodies",
>                     transparent: true,
>                     format: "image/gif"
>                 }, {
>                     isBaseLayer: false,
>                     buffer: 0
>                 }
>             ),
>             new OpenLayers.Layer.WMS("Cities",
>                 "http://demo.opengeo.org/geoserver/wms", {
>                     layers: "topp:tasmania_cities",
>                     transparent: true,
>                     format: "image/gif"
>                 }, {
>                     isBaseLayer: false,
>                     buffer: 0
>                 }
>             ),
>             new OpenLayers.Layer.WMS("Tasmania Roads",
>                 "http://demo.opengeo.org/geoserver/wms", {
>                     layers: "topp:tasmania_roads",
>                     transparent: true,
>                     format: "image/gif"
>                 }, {
>                     isBaseLayer: false,
>                     buffer: 0
>                 }
>             ),
>             // create a group layer (with several layers in the 
> "layers" param)
>             // to show how the LayerParamLoader works
>             new OpenLayers.Layer.WMS("Tasmania (Group Layer)",
>                 "http://demo.opengeo.org/geoserver/wms", {
>                     layers: [
>                         "topp:tasmania_state_boundaries",
>                         "topp:tasmania_water_bodies",
>                         "topp:tasmania_cities",
>                         "topp:tasmania_roads"
>                     ],
>                     transparent: true,
>                     format: "image/gif"
>                 }, {
>                     isBaseLayer: false,
>                     buffer: 0,
>                     // exclude this layer from layer container nodes
>                     displayInLayerSwitcher: false,
>                     visibility: false
>                 }
>             ),
>
>             new OpenLayers.Layer.WMS("Tasmania State Boundaries",
>                 "http://demo.opengeo.org/geoserver/wms", {
>                     layers: "topp:tasmania_state_boundaries"
>                 }, {
>                     isBaseLayer: false,
>                     buffer: 0
>                 }
>             )
>         ]
>  I think i need add severel array into the above portion but how do i 
> this, Does I have to edit tree config block below.
>
> Block--1
>
>  var treeConfig = [{
>         nodeType: "gx_baselayercontainer"
>     }, {
>         nodeType: "gx_overlaylayercontainer",
>         expanded: true,
>         // render the nodes inside this container with a radio button,
>         // and assign them the group "foo".
>         loader: {
>             baseAttrs: {
>                 radioGroup: "foo",
>                 uiProvider: "layernodeui"
>             }
>         }
>     }, {
>         nodeType: "gx_layer",
>         layer: "Tasmania (Group Layer)",
>         isLeaf: false,
>         // create subnodes for the layers in the LAYERS param. If we 
> assign
>         // a loader to a LayerNode and do not provide a loader class, a
>         // LayerParamLoader will be assumed.
>         loader: {
>             param: "LAYERS"
>         }
>     }];
>
> Block--2
>
>
>     tree = new Ext.tree.TreePanel({
>         border: true,
>         region: "west",
>         title: "Layers",
>         width: 200,
>         split: true,
>         collapsible: true,
>         collapseMode: "mini",
>         autoScroll: true,
>         plugins: [
>             new GeoExt.plugins.TreeNodeRadioButton({
>                 listeners: {
>                     "radiochange": function(node) {
>                         alert(node.text + " is now the active layer.");
>                     }
>                 }
>             })
>         ],
>         loader: new Ext.tree.TreeLoader({
>             // applyLoader has to be set to false to not interfer with 
> loaders
>             // of nodes further down the tree hierarchy
>             applyLoader: false,
>             uiProviders: {
>                 "layernodeui": LayerNodeUI
>             }
>         }),
>         root: {
>             nodeType: "async",
>             // the children property of an Ext.tree.AsyncTreeNode is 
> used to
>             // provide an initial set of layer nodes. We use the 
> treeConfig
>             // from above, that we created with 
> OpenLayers.Format.JSON.write.
>             children: Ext.decode(treeConfig)
>             // Don't use the line above in your application. Instead, use
>             //children: treeConfig
>
>         },
>         listeners: {
>             "radiochange": function (node) {
>                 alert(node.layer.name + " is now the the active layer.");
>             }
>         },
>         rootVisible: false,
>         lines: false,
>         bbar: [{
>             text: "Show/Edit Tree Config",
>             handler: function () {
>                 treeConfigWin.show();
>                 Ext.getCmp("treeconfig").setValue(treeConfig);
>             }
>         }]
>     });
>
> Thanks in advance  a lot.
>
>     });
>
>
> _______________________________________________
> Users mailing list
> Users at geoext.org
> http://www.geoext.org/cgi-bin/mailman/listinfo/users


-- 
Alexandre Dubé
Mapgears
www.mapgears.com

-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://www.geoext.org/pipermail/users/attachments/20121203/268b6ece/attachment.htm