ChartView Legend Item Click Event?

6 posts, 1 answers
  1. Kyle
    Kyle avatar
    8 posts
    Member since:
    Dec 2017

    Posted 08 Dec 2017 Link to this post

    Is there an event for clicking a Legend Item
  2. Kyle
    Kyle avatar
    8 posts
    Member since:
    Dec 2017

    Posted 08 Dec 2017 in reply to Kyle Link to this post

    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.

  3. Kyle
    Kyle avatar
    8 posts
    Member since:
    Dec 2017

    Posted 08 Dec 2017 in reply to Kyle Link to this post

    Here is the image, not sure why it didn't get included in my last post.
  4. Kyle
    Kyle avatar
    8 posts
    Member since:
    Dec 2017

    Posted 08 Dec 2017 in reply to Kyle Link to this post

    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);
    }
  5. Answer
    Hristo
    Admin
    Hristo avatar
    1126 posts

    Posted 11 Dec 2017 Link to this post

    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.
  6. Kyle
    Kyle avatar
    8 posts
    Member since:
    Dec 2017

    Posted 11 Dec 2017 in reply to Hristo Link to this post

    Thanks Hristo, I prefer your solution, its more straightforward than the one I came up with.
Back to Top