dash-canvas
dash-canvas copied to clipboard
Implement plotly backend or new Class wrapping plotly
Since plotly.js will soon have drawing capabilities we should implement either a new Canvas class with a high-level API for a plotly.js figure + annotations, or reuse the existing DashCanvas class with a plotly backend.
What can be done out of the box with plotly.js + dcc.Graph
- define a figure with a given image either as layout image, or trace, and parameters for the
newshapelayout attribute as well asdragmode(which can be changed from the modebar) define adcc.Storeto store the geometry of annotations and update it with a callback listening torelayoutData`- modify
newshapeparameters with other Dash components such as slider etc. However doing this will require to replot the whole figure. This problem can be mitigated by using clientside callbacks.
What we can do on top on dcc.Graph:
- add a
dcc.Storeto save the geometry of annotations, which will be updated onrelayout(this could also be part of a Python "combination class" with an internal callback but probably better to implement everything in JS). This store should we read and write, ie it should be possible to load annotations programmatically. The structure of this object would be a list of objects, ie using the same syntax as plotly. - have another
dcc.Storewhere to store newshape parameters, which could trigger relayout events for the figure without replotting the whole figure. Same syntax as plotly. - have an image parameter which can be an array in the case where the figure attribute is not given, then it is built automatically
Other thoughts:
- hiding buttons from the modebar can be done in the
configattribute - future directions: add slider to slice through 3D volume, interaction with datashader.