[Users] Toggle features in a layer tree

[Benjamin Ketnick]

I am trying to load a single vector layer and be able to turn on and off visibility of individual features within that layer from a layer tree.

For example, load all the United States in one layer and turn on and off each state from the layer tree. 

I would like to display this as a grouped layer for organization. Here is what I have come up with so far. Is there a better way to do this?

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,
		fid:1,
		checked: false
	},{
		text: "Alaska",
		leaf: true,
		fid:2,
		checked: false
	}, {
	//...  load other fifty states
	}]
});

var layerTree = new Ext.tree.TreePanel({
	title: 'Map Layers',
	root: layerList,
	autoScroll:true,
	listeners: {
		'checkchange': function(node, checked){
			var tempfid = node.attributes.fid;
			if(checked){
				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.redraw();
			}else{
				node.parentNode.attributes.layer.getFeatureByFid(tempfid).renderIntent = 'delete';
				node.parentNode.attributes.layer.redraw();
			}
		}
	}
});

I can't load individual layers for each state because I intend to do this with other layers and OpenLayers can only display so many layers at a time, also requests would become very heavy.

I am also using featureserver for my requests which does not have built in GetCapabilities functionality.

I have found an example in OpenLayers that achieves what I am trying to do here: http://gis.ibbeck.de/ginfo/apps/OLExamples/OL26/examples/select-feature-with-function.html