表事件
本文解释了《Blazor》的Telerik Chart的可用事件:
OnSeriesClick
的OnSeriesClick事件触发，作为对用户单击< ChartSeries >．
下面你可以找到:
事件参数
事件处理程序接收ChartSeriesClickEventArgs对象，该对象提供以下数据:
DataItem-提供当前系列项目的数据模型。您需要将其转换为来自数据源的类型，这需要是可序列化的。- 如果您正在使用时间轴,
DataItem将只包含相应的y值字段中的聚合值，因为它是多个项的集合。看到类别详情如下。
- 如果您正在使用时间轴,
类别-提供有关数据点所在类别的信息。例如，您需要将其强制转换为数据源中的类型DateTime，字符串，int或者另一种类型。“分类”参数适用于分类图．- 当使用时间轴，你可以用它，连同
BaseUnit值，以便在希望提供有关它们的额外信息的情况下，过滤数据源并从数据源获取实际数据项。
- 当使用时间轴，你可以用它，连同
SeriesIndex的索引< ChartSeries >数据点属于。SeriesName的Name参数绑定< ChartSeries >数据点属于。SeriesColor-显示数据点所属系列的RGB颜色。CategoryIndex-显示数据点的x轴类别的索引。
例子
的不同应用程序OnSeriesClick事件。
基本点击处理程序
@*获取用户点击的类别。*@ 单击from: @logger @code {public List获取点击系列的数据模型
@*根据用户点击的系列接收数据模型*@ @if (! string . isnullorempty (logger)) { @logger } @code {string logger = string . empty;void OnSeriesClickHandler(ChartSeriesClickEventArgs args){//获取点击系列字符串项目的数据模型= (args. args)。数据项作为MyPieChartModel).SegmentName;MyPieChartModel数据模型= pieData。Where(x => x. segmentname == item).FirstOrDefault();日志记录器= $"从{数据模型。{datmodel . segmentvalue}";}公共类MyPieChartModel{公共字符串SegmentName {get; set; } public double SegmentValue { get; set; } } public List pieData = new List { new MyPieChartModel { SegmentName = "Product 1", SegmentValue = 2 }, new MyPieChartModel { SegmentName = "Product 2", SegmentValue = 3 }, new MyPieChartModel { SegmentName = "Product 3", SegmentValue = 4 } }; } 基于串联点击的按需负载数据
@*按需加载基于系列点击的数据*@ @if (GridData. any ()) { } @code {public List GridData {get;设置;} = new List();async任务OnSeriesClickHandler(ChartSeriesClickEventArgs args) {int clickdid = (args。数据项作为MyPieChartModel).SegmentId;GridData = await GenerateGridData(clickdid);} async Task> GenerateGridData(int id) {GridData = new List() {new MyGridModel() {id = id, ProductManager = $"Product manager {id}"， ProductLaunchDate = DateTime.Today.AddDays(-id)， isActive = id % 2 == 0 ?True: false}}; return await Task.FromResult(GridData); } public List pieData = new List { new MyPieChartModel { SegmentId = 1, SegmentName = "Product 1", SegmentValue = 2 }, new MyPieChartModel { SegmentId = 2, SegmentName = "Product 2", SegmentValue = 3 }, new MyPieChartModel { SegmentId = 3, SegmentName = "Product 3", SegmentValue = 4 } }; public class MyPieChartModel { public int SegmentId { get; set; } public string SegmentName { get; set; } public double SegmentValue { get; set; } } public class MyGridModel { public int Id { get; set; } public string ProductManager { get; set; } public DateTime ProductLaunchDate { get; set; } public bool isActive { get; set; } } }