Area plot: hovermode to show y value of area?

đź“Š Plotly Python
1

In a stacked area plot, is there a way to get mouse hover to show the value of the corresponding area?

hovermode=“closest” does not work: in the lower half of each area, it shows the value below the mouse position, and this corresponds to a different area. My expected behavior for an area plot, i.e. showing the area the mouse is hovering over, is equivalent to showing the y value higher than the mouse position at all times.

2

Hi @agplot,

I’m not sure I fully understand what you’re looking for, but you could try setting a stackgroup parameter:

import plotly.graph_objs as go

trace1 = go.Scatter(
    x=[1, 2, 3, 4],
    y=[0, 2, 3, 5],
    fill='tozeroy',
    stackgroup='A'
)
trace2 = go.Scatter(
    x=[1, 2, 3, 4],
    y=[3, 5, 7, 7],
    fill='tonexty',     
    stackgroup='A'
)

data = [trace1, trace2]
fig = go.FigureWidget(data)

12%20AM
Screen Shot 2018-11-01 at 5.36.12 AM.png1700Ă—702 38.8 KB

In this case the hover tooltips display the height of each colored region.

-Jon

3

Hi @jmmease, thanks for your response. hovermode="x" does produce this behavior. However, I am wondering if it is possible to see only the area under the mouse. This would be like hovermode="closest", except in a stacked area plot to show the y value corresponding to the area under the mouse.

4

Hi @agplot
No, I don’t think that’s possible.
-Jon

5

I’m just getting started with Plotly (and Dash) and am interested in this as well.

I want to have custom on-click behavior based on whether the user clicks the orange or blue region. Is this possible?

Eg, have a line of text appear below the screen that shows “You clicked Orange” or “You clicked Blue”.