How to fake changing z-index for scattergl plot points with animate

plotly.js
1

I know that it’s not possible to change the z-index, but I thought that changing the order of the ids and animating would put the last points on top.

As you can see here, I’m trying to change the order of the IDS and calling plotly.Animate with the new ID order…doesn’t seem to do the trick.

Any suggestions?

@etienne

2

You can try our new sort transform e.g. https://codepen.io/etpinard/pen/ZKqEpp?editors=0010

It’s fresh off the 1.27.0 release, so we don’t have any docs for it yet. You can look up https://github.com/plotly/plotly.js/pull/1609 for some info.

Hope this helps.

3

Thanks @etienne, I see how to order by ‘ascending’ or ‘descending’ but what about the example I’m trying to do (pushing the clicked point to the end of the array).

What if I want to specify the order of the array ?

What other sort types are there?

You mention it in the github PR for the transform, but I’m not seeing the clicked point’s id being console logged…just the ids array in the data object.

4

Here’s my attempt: https://codepen.io/etpinard/pen/ZKqEpp?editors=0010

I’ll be honest it’s not great. We should probably add another event data field to make this easier. For example, something like originalPointNumber which would be the point number in gd.data as opposed to pointNumber which currently shows the point number of gd._fullData.

5

Thanks @etienne for that example.

So what about the id? I’m not seeing the individual id value when I click a point…like you mentioned in the comments to that PR and I remember seeing at Plotcon when you showed an example

6

Right, the points’ id aren’t part of the event data the same way x and y. You’ll have to dig into fullData.ids to find them unfortunately. Expect that to change (for the better ;)) in a future release