[OpenLayers-Users] Selecting Feature Trouble

Snoosel mario.schedler at web.de
Sun Apr 25 07:02:54 EDT 2010


Hi,

during the last weeks I have created a small Web-Map using OpenLayers, ExtJs
and GeoExt. When clicking a tree element some points will be dispalyed in
the map and the Extent will be changed related to the data extent. 

When selecting a point the point will be highlighted and a message will be
displayed using alert(). As soon as I select another point the first point
is still highlighted. Does anybody has a solution why this happens. I tried
to figure it out but I'm not successful.

Thanks, Mario


Code:
Ext.onReady(function(){
	
	var map = new OpenLayers.Map();

    var wmsLayer = new OpenLayers.Layer.WMS(
        "vmap0",
        "http://labs.metacarta.com/wms/vmap0",
        {layers: 'basic'}
    );

    var vecLayer = new OpenLayers.Layer.Vector("vector");
    map.addLayers([wmsLayer, vecLayer]);
	vecLayer.setVisibility(false);

	var selectControl = new OpenLayers.Control.SelectFeature(vecLayer, {
		toggle: true, 
		clickout: true
	});
	map.addControl(selectControl);
	selectControl.activate();

	var tmpLayer;

	store = new GeoExt.data.FeatureStore({
        layer: vecLayer,
        fields: [
            {name: 'name', type: 'string'},
			{name: 'id', type: 'string'}
        ],
        proxy: new GeoExt.data.ProtocolProxy({
            protocol: new OpenLayers.Protocol.HTTP({
                url: "point.asp",
                format: new OpenLayers.Format.GML()
            })
        }),
		autoLoad: true
    });

	Ext.app.PositionLoader = Ext.extend(Ext.ux.tree.XmlTreeLoader, {
	    processAttributes : function(attr){
	        if(attr.cname){
	            attr.text = attr.cname;
	            attr.iconCls = 'author-' + attr.gender;
	            attr.loaded = true;
	            attr.expanded = true;
	        } else
	        if(attr.sname){
				attr.text = attr.sname;
				attr.iconCls = 'book';
				attr.loaded = true;
	            attr.expanded = true;
	        } else
	        if(attr.pname){
	            attr.text = attr.pname;
	            attr.iconCls = 'book';
	            attr.loaded = true;
				attr.expanded = true;
	        } else
	        if(attr.aname){
	            attr.text = attr.aname;
	            attr.iconCls = 'book';
	            attr.loaded = true;
				attr.leaf = true;
	        } 
	    }
	});

	var detailsText = 'Select';

	var tpl = new Ext.Template(
		'<h2 class="title">{scanname}</h2>',
		'<p>Id: {id}</p>',
		'<p>Name: {innerText}</p>',
		'<p> {url} Link </p>'
	);
	tpl.compile();
	
	var tplArea = new Ext.Template(
		'<h2 class="title">{aname}</h2>'
	);
	tplArea.compile();

	new Ext.Panel({
		title: 'Location',
		renderTo: 'tree',
		layout: 'border',
		width: 800,
		height: 700,
		items: [{
			xtype: 'treepanel',
			id: 'tree-panel',
			region: 'center',
			margins: '2 2 0 2',
			animate: true,
			autoScroll: true,
			rootVisible: false,
			root: new Ext.tree.AsyncTreeNode(),
			loader: new Ext.app.PositionLoader({
				dataUrl:'point.asp'
			}),
			listeners: {
				'render': function(tp){
					tp.getSelectionModel().on('selectionchange', function(tree, node){
						var el = Ext.getCmp('details-panel').body;
						if (node && node.leaf) {

							if (Ext.isObject(tmpLayer)) {
								map.removeLayer(tmpLayer);
								tmpLayer.destroyFeatures();
								tmpLayer.destroy();
							}
							//Creating the new Store
							tmpLayer = new OpenLayers.Layer.Vector("Laser Scanning Positions", {
								eventListeners: {
									'featuresadded': function(feature){
										var extent = tmpLayer.getDataExtent();
										map.zoomToExtent(extent);
										map.zoomToExtent(extent);
									},
									'featureselected': function(event){
										var feature = event.feature;
										var detail = feature.attributes['name'];
										alert(feature.id);
									}
								}
							});
							map.addLayer(tmpLayer);

							tmpStore = new GeoExt.data.FeatureStore({
								layer: tmpLayer
							});
							
							var id = node.attributes.text + node.parentNode.attributes.text +
							node.parentNode.parentNode.attributes.text +
							node.parentNode.parentNode.parentNode.attributes.text;
							
							// Filter
							store.filter('id', id, true, true);
							
							//Adding records to tmpStore
							for (i = 0; i < store.getCount(); i++) {
								var record = store.getAt(i);
								tmpStore.add(record);
							}

						}

					})
				}
			}
		},{
			region: 'south',
			title: 'Location Details',
			id: 'details-panel',
			autoScroll: true,
			collapsible: true,
			split: true,
			margins: '0 2 2 2',
			cmargins: '2 2 2 2',
			height: 220,
			html: detailsText
		}, {
			region: 'east',
			id: "mappanel",
			title: "Map",
			xtype: "gx_mappanel",
			map: map,
			split: true,
			width: 580,
			margins: '0 0 5 0'
		}]
	});
	
});



Image:
http://n2.nabble.com/forum/FileDownload.jtp?type=n&id=4958044&name=Map.png 
-- 
View this message in context: http://osgeo-org.1803224.n2.nabble.com/Selecting-Feature-Trouble-tp4958044p4958044.html
Sent from the OpenLayers Users mailing list archive at Nabble.com.



More information about the Users mailing list