# toolTip in radzenChart

**URL:** <https://forum.radzen.com/t/tooltip-in-radzenchart/20199>\
**Category:** Radzen.Blazor Components\
**Created:** [April 23, 2025, 4:12pm UTC](https://forum.radzen.com/t/tooltip-in-radzenchart/20199 "2025-04-23T16:12:53Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![Luar79](https://forum.radzen.com/letter_avatar_proxy/v4/letter/l/977dab/32.png) [@Luar79](https://forum.radzen.com/u/Luar79)\
**Post date:** [April 23, 2025, 4:12pm UTC](https://forum.radzen.com/t/tooltip-in-radzenchart/20199/1 "2025-04-23T16:12:53Z")

</div>

I want a RadzenChart to display the values for each year in a popup when hovering over the chart with the mouse. However, I haven’t been able to get this working in my RadzenChart. I'm attaching a screenshot of what I'm trying to achieve, as well as my code. I tried using `RadzenChartTooltipOptions` and the `TooltipTemplate` property while testing, but I'm not sure if those are actually necessary. I'm using version 5.9 of Radzen. Thank you very much in advance!

```auto
      <Blazorise.Column Class="px-0" ColumnSize="SizeColumn"
                  Style="margin-left: 10px;">
              
              <div style="width: 100%; overflow-x: auto;">
                        <div class="row" style="width:550px; height: 100%;">
                            <div class="col">
                                <RadzenChart >
                                      <RadzenChartTooltipOptions Visible="true" Shared="false" />
                             
                                    @if (listaVolumenesConsumidos != null)
                                    {
                                        <RadzenAreaSeries Smooth="false" Data="@listaVolumenesConsumidos" CategoryProperty="Año" Title="Volumen"
                                          ValueProperty="VolumenAño" RenderingOrder="1" TooltipTemplate="@((data) => (builder) =>{var texto = GetTooltipText(data);builder.AddContent(0, texto); })" />

                                   }
                                    @if (volumenMaxAnualAprovs!= null)
                                    {
                                      <RadzenLineSeries Smooth="true" Stroke="red" Data="@volumenMaxAnualAprovs" CategoryProperty="Año" Title="@lblVolMaxAprov" 
                                        ValueProperty="VolumenMaxAprov" RenderingOrder="2" TooltipTemplate="@((data) => (builder) => builder.AddContent(0, GetTooltipTextVolMax(data)))"/>

                                    }
                                    <RadzenCategoryAxis Step="1"/>
                                    <RadzenValueAxis FormatString="{0:N3}" />
                                </RadzenChart> 
                            </div>
                        </div>
                </div>
            </Blazorise.Column>
        </Blazorise.Row>

```

This is that I would want:

 ![grafico](https://forum.radzen.com/uploads/default/original/3X/5/5/55f628a98f81f3de064636917152be13bd13e051.png)

---

<div class="post-metadata">

**Author:** ![korchev](https://forum.radzen.com/user_avatar/forum.radzen.com/korchev/32/4_2.png) [@korchev](https://forum.radzen.com/u/korchev)\
**Post date:** [April 23, 2025, 4:16pm UTC](https://forum.radzen.com/t/tooltip-in-radzenchart/20199/2 "2025-04-23T16:16:16Z")

</div>

I think you need to use the [shared tooltip](https://blazor.radzen.com/line-chart).

```auto
   <RadzenChart>
        <RadzenChartTooltipOptions Shared="true" />

```

You probably need to upgrade to a newer version of Radzen.Blazor.

---

<div class="post-metadata">

**Author:** ![Luar79](https://forum.radzen.com/letter_avatar_proxy/v4/letter/l/977dab/32.png) [@Luar79](https://forum.radzen.com/u/Luar79)\
**Post date:** [April 23, 2025, 4:56pm UTC](https://forum.radzen.com/t/tooltip-in-radzenchart/20199/3 "2025-04-23T16:56:58Z")

</div>

> [@korchev](#):
>
> Radzen.Blazor.

Thank´s a lot! I tried with saherd=true in RadzenChartTooltipOptions, but it doesn´t work. So, its necessary 100% to upgrade to radzen.Blazor 6.x.x?

---

<div class="post-metadata">

**Author:** ![korchev](https://forum.radzen.com/user_avatar/forum.radzen.com/korchev/32/4_2.png) [@korchev](https://forum.radzen.com/u/korchev)\
**Post date:** [April 23, 2025, 6:37pm UTC](https://forum.radzen.com/t/tooltip-in-radzenchart/20199/4 "2025-04-23T18:37:53Z")

</div>

I think I mislead you. The shared tooltip displays values for all series however you seem to want something else.

---

<div class="post-metadata">

**Author:** ![Luar79](https://forum.radzen.com/letter_avatar_proxy/v4/letter/l/977dab/32.png) [@Luar79](https://forum.radzen.com/u/Luar79)\
**Post date:** [April 24, 2025, 8:27am UTC](https://forum.radzen.com/t/tooltip-in-radzenchart/20199/5 "2025-04-24T08:27:38Z")

</div>

Yes, I think its diferent that I need. I need the pop-up to be displayed with the values ​​for each year when hovering over the graph with the mouse cursor, like in this example below:

 ![captura grafico](https://forum.radzen.com/uploads/default/original/3X/3/0/30a252b654c3ae490f61fa4733a6ea68db157e82.png)

---

<div class="post-metadata">

**Author:** ![korchev](https://forum.radzen.com/user_avatar/forum.radzen.com/korchev/32/4_2.png) [@korchev](https://forum.radzen.com/u/korchev)\
**Post date:** [April 24, 2025, 8:38am UTC](https://forum.radzen.com/t/tooltip-in-radzenchart/20199/6 "2025-04-24T08:38:12Z")

</div>

This example will work if you enable the shared tooltip. Your initial screenshot shows something different though - years are just items in the category and don't have their own series.

---

<div class="post-metadata">

**Author:** ![Luar79](https://forum.radzen.com/letter_avatar_proxy/v4/letter/l/977dab/32.png) [@Luar79](https://forum.radzen.com/u/Luar79)\
**Post date:** [April 24, 2025, 1:13pm UTC](https://forum.radzen.com/t/tooltip-in-radzenchart/20199/7 "2025-04-24T13:13:15Z")

</div>

Yes, years is a property of the object passed to the RazdenAreaSeries. I think I'm misunderstanding. Where do you see the problem there?

---

<div class="post-metadata">

**Author:** ![korchev](https://forum.radzen.com/user_avatar/forum.radzen.com/korchev/32/4_2.png) [@korchev](https://forum.radzen.com/u/korchev)\
**Post date:** [April 24, 2025, 2:01pm UTC](https://forum.radzen.com/t/tooltip-in-radzenchart/20199/8 "2025-04-24T14:01:45Z")

</div>

I don't see a problem. Shared tooltips shows data from all series in the same tooltip. You seem to want something else that requires customizations. Using the TooltipTemplate is the way.

---

<div class="post-metadata">

**Author:** ![Luar79](https://forum.radzen.com/letter_avatar_proxy/v4/letter/l/977dab/32.png) [@Luar79](https://forum.radzen.com/u/Luar79)\
**Post date:** [April 25, 2025, 7:10am UTC](https://forum.radzen.com/t/tooltip-in-radzenchart/20199/9 "2025-04-25T07:10:57Z")

</div>

Okey @korchev, if you see that everything is ok, then I'm deducing that it could be because there is some style overriding the Radzen ones somewhere. I will do some tests. Thank you so much for the help!