Custom Data in Scatter Plot not showing

📊 Plotly Python
1

Hello,

I am having issues with adding custom data to the hover label. I was able to get it working with dummy data as shown below.
However, when plotting within the for loop the hover label says “continent=%{customdata}…”
I also try using other attributes within the Scatter Trace but getting the same behavior (i.e., not showing the data but showing the string as-is.

Any help would be appreciate it

Trial 1 - Dummy Data

fig3 = go.Figure(data = go.Scatter( x = [1,2,3],
                                    y = [2,15,12],
                                    customdata = ['Hola','Hello','Buenos Dias'],
                                    hovertemplate = '(%{x} , %{y} , <b>%{customdata}</b>') )

fig3.show()

Code not working (This is a GO approach to figPX = px.scatter(df_2007, x=“gdpPercap”, y=“lifeExp”, log_x=True, color=‘continent’)

import plotly.express as px
df_2007 = px.data.gapminder().query("year==2007")
df_2007.reset_index(inplace = True, drop = True)

#Create Dictionary for mapping colors
colorMapper = dict(Asia = px.colors.qualitative.Plotly[0],
                  Europe = px.colors.qualitative.Plotly[1],
                  Africa = px.colors.qualitative.Plotly[2],
                  Americas = px.colors.qualitative.Plotly[3],
                  Oceania = px.colors.qualitative.Plotly[4])
print(colorMapper)

df_2007['colorArray'] = df_2007['continent'].map(colorMapper)

fig_GO = go.Figure()  # Create empty figure

#Groupby each Continent
grp = df_2007.groupby('continent', sort = False)

#Iteration to plot each Continent 
for key in grp.groups.keys():
      
    fig_GO.add_trace(go.Scatter(
                                x = df_2007.loc[ grp.groups[key] , 'gdpPercap'],   #Indexing by label using Groupby indexes
                                y = df_2007.loc[ grp.groups[key] , 'lifeExp'],
                                mode = 'markers',
                                customdata = [14],   # I tried many things here: integer , string ,
                                                     # np.random.rand(len(df_2007.loc[ grp.groups[key]])) 
                                marker_color = df_2007.loc[ grp.groups[key] , 'colorArray'],
                                name = key,
                                hovertemplate = 'continent=%{customdata}<br>gdpPercap=%{x}<br>lifeExp=%{y}<extra></extra>'
                    ))

# Update Layout & Axes
fig_GO.update_layout(legend_title = 'continent' )
fig_GO.update_xaxes(type = 'log', title = 'gdpPercap' )
fig_GO.update_yaxes(title = 'lifeExp' )
fig_GO.show()
1 Like
2

@lorenpeve10
Try this, it should work!
fig_GO.add_trace(go.Scatter(
x = df_2007.loc[ grp.groups[key] , ‘gdpPercap’], #Indexing by label using Groupby indexes
y = df_2007.loc[ grp.groups[key] , ‘lifeExp’],
mode = ‘markers’,
text = [key for i in range(len(df_2007.loc[ grp.groups[key] , ‘gdpPercap’]))], # I tried many things here: integer , string ,
# np.random.rand(len(df_2007.loc[ grp.groups[key]]))
marker_color = df_2007.loc[ grp.groups[key] , ‘colorArray’],
name = key,
hovertemplate = 'continent=%{text}
gdpPercap=%{x}
lifeExp=%{y}'
))

3

Hello @alooksha !

Yes, it worked, thanks. I realized two things that were giving me a hard time, and leaving those out here in case anyone goes through this post:

  • customdata has to be an array-like of the same size of x and y. That is why my tries with [14] or [ ‘Trial String’] didnt work

  • I was having the incorrect format specifier in some of my trials. Correct format is

              * String %{customdata}

          * Number %{customdata: .2f}  # Where I wanted just two digits after decimal point
1 Like