acciolurker
acciolurker

Reputation: 521

Plotly: Hide the hoverlabel while retaining hoverData in callback

Is there a way to hide the hoverlabel in a plotly figure while retaining the hoverData in a Dash callback?

I've looked everywhere, most closely related here, but nothing seems to work. The hoverinfo parameter isn't a valid parameter in update_layout, nor is hovertemplate. Here's my closest attempt that hides the hoverlabel but then unfortunately doesn't allow for the hoverData callback.

import plotly.express as px
from PIL import Image
import numpy as np

ss_rgb = np.array(Image.open('test.png'))

fig = px.imshow(ss_rgb)

fig.update_xaxes(visible=False)
fig.update_yaxes(visible=False)
fig.update_layout(
     dragmode=False,
    hovermode=False,
    #hoverinfo='none', # invalid parameter
    #hovertemplate=False # invalid parameter
)

Upvotes: 1

Views: 916

Answers (1)

bas
bas

Reputation: 15722

The plotly forum post you linked has the answer. The problem with what you've tried is that hoverinfo and hovertemplate are not valid properties to set with fig.update_layout. They can however be set with fig.update_traces:

fig.update_traces(hoverinfo='none', hovertemplate=None)

Complete reproducible example:

import json
import plotly.express as px
from dash import Dash
import dash_core_components as dcc
import dash_html_components as html
from dash.dependencies import Output, Input


df = px.data.gapminder().query("country=='Canada'")
fig = px.line(df, x="year", y="lifeExp", title="Life expectancy in Canada")

fig.update_xaxes(visible=False)
fig.update_yaxes(visible=False)
fig.update_traces(hoverinfo="none", hovertemplate=None)

app = Dash(__name__)
app.layout = html.Div([dcc.Graph(id="graph", figure=fig), html.Div(id="output")])


@app.callback(Output("output", "children"), Input("graph", "hoverData"))
def display_hover_data(hoverData):
    return json.dumps(hoverData, indent=2)


if __name__ == "__main__":
    app.run_server()

no-label

Upvotes: 2

Related Questions