RadCartesianBarChart show series when click on legend

12 posts, 2 answers
  1. Arun
    Arun avatar
    10 posts
    Member since:
    Nov 2015

    Posted 03 Dec 2015 Link to this post

    Hi,

    I am using radcartesianbarchart to show multiple bar series. For example if i have category1, category2, and total these are the series collection.

    If i click on legent of category1, need to show the category1 series. same for category2. If i click on total it should show all series. How we can achieve this.

    Using hover property we can show fadeout of other series. But i need to draw when click on the legend only. Also please advise how to do animation for the chart series.

    Thanks,

    Arun

  2. Ivan
    Admin
    Ivan avatar
    44 posts

    Posted 04 Dec 2015 Link to this post

    Hello Arun,

    You can take a look at the Live Data demo. Note that the example is in Silverlight but it share its code with the WPF version.

    Is this going to suit your needs?

    Regards,
    Ivan
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  3. UI for WPF is Visual Studio 2017 Ready
  4. Arun
    Arun avatar
    10 posts
    Member since:
    Nov 2015

    Posted 05 Jan Link to this post

    Hi,

     Can you specify the example project name, so that i can identify it.

  5. Ivan
    Admin
    Ivan avatar
    44 posts

    Posted 06 Jan Link to this post

    Hi Arun,

    Excuse me for the mistake, the name of the demo is Large Data. You can find it in the Performance section of the ChartView control demos inside the UI for WPF examples. This location applies for both demo applications - WPF and SL.

    If you have further questions about this let us know.

    Regards,
    Ivan
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  6. Arun
    Arun avatar
    10 posts
    Member since:
    Nov 2015

    Posted 18 Jan in reply to Ivan Link to this post

    Hi,

     The mentioned example is not relevant to me. 

     The requirement is have to show the chart dataitems when we click on corresponding legend. Please find the attached screenshot and below details.

    In the attached screenshot we can able to see 4 items(Q1, Q2, Q3, and Q4) with the series of values. Now the chart showing all 4 items in chart area. Our requirement is we need to show Q1 data items when i click on Q1 legend. Corresponding for all other legend items also.

     

    How we can implement this, I hope we can write a template for legend to click and how to get the corresponding chart items and how to disable/collapse other items. 

     Please attach a example.

     

  7. Answer
    Ivan
    Admin
    Ivan avatar
    44 posts

    Posted 19 Jan Link to this post

    Hello Arun,

    We are not sure that we completely understand your case. However, we prepared a sample project for you. Can you take a look at it and let us know if this is what you are looking for?

    The series are initially hidden. When you click on some of the legend items, the series bound to the legend item is being shown.

    Let me know if this works for you.

    Regards,
    Ivan
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  8. Arun
    Arun avatar
    10 posts
    Member since:
    Nov 2015

    Posted 19 Jan in reply to Ivan Link to this post

    Yes. This is the expected one. Thanks lot. 

     

    Also i need to hide the other legend items and show the corresponding legend item alone when we click.

  9. Arun
    Arun avatar
    10 posts
    Member since:
    Nov 2015

    Posted 19 Jan in reply to Arun Link to this post

    Like highlight the current legend and disable the other legends
  10. Ivan
    Admin
    Ivan avatar
    44 posts

    Posted 21 Jan Link to this post

    Hello Arun,

    Can you please clarify further what do you mean by setting the other legend items hidden or disabled? This way the user will be able to select a legend item and it's corresponding series only one time.

    Is this the behavior that you are looking for?

    If this is the case, in the project we've sent you, you can pass the legend control itself as a command parameter. Then, inside the static command handler you can extract  all the buttons from the legend template and set their Visibility property to Collapsed. Finally, you can set the Visibility property to Visible only on the button that has been clicked .

    Regards,
    Ivan
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  11. Arun
    Arun avatar
    10 posts
    Member since:
    Nov 2015

    Posted 27 Jan in reply to Ivan Link to this post

    "you can pass the legend control itself as a command parameter. Then, inside the static command handler you can extract  all the buttons from the legend template and set their Visibility property to Collapsed. Finally, you can set the Visibility property to Visible only on the button that has been clicked ."

     

    Can you please provide the code snippet for this. 

  12. Answer
    Ivan
    Admin
    Ivan avatar
    44 posts

    Posted 01 Feb Link to this post

    Hi Arun,

    In xaml you can pass the legend as a CommandParameter in the following way:
    <telerik:RadLegend x:Name="legend">
    <
    telerik:RadLegend.ItemTemplate>
      <DataTemplate>
          <telerik:RadButton Content="{Binding Title}"
                Command="{x:Static local:MyCommands.HideShowCommand}"
                CommandParameter="{Binding ElementName=legend}"
                Background="{Binding MarkerFill}"
                Tag="LegendItemButton"/>
        </DataTemplate>
    </telerik:RadLegend.ItemTemplate>
    </telerik:RadLegend>

    In the CommandExecuteHandler handler in the code behind you can introduce these changes:
    private static void CommandExecuteHandler(object sender, ExecutedRoutedEventArgs e)
    {
    var legend = e.Parameter as RadLegend;
     var buttons = legend.ChildrenOfType<RadButton>().Where(x => x.Tag.ToString() == "LegendItemButton");
     
     RadButton button = (RadButton)sender;
     LegendItem item = button.DataContext as LegendItem;
     BarSeries series = item.Presenter as BarSeries;
     RadCartesianChart chart = series.Chart as RadCartesianChart;
     var items = chart.LegendItems;
     
     foreach (BarSeries s in chart.Series)
     {
       s.Visibility = Visibility.Collapsed;
     }
     foreach (var btn in buttons)
     {
      btn.Opacity= 0.5;
     }
     
     series.Visibility = Visibility.Visible;
     button.Opacity = 1;
    }
    This way when the user clicks on a legend button, the relevant series item will be highlighted and all the other legend buttons will fade.

    Regards,
    Ivan
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  13. Arun
    Arun avatar
    10 posts
    Member since:
    Nov 2015

    Posted 01 Feb in reply to Ivan Link to this post

    Thanks lot
Back to Top
UI for WPF is Visual Studio 2017 Ready