Allow modification of position/direction and style of dash_table tooltips
Nobody has claimed this yet.
- Dominant language
- Python
- Stars
- 24.4k
- Forks
- 2.3k
- Avg merge
- 2d 7h
- Merged PRs (30d)
- 13
Description
Context
- The tooltip is always positioned under its corresponding cell, except in the last rows where it's positioned on top. This automatic behaviour cannot be modified.
- Right now it's only possible to modify the general style of all of the tooltips with the
cssargument ofdash_table.DataTable
Describe the solution you'd like
Add an argument similar to tooltip_position an a style key in tooltip_conditional, that could be used like:
dash_table.DataTable(
...,
tooltip_position='top',
tooltip_conditional= {
'if': {
'filter_query': '{Region} contains "New"'
},
'type': 'markdown',
'value': 'This row is significant.',
'style': {'background-color':'red', 'max-width':'100px'}
}
]
Describe alternatives you've considered
The tooltip is not a container per cell, but a general container that covers the whole table, and I guess somehow it gets the mouse position and calculates the appropriate position for the visible hover div (the position is specified in css with position: absolute and then top: XXXpx left: XXXpx)
I have explored solutions with the different tooltip properties of dash_table (https://dash.plotly.com/datatable/tooltips#conditional-tooltips) but there are no keys in the tooltip dict to specify the position/direction.
I've explored a workaround by including the table as the children of a dmc.Tooltip and modifying its position based on the hover info of the table, but it didn't work. I will open a feature request so that the Product Team takes this into account for future developments.
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
No implementation files or tests are named in the issue. Start at the dash_table.DataTable API and the conditional-tooltips documentation linked in the report; verify the requested position or direction and per-tooltip style inputs, then confirm conditional tooltips render with those settings.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- python
- Domain
- frontend
- Issue type
- Feature
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100