Show graph on tooltip hover (DataTable)

Dash Python
1

Hello,

I am looking to show a graph for each row in my DataTable, in my mind, at the end of each row is a cell that reads “show graph” and on hover a tooltip comes up with a rendered graph, is this possible? If not, is there a way to add graphs to a DataTable?

Thank you in advance!

2

Hi @fishmax

Currently, it’s not possible to have other components like a dcc.Graph included in a DataTable. Support for embedded Graphs in Table Cell · Issue #292 · plotly/dash-table · GitHub

Here are some workarounds:

Use a static image of the graph in a tooltip: -DataTable Tooltips | Dash for Python Documentation | Plotly

Sparklines: Sparklines as Fonts! Embedding Minimal Sparklines in Tables & Components - #6 by AnnMarieW

Dash Bootstrap Componets has an HTML table that can include other components. It’s possible to have Tooltips and Modals etc that have dcc.Graph as content . https://dash-bootstrap-components.opensource.faculty.ai/

3

Thank you for your quick reply!

I am a big fan of the callback/editable functionality of the data tables. I think perhaps the best solution will be to have a graph above/below the table that updates on row selection?

4

Yes, that’s possible! - see an example here: Sorting, Filtering, Selecting, and Paging Natively | Dash for Python Documentation | Plotly