Announcing Dash Bio 1.0.0 🎉 : a one-stop-shop for bioinformatics and drug development visualizations.

Programmatically delete "drawRect" boxes from image on button click(Not from modeBar)

Hi, I wanted to see if there is a way to programmatically delete the “drawRect” boxes on button click and not from the modeBar. I am trying to create an app which stores image data after a rectangle is drawn but also wanted the functionality to delete the last box drawn over the image and the corresponding stored data. I am using relayoutData property of the graph to get box coordinates. Can someone guide how to proceed on this functionality.

Hi @Sauron welcome to the forum! You can change the shapes of a figure by modifying the figure property of a dcc.Graph, and you can store the list of shapes in a dcc.Store. Therefore you can have two callbacks

  • one with relayoutData as input, and the Store with the shape geometry as output
  • and another with your button n_clicks as input, the store as state, and the figure of the dcc.Graph as output.

We’re working on making this process even simpler by being able to pass the figure as State (no need for a Store) (https://github.com/plotly/dash-core-components/pull/905).

Thank you so much for your help!