This is a migrated thread and some comments may be shown as answers.

ChartView Legend Item Click Event?

5 Answers 602 Views
ChartView
This is a migrated thread and some comments may be shown as answers.
Kyle
Top achievements
Rank 1
Kyle asked on 08 Dec 2017, 05:22 PM
Is there an event for clicking a Legend Item

5 Answers, 1 is accepted

Sort by
0
Kyle
Top achievements
Rank 1
answered on 08 Dec 2017, 05:26 PM

I have a bar chart in the attached image.

Does an event exist so that I can click an item in the legend and get the name of the series for that item? For example, if I were to click "Test" next to the little blue square or the blue square itself, I would want to set a variable to "Test", but I can't find what event needs to be attached from the documentation.

0
Kyle
Top achievements
Rank 1
answered on 08 Dec 2017, 05:26 PM
Here is the image, not sure why it didn't get included in my last post.
0
Kyle
Top achievements
Rank 1
answered on 08 Dec 2017, 06:28 PM

Ok, so I managed to come up with a solution through trial and error, but I feel like this is unintuitive and there should be an easier way to go about doing this.

private void InitializeChart()
{
    chartView.ChartElement.LegendElement.VisualItemCreating += LegendElement_VisualItemCreating;
}
private void LegendElement_VisualItemCreating(object sender, LegendItemElementCreatingEventArgs e)
{
    e.ItemElement = new LegendItemElement(e.LegendItem);
    e.ItemElement.MarkerElement.Click += MarkerElement_Click;
    e.ItemElement.TitleElement.Click += TitleElement_Click;
}
 
private void TitleElement_Click(object sender, EventArgs e)
{
    var title = sender as LegendItemTitle;
    var itemElement = title.Parent as LegendItemElement;
    var legendItem = itemElement.LegendItem as LegendItem;
    var series = legendItem.Element as BarSeries;
    Console.WriteLine(series.Name);
}
 
private void MarkerElement_Click(object sender, EventArgs e)
{
    var marker = sender as LegendItemMarker;
    var itemElement = marker.Parent as LegendItemElement;
    var legendItem = itemElement.LegendItem as LegendItem;
    var series = legendItem.Element as BarSeries;
    Console.WriteLine(series.Name);
}
0
Accepted
Hristo
Telerik team
answered on 11 Dec 2017, 02:45 PM
Hello Kyle,

Thank you for writing.

The legend items are created dynamically for each of the series. The approach you have already found is valid to achieve the desired result. Alternatively, once you add the data to the chart you can access the legend items and then attach the Click event to the marker and title element: 
protected override void OnShown(EventArgs e)
{
    base.OnShown(e);
 
    var legends = this.radChartView1.ChartElement.GetDescendants(delegate (RadElement x) { return x is LegendItemElement; }, Telerik.WinControls.TreeTraversalMode.BreadthFirst);
    foreach (LegendItemElement legendItem in legends)
    {
        legendItem.TitleElement.Click += TitleElement_Click;
        legendItem.MarkerElement.Click += MarkerElement_Click;
    }
}

I hope this helps. Please let me know if you have other questions.

Regards,
Hristo
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Kyle
Top achievements
Rank 1
answered on 11 Dec 2017, 02:50 PM
Thanks Hristo, I prefer your solution, its more straightforward than the one I came up with.
Tags
ChartView
Asked by
Kyle
Top achievements
Rank 1
Answers by
Kyle
Top achievements
Rank 1
Hristo
Telerik team
Share this question
or