JSAPI - how to add a graphic on top of another graphic in the same layer?

Question

I have a graphics layer and I'd like to add a graphic behind the existing graphics. I've come up with this:

graphicsLayer.add(overlay.graphic);
graphicsLayer.graphics.unshift(graphicsLayer.graphics.pop());

But I have to pan the markers off the screen and then pan them back into view before the 'unshift'-ed graphics display correctly. I've tried calling refresh without any affect:

graphicsLayer.refresh();

How can this be done without introducing a second graphics layer?

score 10 · Accepted Answer · answered Jun 15 '12 at 16:23

Graphics in a GraphicsLayer (as well as in a FeatureLayer) are dojx.gfx objects. Each Graphic has a getDojoShape method. This is the key to changing the drawing order of your graphics.

I put up a working example on jsfiddle: http://jsfiddle.net/fKwRn/

Click the map to add a point. The newest point is always added underneath the existing points.

score 3 · Answer 2 · answered Jun 14 '12 at 19:37

My goodness I hope this is not the correct "answer":

graphicsLayer.acme = {
    addFirst: function (graphic)
    {
        graphicsLayer.graphics.unshift(graphic);
        graphic._graphicsLayer = graphicsLayer;
        graphicsLayer._updateExtent(graphic);
        graphicsLayer.onGraphicAdd(graphic);
    },
    redraw: function ()
    {
        var graphics = dojo.filter(graphicsLayer.graphics, function (item)
        {
            return item.visible;
        });
        dojo.forEach(graphics, function (item)
        {
            graphicsLayer.remove ( item );
        });
        dojo.forEach(graphics, function (item)
        {
            graphicsLayer.add(item);
        });
    }
};

I introduced an addFirst method to add the graphic to the front of the graphics array and a redraw method to remove all visible graphics from the layer and add them back to the layer. That can't be good.

This not recommended. Please stick to the public, documented methods. My answer explains how to add a graphic underneath/behind existing graphics. — Derek Swingley, Jun 15 '12 at 16:25

JSAPI - how to add a graphic on top of another graphic in the same layer?

2 Answers2