Feature Request: Create event for LegendClick in Charts #433

New Issue

claunia · 2026-01-29T17:37:15Z

claunia commented

2026-01-29 17:37:15 +00:00

Originally created by @paulo-rico on GitHub (Jun 10, 2022).

Same as when a chart area has been clicked and raises a SeriesClick event, could we also have same event raised when Legend is clicked?

TIA

Paul

Originally created by @paulo-rico on GitHub (Jun 10, 2022). Same as when a chart area has been clicked and raises a SeriesClick event, could we also have same event raised when Legend is clicked? TIA Paul

claunia closed this issue

2026-01-29 17:37:15 +00:00

claunia commented

2026-01-29 17:37:15 +00:00

@paulo-rico commented on GitHub (Jun 10, 2022):

Hi all
I created this issue after trying to sort it myself, but initially failed. After a eureka moment, I eventually arrived at a solution.

Below is the code I have in a partial file that addresses my issue.

`using Microsoft.AspNetCore.Components;
using Radzen.Blazor.Rendering;
using System.Threading.Tasks;

namespace Radzen.Blazor
{
  /// <summary>
  /// Renders donut series in <see cref="RadzenChart" />.
  /// </summary>
  /// <typeparam name="TItem">The type of the series data item.</typeparam>
  public partial class RadzenDonutSeries<TItem> : RadzenPieSeries<TItem>, IChartDonutSeries
  {
    /// <summary>
    /// A callback that will be invoked when the user clicks on a legend item. 
    /// </summary>
    [Parameter]
    public EventCallback<SeriesClickEventArgs> LegendClick { get; set; }
    /// <inheritdoc/>
    public override RenderFragment RenderLegendItem()
    {
      return builder =>
      {
        foreach (var data in Items)
        {
          builder.OpenComponent<LegendItem>(0);
          builder.AddAttribute(1, nameof(LegendItem.Text), TooltipTitle(data));
          builder.AddAttribute(2, nameof(LegendItem.Class), $"rz-series-item-{Items.IndexOf(data)}");
          builder.AddAttribute(3, nameof(LegendItem.MarkerSize), MarkerSize);
          builder.AddAttribute(4, nameof(LegendItem.MarkerType), MarkerType);
          builder.AddAttribute(5, nameof(LegendItem.Color), PickColor(Items.IndexOf(data), Fills));
          builder.AddAttribute(6, nameof(LegendItem.Click), EventCallback.Factory.Create(this, () => OnLegendItemClick(data)));
          builder.CloseComponent();
        };
      };
    }
    /// <inheritdoc />
    private async Task OnLegendItemClick(object data)
    {
      if(LegendClick.HasDelegate)
      {
        await InvokeLegendClick(LegendClick, data);
      }
    }

    /// <inheritdoc />
    public async Task InvokeLegendClick(EventCallback<SeriesClickEventArgs> handler, object data)
    {
      var category = Category(Chart.CategoryScale);

      await handler.InvokeAsync(new SeriesClickEventArgs
      {
        Data = data,
        Title = GetTitle(),
        Category = PropertyAccess.GetValue(data, CategoryProperty),
        Value = PropertyAccess.GetValue(data, ValueProperty),
        Point = new SeriesPoint
        {
          Category = category((TItem)data),
          Value = Value((TItem)data)
        }
      });
    }
  }
}
`

I am not too familiar with git and not sure how to pull/branch/push and would not like to do so if it would cause problems.

The above code is at the DonutSeries level. Not sure if it should be further up the tree.

I am using Radzen components regularly and would like to contribute if possible. If anyone can point me in the right direction for doing so, that would be really much appreciated.

Many thanks in advance,

Paul

@paulo-rico commented on GitHub (Jun 10, 2022): Hi all I created this issue after trying to sort it myself, but initially failed. After a eureka moment, I eventually arrived at a solution. Below is the code I have in a partial file that addresses my issue. ``` `using Microsoft.AspNetCore.Components; using Radzen.Blazor.Rendering; using System.Threading.Tasks; namespace Radzen.Blazor { /// <summary> /// Renders donut series in <see cref="RadzenChart" />. /// </summary> /// <typeparam name="TItem">The type of the series data item.</typeparam> public partial class RadzenDonutSeries<TItem> : RadzenPieSeries<TItem>, IChartDonutSeries { /// <summary> /// A callback that will be invoked when the user clicks on a legend item. /// </summary> [Parameter] public EventCallback<SeriesClickEventArgs> LegendClick { get; set; } /// <inheritdoc/> public override RenderFragment RenderLegendItem() { return builder => { foreach (var data in Items) { builder.OpenComponent<LegendItem>(0); builder.AddAttribute(1, nameof(LegendItem.Text), TooltipTitle(data)); builder.AddAttribute(2, nameof(LegendItem.Class), $"rz-series-item-{Items.IndexOf(data)}"); builder.AddAttribute(3, nameof(LegendItem.MarkerSize), MarkerSize); builder.AddAttribute(4, nameof(LegendItem.MarkerType), MarkerType); builder.AddAttribute(5, nameof(LegendItem.Color), PickColor(Items.IndexOf(data), Fills)); builder.AddAttribute(6, nameof(LegendItem.Click), EventCallback.Factory.Create(this, () => OnLegendItemClick(data))); builder.CloseComponent(); }; }; } /// <inheritdoc /> private async Task OnLegendItemClick(object data) { if(LegendClick.HasDelegate) { await InvokeLegendClick(LegendClick, data); } } /// <inheritdoc /> public async Task InvokeLegendClick(EventCallback<SeriesClickEventArgs> handler, object data) { var category = Category(Chart.CategoryScale); await handler.InvokeAsync(new SeriesClickEventArgs { Data = data, Title = GetTitle(), Category = PropertyAccess.GetValue(data, CategoryProperty), Value = PropertyAccess.GetValue(data, ValueProperty), Point = new SeriesPoint { Category = category((TItem)data), Value = Value((TItem)data) } }); } } } ` ``` I am not too familiar with git and not sure how to pull/branch/push and would not like to do so if it would cause problems. The above code is at the DonutSeries level. Not sure if it should be further up the tree. I am using Radzen components regularly and would like to contribute if possible. If anyone can point me in the right direction for doing so, that would be really much appreciated. Many thanks in advance, Paul

claunia commented

2026-01-29 17:37:15 +00:00

@paulo-rico commented on GitHub (Jun 11, 2022):

Forked, cloned and pushed my updates.

@paulo-rico commented on GitHub (Jun 11, 2022): Forked, cloned and pushed my updates.

Sign in to join this conversation.

Branches Tags

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: starred/radzen-blazor#433