RadChart Filtering with Checkbox Template

9 posts, 0 answers
  1. Fransiscus
    Fransiscus avatar
    7 posts
    Member since:
    May 2011

    Posted 02 Jun 2011 Link to this post

    Hi,

    I've implemented the logic as the telerik sample http://demos.telerik.com/silverlight/#Chart/SimpleFiltering

    Everything are working fine - I've implemented the same Setter template for the checkbox (e.g in this sample "PART_MainContainer")

    Problem
    -At the moment my charts display 5 legends with check box on each of the legend and each of the legend check box corresponded to the hiding/showing corresponded series line
    -By default all those 5 series line are showed and the 5 checkboxes on every legend are checked
    -Initially I want to display only just 2 legends and 2 corresponded series line
    -At the moment I know how to hide the corresponded series line that I want to hide but I have an issue where i can hide the series line but I can't uncheck the check box beside the legend (I can't get/Don't know how to get the Check Box object from the LegendItem object) (e.g because initially 2 series lines are loaded but 5 check boxes in the legend are checked)

    These are my codes
    XAML
    <Style x:Key="CustomLegendItemStyle" TargetType="telerik:ChartLegendItem">
               <Setter Property="Template" >
                   <Setter.Value>
                       <ControlTemplate TargetType="telerik:ChartLegendItem">
                           <Grid x:Name="PART_MainContainer" HorizontalAlignment="Stretch" VerticalAlignment="Top" Margin="0,0,5,0">
                               <Path x:Name="PART_LegendItemMarker"
                                     Height="25"
                                     Width="220"
                                     Style="{TemplateBinding ItemStyle}"
                                     Stretch="Fill">
                                   <Path.Data>
                                       <PathGeometry x:Name="PART_ItemMarkerGeometry" />
                                   </Path.Data>
                               </Path>
                               <CheckBox IsChecked="True"
                                         VerticalAlignment="Center"
                                         Margin="2,0"
                                         Content="{TemplateBinding Label}"
                                         Foreground="{TemplateBinding Foreground}"
                                         Checked="CheckBox_Checked" Unchecked="CheckBox_Checked" />
                           </Grid>
     
                       </ControlTemplate>
                   </Setter.Value>
               </Setter>
           </Style>

    These are the code behind that hiding the lines
    radChartReport.Loaded  += (o, b) =>
                  {
                      var dataSeries = radChartReport.DefaultView.ChartArea.DataSeries.FirstOrDefault();
                      if (dataSeries != null)
                      {
                          foreach (var point in dataSeries.ToList())
                          {
                              for (int i=0;i<point.DataSeries.Count;i++)
                              {
                                  ChartLegendItem legendItem = (radChartReport.DefaultView.ChartLegend as Telerik.Windows.Controls.ItemsControl).Items[i] as ChartLegendItem;
                                  if (legendItem.Label.ToLower().Contains("importance by affiliation") || legendItem.Label.ToLower().Contains("performance by staff")
                                      || legendItem.Label.ToLower().Contains("importance by manager"))
                                  {
                                      //legendItem.Label = "test";
                                      var a = legendItem.Template;
                                      radChartReport.DefaultView.ChartArea.DataSeries[i].Definition.Visibility = SeriesVisibility.Hidden;
                                  }
                              }
                           }
                      }
                  };
  2. Fransiscus
    Fransiscus avatar
    7 posts
    Member since:
    May 2011

    Posted 03 Jun 2011 Link to this post

    Telerik admin,

    Need your help desperately here. I just need to get the checkbox object from the setters template
  3. DevCraft banner
  4. Missing user
    Missing user avatar

    Posted 07 Jun 2011 Link to this post

    Hello Fransiscus,

    You can get the CheckBox from the ChartLegendItem by the extension method ChildrenOfType<CheckBox>(), part of the UIElementExtensions Class. In order to use it, you need to include namespace reference to Telerik.Windows.Controls. For example:
    ...
    ChartLegendItem legendItem = (radChartReport.DefaultView.ChartLegend as Telerik.Windows.Controls.ItemsControl).Items[i] as ChartLegendItem;
    if (legendItem.Label.ToLower().Contains("importance by affiliation") || legendItem.Label.ToLower().Contains("performance by staff")
        || legendItem.Label.ToLower().Contains("importance by manager"))
    {
        radChartReport.DefaultView.ChartArea.DataSeries[i].Definition.Visibility = SeriesVisibility.Hidden;
        CheckBox checkBox = legendItem.ChildrenOfType<CheckBox>().FirstOrDefault();
        if (checkBox != null)
            checkBox.IsChecked = false;
    }
    ...

    I hope that this helps.

    Kind regards,
    Polina
    the Telerik team
    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 Public Issue Tracking system and vote to affect the priority of the items
  5. Fransiscus
    Fransiscus avatar
    7 posts
    Member since:
    May 2011

    Posted 08 Jun 2011 Link to this post

    Hi Polina,

    I changed my code slightly a little bit to iterate through legend items instead of datapoint and I also use your code. The checkbox does not return any object, it always return as NULL eventhough the dataseries can be hidden and the legenditem is not null

    for (int i=0;i< radChartReport.DefaultView.ChartArea.DataSeries.Count;i++)
                                {
                                    ChartLegendItem legendItem = (radChartReport.DefaultView.ChartLegend as Telerik.Windows.Controls.ItemsControl).Items[i] as ChartLegendItem;
                                    if (legendItem.Label.ToLower().Contains("importance by affiliation") || legendItem.Label.ToLower().Contains("performance by staff")
                                        || legendItem.Label.ToLower().Contains("importance by manager"))
                                    {
                                        CheckBox checkBox = legendItem.ChildrenOfType<CheckBox>().FirstOrDefault();
                                        if (checkBox != null)
                                            checkBox.IsChecked = false;
                                        radChartReport.DefaultView.ChartArea.DataSeries[i].Definition.Visibility = SeriesVisibility.Hidden;
                                    }
                                }
  6. Missing user
    Missing user avatar

    Posted 13 Jun 2011 Link to this post

    Hi Fransiscus,

    For your convenience, I prepared a sample project, based on the Simple Filtering demo and your code snippets. You can find it in the attached file. Basically, you can get the ChartLegendItems, and respectively the CheckBoxes, after the RadChart.DefaultView.ChartArea is loaded. For example:
    void ChartArea_Loaded(object sender, RoutedEventArgs e)
    {
        var dataSeries = RadChart1.DefaultView.ChartArea.DataSeries;
        if (dataSeries != null)
        {
            for (int i = 0; i < dataSeries.Count; i++)
            {
                ChartLegendItem legendItem =
                    (RadChart1.DefaultView.ChartLegend as Telerik.Windows.Controls.ItemsControl).Items[i] as ChartLegendItem;
     
                if (legendItem.Label.ToLower().Contains("series 3") || legendItem.Label.ToLower().Contains("series 4"))
                {
                    dataSeries[i].Definition.Visibility = SeriesVisibility.Hidden;
                    CheckBox checkBox = legendItem.ChildrenOfType<CheckBox>().FirstOrDefault();
                    if (checkBox != null)
                        checkBox.IsChecked = false;
                }
            }
        }
    }

    If the issue persists, could you please open a formal support ticket and send us a runnable sample project that we can investigate locally and give you an appropriate solution.

    Kind regards,
    Polina
    the Telerik team
    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 Public Issue Tracking system and vote to affect the priority of the items
  7. Randy
    Randy avatar
    40 posts
    Member since:
    Nov 2007

    Posted 03 Aug 2011 Link to this post

    I have implemented your Chart Simple Filtering demo with checkboxes.
    After the demo code is in place, I click the checkbox and the data series hides & shows but the checkbox stays checked.
    Even if I explicitly uncheck it in the code behind.
    Same thing for a radtogglebutton, the state of the toggle button will not change even as the data series hides or shows.

    <Style x:Key="CustomLegendItemStyle" TargetType="telerik:ChartLegendItem">
        <Setter Property="Foreground" Value="Black" />
        <Setter Property="Template" >
            <Setter.Value>
                <ControlTemplate TargetType="telerik:ChartLegendItem">
                    <Grid x:Name="PART_MainContainer" HorizontalAlignment="Stretch" VerticalAlignment="Top" Margin="0,0,5,0">
                        <StackPanel Orientation="Horizontal" >
                            <telerik:RadToggleButton Width="22" Height="22" HorizontalContentAlignment="Center" VerticalContentAlignment="Center"
                                                     IsChecked="True"
                                                     Margin="0,1,5,0"
                                                     IsThreeState="False"
                                                     CommandParameter="{TemplateBinding Label}"
                                                     Click="ChartLegend_RadToggleButton_Click">
                                <telerik:RadToggleButton.Content>
                                    <Image Source="/Images/16/Test.png" Height="16" Width="16" />
                                </telerik:RadToggleButton.Content>
                            </telerik:RadToggleButton>
                            <Path x:Name="PART_LegendItemMarker"
                                  Height="22"
                                  Width="22"
                                  Style="{TemplateBinding ItemStyle}"
                                  Stretch="Fill">
                                <Path.Data>
                                    <PathGeometry x:Name="PART_ItemMarkerGeometry" />
                                </Path.Data>
                            </Path>
                            <CheckBox IsChecked="True" x:Name="chk"
                                      VerticalAlignment="Center"
                                      Margin="2,0"
                                      Content="{TemplateBinding Label}"
                                      Foreground="{TemplateBinding Foreground}" 
                                      Command="{Binding ToggleLegendItem,ElementName=ControlRoot}" 
                                      CommandParameter="{TemplateBinding Label}" />
                        </StackPanel>
                          
                          
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    I also posted the same question in this thread:
    http://www.telerik.com/community/forums/silverlight/chart/chart-legend-template-and-series.aspx

    Thanks,
    Randy
  8. Missing user
    Missing user avatar

    Posted 08 Aug 2011 Link to this post

    Hello Randy,

    Based on the supplied information, it is hard to determine what is causing this unwanted behavior. If the issue persist, you can open a formal support ticket, and send us a small working sample, incorporating your logic and showing the unwanted behavior. We will debug it locally, and advise you further.

    All the best,
    Polina
    the Telerik team

    Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get now >>

  9. Randy
    Randy avatar
    40 posts
    Member since:
    Nov 2007

    Posted 08 Aug 2011 Link to this post

    Hi Polina,

    This thread basically tells the story:
    http://www.telerik.com/community/forums/silverlight/chart/chart-legend-template-and-series.aspx

    After implementing the demo as noted, the checkboxes do not reflect the "unchecked" state (they stay checked).
    As Joel notes at the bottom of the thread, it seems to be because

    The example on the demo page doesn't have this issue because the data being
    displayed never changes.  If you modify the example at
    http://demos.telerik.com/silverlight/#Chart/SimpleFiltering to update the data,
    you can see the problem by displaying some data, changing the series visibility
    through the legend and then repopulating the chart with data.
      
    If Randy is experiencing the same issue I was, then all of the series lines
    will be displayed, but the legend will still show the state from before the
    chart was repopulated.

    A workaround I have at the moment is setting series definition visibility to hidden instead of collapsed.
    It then all works.
    Only bummer is the chart doesn't then rescale itself based on the series x & y axis values that are left visible.

    It would be nice to have your demo, where the data series changes after checking or unchecking a checkbox, and using "series.Definition.Visibility = Collapsed" so that the chart will rescale to the new x & y axis'.

    Thanks,
    Randy
  10. Missing user
    Missing user avatar

    Posted 11 Aug 2011 Link to this post

    Hello Randy,

    We have addressed your inquiry in the other forum thread you have started on the same topic here.

    Should you have future inquiries, we would ask you to keep the communication on this issue in a single thread so we can advise you properly and in a timely manner.

    All the best,
    Polina
    the Telerik team

    Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get now >>

Back to Top
DevCraft banner