Hovering plotly

Question

I am plotting a 3D scatter plot:

d = {'x':[1,2,3,4], 'y':[2,3,1,5], 'z':[3,2,3,2], 't':[4,1,2,3], 'score':[2,3,1,2]}
df = pd.DataFrame (d)

xtitle = 'x'
ytitle = 'y'
ztitle = 'z'

trace1 = go.Scatter3d(x=df[xtitle], 
                        y= df[ytitle], 
                          z = df[ztitle],
                                       marker=dict(color=df['score'],
                                                   showscale=True,
                                                  colorbar=dict(
                                                    title='score)'
                                                )),                       
                                       mode='markers')

layout = go.Layout (
        scene = Scene(
            xaxis = dict (title = xtitle),
            yaxis = dict (title = ytitle),
            zaxis = dict (title = ztitle)
        )
    )
fig = go.Figure(data=[trace1], layout = layout)
plotly.offline.iplot(fig)

When I hover the mouse over a point, it will show x, y and z values.

In the dataframe df I have another column called t, and I want that when I hover the mouse over a point it will show x,y,z,t and score as well.

How can I do that?

Answer 1

This one works fien and its insanely easy, I will give you some extra examples if you want to add more data to the hover:

import plotly.graph_objs as go
from plotly.offline import download_plotlyjs, init_notebook_mode, plot, iplot
init_notebook_mode(connected=True)
import pandas as pd
d = {'x':[1,2,3,4], 'y':[2,3,1,5], 'z':[3,2,3,2], 't':[4,1,2,3],'t2':[6,8,5,9], 'score':[2,3,1,2]}
df = pd.DataFrame (d)

xtitle = 'x'
ytitle = 'y'
ztitle = 'z'

trace1 = go.Scatter3d(
    x=df[xtitle], 
    y= df[ytitle], 
    z = df[ztitle],
    marker=dict(
        color=df['score'],
        showscale=True,
        colorbar=dict(title='score)')
    ),
    mode='markers',
    hoverinfo = 'Text t: ' + df['t']  # Display for 't' + content in df
                + '<br>' +  # Intro space
                'Text t2: ' + df['t2']  # Text to display for 't'

)


layout = go.Layout (
        scene = dict(
            xaxis = dict (title = xtitle),
            yaxis = dict (title = ytitle),
            zaxis = dict (title = ztitle)
        )
    )
fig = go.Figure(data=[trace1], layout = layout)
plotly.offline.iplot(fig)

IMPORTANT: If your graph is a figure with traces: You should use 'hovertext' instead of 'hoverinfo'

fig = go.Figure(layout=layout)  
fig.add_trace(go.Bar(
        x=df[xtitle], 
        y= df[ytitle], 
        z = df[ztitle],
        marker=dict(
            color=df['score'],
            showscale=True,
            colorbar=dict(title='score)')
        ),
        mode='markers',
        hovertext = 'Text t: ' + df['t']  # Display for 't' + content in df
                    + '<br>' +  # Intro space
                    'Text t2: ' + df['t2']  # Text to display for 't'
  
    )

Answer 2

Use hoverinfo argument.

trace1 = go.Scatter3d(x = df['x'], 
                      y = df['y'], 
                      z = df['z'],
                      text = ['t: %d<br>Score: %d'%(t,s) for t,s in df.loc[:,['t','score']].values],
                      hoverinfo = 'text',
                      marker=dict(color=df['score'],
                                  showscale=True,
                                  colorbar=dict(title='score')
                                  ),                       
                      mode='markers')

Answer 3

You can use text or hoverinfo in your trace.

import plotly.graph_objs as go
from plotly.offline import download_plotlyjs, init_notebook_mode, plot, iplot
init_notebook_mode(connected=True)
import pandas as pd
d = {'x':[1,2,3,4], 'y':[2,3,1,5], 'z':[3,2,3,2], 't':[4,1,2,3], 'score':[2,3,1,2]}
df = pd.DataFrame (d)

xtitle = 'x'
ytitle = 'y'
ztitle = 'z'

trace1 = go.Scatter3d(
    x=df[xtitle], 
    y= df[ytitle], 
    z = df[ztitle],
    marker=dict(
        color=df['score'],
        showscale=True,
        colorbar=dict(title='score)')
    ),
    mode='markers',
    text = ["t: {}".format(x) for x in df['t'] ]  # <-- added line!
    # hoverinfo = df['t']  # alternative
)

layout = go.Layout (
        scene = dict(
            xaxis = dict (title = xtitle),
            yaxis = dict (title = ytitle),
            zaxis = dict (title = ztitle)
        )
    )
fig = go.Figure(data=[trace1], layout = layout)
iplot(fig)

helpful links: SO answer 0, SO answer 1, SO answer 2. You want to use the text attribute, hoverinfo and hovertext. Here is the documentation.