Hi all, After a lot of work and questions on this list (thanks for all the help!), I currently have a viewport that has two wfs layers in it, that display properly in all browsers. Phew! It has been a steep learning curve. I have one more question though, it's about selecting and styles.
I have made a multilayer select control (see also: http://dev.openlayers.org/sandbox/ahocevar/singleroot/openlayers/examples/select-feature-multilayer.html An example of SelectFeature on multiple vector layers ). The selecting works, the layes are both selecting, I can deselect using control and I can select multiple features on different layers using the shift key. My custom styles are being implemented for "default", "temporary" and "select" states. All seems well, but: there is a problem. When I select a feature (or more than one) and then zoom in or out or do something else that makes openlayers redraw, the feature returns to its "default" style as defined in the stylemap for the feature. I get this in both IE7 and Firefox 3.0.11. I find it strange, because the example shown in the above link doesn't show this behaviour. I log the select/unselect events to a div in the page, and I don't see an unselect statement when I zoom out. However, when I try to unselect the feature (which looks unselected, but should in fact still be selected) with ctrl-click, I don't get a log of an unselect event. Instead when I try to select the feature, that works. It is correctly displayed in the "select" style from the stylemap and the select statement becomes/stays(?) selected according to the select statement. I hope the above clarifies the problem I have. Below you'll find the code of my init-script, which I hope contains all the information necessary for the troubleshooting. If not, please let me know what more I should provide. Thanks in advance for any help! I will be greatly appreciated. Best regards, Martijn Senden. Code of init-script: _________________________________ // Avoid pink tiles OpenLayers.IMAGE_RELOAD_ATTEMPTS = 3; OpenLayers.Util.onImageLoadErrorColor = "transparent"; function init(){ //OpenLayers.ProxyHost="/cgi-bin/proxy.cgi/?url="; //Create a new OpenLayers mapwindow with associated controls var map = new OpenLayers.Map('map', { projection: "EPSG:28992", maxResolution: 1328.125, numZoomLevels: 14, maxExtent : new OpenLayers.Bounds(-23500,289000,316500,629000), restrictedExtent: new OpenLayers.Bounds(80000,442000,88000,452000), units : "m", controls: [ new OpenLayers.Control.ZoomToMaxExtent(), new OpenLayers.Control.PanZoomBar({zoomWorldIcon: true}), new OpenLayers.Control.LayerSwitcher({'ascending':false}), new OpenLayers.Control.MousePosition({ 'numDigits':0, 'separator':', ', 'granularity': 10 }), new OpenLayers.Control.MouseDefaults(), new OpenLayers.Control.KeyboardDefaults() ] }); // Add Spoortunnel Delft Mapserver .map-files layer = new OpenLayers.Layer.MapServer( "Topografie", "/geoviewerbin/mapserv.exe", {map: "c:/OSGeo4W/apps/geoviewer/maps/spoortunnel.map", layers: "Topografie"} ); map.addLayer(layer); var StyleTunnel = new OpenLayers.StyleMap({ "default": new OpenLayers.Style({ strokeColor: "#bfac57", fillColor: "#ffe674", fillOpacity: 0.8, strokeWidth: 2 }), "temporary": new OpenLayers.Style({ strokeColor: "#750c11", cursor: "crosshair", fillColor: "#b5121b" }), "select": new OpenLayers.Style({ strokeColor: "#005676", fillColor: "#0084b6" }) }); var StylePeilbuizen = new OpenLayers.StyleMap({ "default": new OpenLayers.Style({ fillColor: "#ffe674", strokeColor: "#bfac57", graphicName: "circle", pointRadius: 3, strokeWidth: 1 }), "temporary": new OpenLayers.Style({ fillColor: "#b5121b", strokeColor: "#750c11", cursor: "crosshair" }), "select": new OpenLayers.Style({ fillColor: "#0084b6", strokeColor: "#005676" }) }); wfs = new OpenLayers.Layer.WFS( "Contour spoortunnel", "/geoviewerbin/mapserv.exe?map=c:/OSGeo4W/apps/geoviewer/maps/spoortunnel.map", {typename: 'SpoortunnelWFS'}, { typename: "SpoortunnelWFS", extractAttributes: false, styleMap: StyleTunnel } ); map.addLayer(wfs); wfs2 = new OpenLayers.Layer.WFS( "Peilbuizen", "/geoviewerbin/mapserv.exe?map=c:/OSGeo4W/apps/geoviewer/maps/spoortunnel.map", {typename: 'PeilbuizenWFS'}, { typename: "PeilbuizenWFS", extractAttributes: false, styleMap: StylePeilbuizen } ); map.addLayer(wfs2); // Create a select feature control and add it to the map. var highlightCtrl = new OpenLayers.Control.SelectFeature([wfs,wfs2], { hover: true, highlightOnly: true, renderIntent: "temporary" }); var selectCtrl = new OpenLayers.Control.SelectFeature([wfs,wfs2], { clickout: true, toggle: false, toggleKey: "ctrlKey", // ctrl key removes from selection multipleKey: "shiftKey"//, // shift key adds to selection }); map.addControl(highlightCtrl); map.addControl(selectCtrl); highlightCtrl.activate(); selectCtrl.activate(); wfs.events.on({ "featureselected": function(e) { showStatus("selected feature "+e.feature.id+" on WFS Layer 1"); }, "featureunselected": function(e) { showStatus("unselected feature "+e.feature.id+" on WFS Layer 1"); } }); wfs2.events.on({ "featureselected": function(e) { showStatus("selected feature "+e.feature.id+" on WFS Layer 2"); }, "featureunselected": function(e) { showStatus("unselected feature "+e.feature.id+" on WFS Layer 2"); } }); //Add a scalebar to the map scalebar = new OpenLayers.Control.ScaleBar(); map.addControl(scalebar); //Set extents of initial mapview var geoviewerExtent=new Array(); geoviewerExtent[0] = 83600; // x-min geoviewerExtent[1] = 446000; // y-min geoviewerExtent[2] = 84600; // x-max geoviewerExtent[3] = 448200; // y-max ZoomToSetExtent(geoviewerExtent[0],geoviewerExtent[1],geoviewerExtent[2],geoviewerExtent[3],map); } function showStatus(text) { document.getElementById("layerindex").innerHTML = text; } function ZoomToSetExtent(Xmin,Ymin,Xmax,Ymax,geoviewermap){ // Set mapview extents to input parameters var extentRatio = (Xmax-Xmin)/(Ymax-Ymin); var geoviewerSize = geoviewermap.getSize(); var sizeRatio = geoviewerSize.w/geoviewerSize.h; if (sizeRatio >= extentRatio) { var geoviewerResolution = (Ymax-Ymin)/geoviewerSize.h; var minX = ((Xmin+Xmax)/2)-(geoviewerResolution*geoviewerSize.w/2); var minY = Ymin; var maxX = ((Xmin+Xmax)/2)+(geoviewerResolution*geoviewerSize.w/2); var maxY = Ymax; } else { var geoviewerResolution = (Xmax-Xmin)/geoviewerSize.w; var minX = Xmin; var minY = ((Ymin+Ymax)/2)-(geoviewerResolution*geoviewerSize.h/2); var maxX = Xmax; var maxY = ((Ymin+Ymax)/2)+(geoviewerResolution*geoviewerSize.h/2); }; // Zoom to set extent geoviewermap.zoomToExtent(new OpenLayers.Bounds(minX,minY,maxX,maxY)); } function ZoomToSelectedFeatures(vectorlayer){ //ZoomToSelectedFeatures var fts = vectorlayer.selectedFeatures; var boundsSelected = fts[0].geometry.getBounds().clone(); for(var i=1;i<fts.length;i++) boundsSelected.extend(fts[i].geometry.getBounds()); map.zoomToExtent(boundsSelected,false); } -- View this message in context: http://n2.nabble.com/Selected-items-visually-return-to-%22default%22-state-upon-zooming-or-other-refreshing-of-the-viewport-tp3147690p3147690.html Sent from the OpenLayers Users mailing list archive at Nabble.com. _______________________________________________ Users mailing list Users@openlayers.org http://openlayers.org/mailman/listinfo/users