Updatemenus with two methods


I’m trying to use updatemenus (in plotly.js) on a heatmap, and on click of button change trace and annotations.
I don’t know how to do it with same buttons, because the action of change traces (and title) is possible with method ‘update’, and the action of change annotations need method ‘restyle’; but I can’t use two different methods with same button.

In first Codepen (https://codepen.io/7iacura/pen/BEEgEG) I build a simple heatmap and with buttons (tab1 and tab2) i can change betweeen the two traces (you can see the color change)

In second Codepen (https://codepen.io/7iacura/pen/OGGKMd) I build the same heatmap and with buttons (tab1 and tab2) i can change betweeen the annotations of two traces.

Both Codepen have same source code, the only difference id the ‘visible’ flag in buttons. In first visible are buttons with update method, in second buttons with relayout method.

I need to click on button and change traces and annotations, not with differente buttons.

Someone have any suggestion?

You should be able to combine to the two methods into one Plotly.update call.

See https://plot.ly/javascript/plotlyjs-function-reference/#plotlyupdate for more info

Mmmm, but I don’t use any Plotly call, only newPlot to render the first time.
After I use only the updatemenu buttons.

So isn’t possible to do it?

See https://plot.ly/javascript/custom-buttons/#update-button

HThanks for the link, but I already use the instructions from that link, and I don’t found a solution for my problem.
Can you help editing one of my demo linked before?
In first I use update menu to change trace in heatmap, in second to change annotations. I can’t do both changes with the same button.

Sorry, i didn’t understand.
Now i solved the problem, here the solution https://codepen.io/7iacura/pen/OGGKMd

1 Like