I'm setting up a small web mapping application using PostGIS + mod_tile + FeatureServer + OpenLayers + GeoExt, each of which I'm learning as I go. In addition to the base layer, I've pulled in a few vector layers from FeatureServer, each with many features. For example, a request to my "states" layers returns a GeoJSON feature for each state, and "Congressional districts" returns a feature for each Congressional District. I can render these layers to the map and toggle them in their entirety in a GeoEXT layer tree.

What I'd like to do (seems) straightforward: For each layer, display a grouped list of all features in a layer tree with checkboxes to toggle the visibility/rendering of each feature, individually. I'm struggling to find a straightforward way to do this.

There was a question on the GeoEXT mailing list that included code to set the renderIntent to 'delete' on uncheck:

var layerList = new GeoExt.tree.LayerNode({
    text: 'The United States',
    expanded: true,
    layer: usa, // refers to a vector layer using HTTP protocol to get GeoJSON. 
    leaf: false,
    children : [{
        text: "Alabama",
        leaf: true,
        checked: false
        text: "Alaska",
        leaf: true,
        checked: false
    }, {
    //...  load other fifty states

var layerTree = new Ext.tree.TreePanel({
    title: 'Map Layers',
    root: layerList,
    listeners: {
        'checkchange': function(node, checked){
            var tempfid = node.attributes.fid;
                node.parentNode.attributes.layer.getFeatureByFid(tempfid).renderIntent = 'default'; 
                // I am setting visibility with renderIntent because styles are reset when layer is redrawn form panning or zooming.
                node.parentNode.attributes.layer.getFeatureByFid(tempfid).renderIntent = 'delete';

I'm thinking there's a better way to do this (perhaps with Strategy.Filter?), but can't seem to wrap my head around it. Could someone point me in the right direction and/or to some examples that include this functionality? Thanks in advance for your help!

  • One thing I forgot to mention – I'm not married to FeatureServer if this is more easily achieved with another WFS.
    – danpelota
    Aug 24, 2011 at 12:30

1 Answer 1


This might help you

    //create a  TreeNode
    var treeNode = new Ext.tree.TreeNode({
                text: "Treenode",
                bodyStyle: 'background-color:#A4A4A4;'
//Append grouped overlays in the TreeNode
treeNode.appendChild(new GeoExt.tree.OverlayLayerContainer({
            text: "Overlay",
            map: map,
            loader: {

                        filter: function(record) {
                            return record.get("layer").name.indexOf("area")!== -1;


if there are two area layers with name : Market area & Ag. area. The area layers should be appear inside the "Overlay" tree.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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