toolTip in radzenChart

Radzen.Blazor Components
1

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!

      <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
grafico729×218 20.1 KB

2

I think you need to use the shared tooltip.

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

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

3

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?

4

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

5

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
captura grafico1125×343 22.9 KB

6

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.

7

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

8

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.