Note that there are some explanatory texts on larger screens.

plurals
  1. POForcing an OpenLayers Markers layer to draw on top, and having selectable layers beneath
    text
    copied!<p>I have an OpenLayers map with a raster base layer, a vector layer and a markers layer in that order. They display fine, in the correct order with the markers on top of the vectors, great.</p> <p>But when I add a SelectFeature Control and point it to the vector layer, it is suddenly drawn above the markers layer, despite all efforts to raise the marker layer or setting the Z index. It seems that the SelectFeature control overrides all drawing order settings. Is this by design, or can I overcome this somehow?</p> <p>The layer definitions:</p> <pre><code>var baselayer = new OpenLayers.Layer.WMS('Norden', 'http://{myarcgisserver}/ArcGIS/services/mylayer/MapServer/WMSServer', { layers :'1,2', transparent :false, width :'auto', height :'auto', filter :null }, { isBaseLayer: true, singleTile :true, ratio :1, alpha :false, transitionEffect :'resize' }); var vectorLayer = new OpenLayers.Layer.Vector("Work orders", { projection: new OpenLayers.Projection("EPSG:2400"), strategies: [new OpenLayers.Strategy.Fixed(), refresh], protocol: new OpenLayers.Protocol.HTTP({ url: "/WorkOrder/WorkOrders.ashx?output=geojson", format: new OpenLayers.Format.GeoJSON() }) }); var markerlayer = new OpenLayers.Layer.Markers("Markers", { projection: new OpenLayers.Projection("EPSG:2400"), displayInLayerSwitcher: false } ); </code></pre> <p>The control definition:</p> <pre><code>var selectctrl = new OpenLayers.Control.SelectFeature( vectorLayer, { clickout: true, toggle: false, multiple: false, hover: false, toggleKey: "ctrlKey", // ctrl key removes from selection multipleKey: "shiftKey", // shift key adds to selection box: false } ); </code></pre> <p>Activation: (Without this, the layers draw in correct order)</p> <pre><code>map.addControl(selectctrl); selectctrl.activate(); </code></pre> <p>Edit: Found this in OpenLayers.Handler.Feature, where the "moveLayerToTop" feels like the culprit... Will try to overcome it, but if someone knows it to be impossible, please let me know! </p> <pre><code>/** * Method: activate * Turn on the handler. Returns false if the handler was already active. * * Returns: * {Boolean} */ activate: function() { var activated = false; if(OpenLayers.Handler.prototype.activate.apply(this, arguments)) { this.moveLayerToTop(); this.map.events.on({ "removelayer": this.handleMapEvents, "changelayer": this.handleMapEvents, scope: this }); activated = true; } return activated; }, </code></pre>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload