# Hover template text in a bar graph

**URL:** <https://community.plotly.com/t/hover-template-text-in-a-bar-graph/78085>\
**Category:** 📊 Plotly Python\
**Tags:** question\
**Created:** [August 27, 2023, 12:51pm UTC](https://community.plotly.com/t/hover-template-text-in-a-bar-graph/78085 "2023-08-27T12:51:04Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![Jacques](https://avatars.discourse-cdn.com/v4/letter/j/71e660/32.png) [@Jacques](https://community.plotly.com/u/Jacques)\
**Post date:** [August 27, 2023, 12:51pm UTC](https://community.plotly.com/t/hover-template-text-in-a-bar-graph/78085/1 "2023-08-27T12:51:04Z")

</div>

I suppose my question is very easy but can’t get the answer.

i have df that looks like that:

```auto
               Value Growth Monétaire
2021-01-01 60. 10. 30
2021-02-01 55. 5. 40
2021-03-01 60. 10. 30
2021-04-01 60. 10. 30

```

I would like to make a plotly graph with bar representing each column in a bar.  
I did:

```auto
    fig = go.Figure(
        [go.Bar(
            name=col,
            x=style.index,
            y=style[col],
            hovertemplate='<br>'.join(['Classe : %{label}',
                                       'Date: %{x}',
                                       'Poids: %{y:.1f}%',
                                       '<extra></extra>'
                                       ])
            ) 
         for col in style.columns]
        )
    fig.update_layout(showlegend=True,
                      yaxis=dict(range=[0, 100],
                                 ticksuffix='%'),
                      barmode='stack'
                      )
    fig.update_xaxes(dtick="M3",
                     tickformat="%b\n%Y", 
                     )

```

But I would like the hover template to be for example:  
classe : Value  
Date: Aug 2021  
Poids: 60

I can’t get the “classe” in the hover template ie “Value”, “growth” or “Monétaire”

 ![Capture d’écran 2023-08-27 à 14.51.55](https://us1.discourse-cdn.com/flex024/uploads/plot/original/3X/e/7/e7aec42f2096569cce80e6612eb60dea270b2971.png)

---

<div class="post-metadata">

**Author:** ![jhupiterz](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/jhupiterz/32/19435_2.png) [@jhupiterz](https://community.plotly.com/u/jhupiterz)\
**Post date:** [August 30, 2023, 10:10pm UTC](https://community.plotly.com/t/hover-template-text-in-a-bar-graph/78085/2 "2023-08-30T22:10:42Z")

</div>

Hi @Jacques, `hovertemplate` only has access to `x` and `y` and no other data. If you wish to add other data in your hovertemplate you need to define a `customdata` first, then you’ll be able to call `customdata` inside your `hovertemplate` ([full doc here](https://plotly.com/python/hover-text-and-formatting/#adding-other-data-to-the-hover-with-customdata-and-a-hovertemplate)).

See your modified code below:

```auto
fig = go.Figure(
        [go.Bar(
            name=col,
            x=df.index,
            y=df[col],
            customdata=[col,col, col, col],
            hovertemplate='<br>'.join(['Classe : %{customdata}',
                                       'Date: %{x}',
                                       'Poids: %{y:.1f}%',
                                       '<extra></extra>'
                                       ])
            ) 
         for col in df.columns]
        )
fig.update_layout(showlegend=True,
                    yaxis=dict(range=[0, 100],
                                ticksuffix='%'),
                    barmode='stack'
                    )
fig.update_xaxes(dtick="M3",
                     tickformat="%b\n%Y", 
                     )

```
