Black Lives Matter. Please consider donating to Black Girls Code today.

Dash DataTable - Tooltip example

Hi, was hoping someone could attach a short code example of the tooltip feature in Data Tables. I’m using Dash in Python.

I’ve tried this example: Dash DataTable - Tooltips, but “tooltips” is no longer in use, although I’m assuming it’s been replaced with “tooltip”.

I also read the docs and source code but still am struggling to get a tooltip visible. My code example:

tooltip={
    'property':'my_column_name',
    'value':'this is a test tooltip' 
}

I just hit the same issue. In your case try

tooltip={'my_column_name': {'type': 'text', 'value': 'Some text'}}

The tooltip appears on the cells below ‘my_column_name’. Here’s a complete example:

import dash, dash_table
import dash_html_components as html
import pandas as pd


df = pd.read_csv('https://raw.githubusercontent.com/plotly/datasets/master/solar.csv')
app = dash.Dash(__name__)

app.layout = html.Div([
    dash_table.DataTable(
        columns=[{'name': i, 'id': i} for i in df.columns],
        data=df.to_dict('records'),
        # tooltip={'State': {'type': 'text', 'value': 'SOMETHING', 'delay': 0, 'duration': 3000}}
        tooltip={'State': {'type': 'text', 'value': 'Some text'}}
    )
])

if __name__ == '__main__':
    app.run_server(debug=True)

If you are after a tooltip ONLY on the column header (as was my case), looks like it’s not currently implemented but is on the radar https://community.plotly.com/t/showing-a-hover-tooltip-for-data-table-header/38942 . Cheers.