Change z-index of marker in openlayers

Question

I've a layer with multiple markers with rather big icons, so they overlap. Via the list on the side of the map users can select a marker and the map will pan (and zoom) to it. But it will still be behind some other makers. How do I get a individual makers z-index and set it? I would be useful to get the highest used z-index and just add one. (another solution is to add the total number of markers to the z-index)

The markers (or features) are in a myLib.features array. The console doesn't show any z-index type functions.

I can't find a appropriate example or api function for this.

EDIT:

I found this example: http://dev.openlayers.org/examples/ordering.html I don't really understand it. Somehow the created feature takes the next z-index given by the layer via somekind of symbolizer. I have no idea how to work this static sort into a dynamic one.

Answer 1

Try this:

First of all, make sure you are using a OpenLayers.Layer.Vector layer, not a OpenLayers.Layer.Markers layer. Apparently the Markers layer is old news and all new development is done in the Vector layer. It has more features. (I wasted a pile of time with the Markers layer myself).

Then, each of your markers needs to be a OpenLayers.Feature.Vector object. The constructor takes three arguments, the third of which is called the style. The style is where you set your image attributes, the background shadow, the mouse-over text, and the z-index, which has the property name "graphicZIndex". I think that's what you're looking for.

http://dev.openlayers.org/releases/OpenLayers-2.12/doc/apidocs/files/OpenLayers/Feature/Vector-js.html#OpenLayers.Feature.Vector.OpenLayers.Feature.Vector.style

Add your "markers" (which are Vector's) to your Vector layer with the addFeatures function. And just ignore the "options" argument.

http://dev.openlayers.org/releases/OpenLayers-2.12/doc/apidocs/files/OpenLayers/Layer/Vector-js.html#OpenLayers.Layer.Vector.addFeatures

I found that example page too, and I found it confusing too. It was setting all the markers' styles in the Vector layer's constructor (as default values to be used if the marker style was omitted) instead of the marker's constructor. I think it makes more sense to set the marker style in the marker constructor.

To change the style in real-time, take one of your OpenLayers.Feature.Vector markers, called "marker" and do this. And let's call the Vector Layer "layer".

marker.style.graphicZIndex = 13;
layer.redraw();