radzenhq / radzen-blazor

Radzen Blazor is a set of 90+ free native Blazor UI components packed with DataGrid, Scheduler, Charts and robust theming including Material design and FluentUI.
https://www.radzen.com
MIT License
3.52k stars 785 forks source link

Feature Request: Create event for LegendClick in Charts #483

Closed paulo-rico closed 2 years ago

paulo-rico commented 2 years ago

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

paulo-rico commented 2 years ago

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 2 years ago

Forked, cloned and pushed my updates.