plotly.js
plotly.js copied to clipboard
plotly
Proposal: image layer above grid lines and below traces
Currently images and shapes support a layer property to control whether objects are rendered 'above' the traces in the figure or 'below'. As shown in the following example, the 'below' mode also places the images/shapes below the grid lines.
CodePen: https://codepen.io/jonmmease/pen/EqbLej
I find the the gridlines a bit distracting when placed on top of the image, and I would like to propose a third 'layer' option, 'between', that would place images/shapes above the gridlines and below the traces.
Do you think this would this require adding a new layer to the svg plot? or could the shapes/image be added to the layer the gird is currently drawn on?
Yep, I like the idea of adding a third layer value (that's why we added this attribute as an enumerated as opposed to a boolean).
Now, I would prefer something more precise than 'between'. Maybe 'above grid' would be better? In other words, above means "above everything', below means "below everything" and upcoming layer values will be named as either "above something" or "below something"`. What do you think?
Do you think this would this require adding a new layer to the svg plot?
Yes, most likely we'll need that in order to get showgrid and images[i].visible relayout calls to work correctly.
Come to think of it, maybe adding layer: 'below traces' would be even better for your use case?
Yeah, I like that naming approach. layer: 'below traces' is probably the best name/meaning for what I'm interested in.
@jonmmease is this still relevant in an
imagetrace-type world?
Hi. I don't understand the above and want to have my shapes between my grids and traces. How do I go about this? Thanks in advance.
@gemmavnash if you can post at https://community.plotly.com/ describing what you're trying to do, we'll try to help you :)
This is still relevant in the case of shapes, however, as pointed out in https://community.plotly.com/t/show-shapes-below-traces-and-above-grid/38629/3
Hi, I'm struggling with the same issue - the shape with layer below is overlayed by the grid. I have found a workaround (which is not perfect, but better than nothing).
I'm setting both xaxis.gridcolor and yaxis.gridcolor to rgba(0, 0, 0, 0.07). This is the same as the default #eee if you have a white background, but will not overlay/hide the shape line that is below the grid. It will just slightly darken it.
Hope this will help someone. Still, it would be helpful to be able to define above grid/below trace layer for the shapes.
+1 For this proposal. I am also working with a (line) shape that should appear below traces but above the grid.
Any follow up on this proposal? Or has anyone found a work-around for shapes?
Hi! Is there any solution yet for this issue? I love plotly and its great utility but i find it hard to believe that such a basic and essential task like this can't be achieved.
