[Users] Need help to dynamically add vector layer to treePanel

[Andreas Hocevar]

Hi,

please see comments inline.


On Sep 20, 2010, at 17:02 , David E. Reksten wrote:

> Hi all,
> 
> after having spent a lot of time trying different strategies, I still
> can't for the life of me figure out how to dynamically add a vector
> layer to my layer tree.
> 
> What I have so far:
> 
>    mapPanel = new GeoExt.MapPanel({
>        border: true,
>        region: "center",
>        map: new OpenLayers.Map(myMapConfig);,
>        margins: '0 5 5 0',
>        layers: [baseLayer1, baseLayer2, baseLayer3]
>    });
> 
>    treeConfig = new OpenLayers.Format.JSON().write([{

There is no need to JSON-encode above. In the example where you copied the code from (tree.js) this is only done to allow live-editing of the tree configuration. Use the object directly, don't send it to OpenLayers.Format.JSON.write.

>        nodeType: "gx_baselayercontainer",
>        text: "Base layers",
>        expanded: true
>    }, {
>        nodeType: "gx_overlaylayercontainer",
>        text: "My vector layers", // I want the new vector layers to
> appear here...
>        expanded: true,
>        loader: {
>            baseAttrs: {
>                radioGroup: "foo",
>                uiProvider: "use_radio"
>            }

I doubt that you want radioGroup, and I doubt that you want to use the use_radio uiProvider. See below.

>        }
>    }], true);
> 
>    treePanel = new Ext.tree.TreePanel({
>        id: 'mainpanel',
>        border: true,
>        region: "west",
>        title: "Map layers",
>        width: 200,
>        split: true,
>        collapsible: true,
>        margins: '0 0 5 5',
>        collapseMode: "mini",
>        autoScroll: true,
>        loader: new Ext.tree.TreeLoader({
>            applyLoader: false,
>            uiProviders: {
>                "use_radio": LayerNodeUI
>            }

You don't seem to have defined the LayerNodeUI in your code, and you don't need the uiProviders config option. I am pretty sure that using an undefined layer node ui causes your problem.

>        }),
>        root: {
>            nodeType: "async",
>            children: Ext.decode(treeConfig)

Use the treeConfig directly.

>        },
>        rootVisible: false,
>        lines: false
>    });
> 
> The user is supposed to add one or several named layers (by clicking a
> button that triggers the following):
> 
> function addVectorLayer() {
>    Ext.MessageBox.prompt('New layer', 'Type name for layer:',
>        function (btn, text) {
>            if (btn == 'ok') {
>                var newVectorLayer = new OpenLayers.Layer.Vector(
>                    text,
>                    {
>                        projection: new OpenLayers.Projection("EPSG:4326"),
>                        displayInLayerSwitcher: false,
>                        isBaseLayer: false,
>                        styleMap: new OpenLayers.StyleMap({
>                            "default": new OpenLayers.Style(
>                                OpenLayers.Util.applyDefaults({
>                                    fillColor:"#FF6666",
>                                    strokeColor: "#FF3333",
>                                    strokeWidth: 2
>                                },
>                                OpenLayers.Feature.Vector.style["default"])
>                            )
>                        })
>                );
>                // ***** THIS IS WHERE IT FAILS ******
>                map.addLayer(newVectorLayer); // this works, but does
> not add the layer to my treePanel
>                mapPanel.layers.add(newVectorLayer); // ...so I tried
> this but get an exception
>            };
>        }
>    );
> 
> };
> 
> I have looked and looked at the example in
> http://dev.geoext.org/trunk/geoext/examples/layercontainer.js but
> still can't get it to work and I guess that I must be missing
> something basic in how I use these components. For instance, my gut
> feeling tells me that the treePanel object should probably be told
> about the mapPanel somewhere, or is there some magic going on behind
> my back?

Yes, there is some magic going on. If you don't provide a layer store, your tree will use Ext.MapPanel.guess().layers - this only works if your application just has a single map.

Regards,
Andreas.

> 
> Any help with this is greatly appreciated!
> 
> Regards,
> .david
> _______________________________________________
> Users mailing list
> Users at geoext.org
> http://www.geoext.org/cgi-bin/mailman/listinfo/users



-- 
Andreas Hocevar
OpenGeo - http://opengeo.org/
Expert service straight from the developers.