Type of the Item in the C1ChartLegend.ItemTemplate?

Type of the Item in the C1ChartLegend.ItemTemplate?

Posted by: wkelly1 on 3 August 2018, 9:48 am EST

• 

  wkelly1

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 3 August 2018, 9:48 am EST - Updated 4 October 2022, 9:17 am EST

  Background

  I need to customize the legend of the C1Chart. The customer would like a check box to appear adjacent to each item. He would like to be able to turn the associated data series on and off.

  Current Approach

  I have tried customizing the legend’s ItemTemplate.

  
  <c1:C1ChartLegend.ItemTemplate>
      <DataTemplate>
          <CheckBox Content="{Binding}" />
      </DataTemplate>
  </c1:C1ChartLegend.ItemTemplate>
  
  

  That results in the following:

  

  I’m assuming that the “{Binding}” on the Checkbox’s Content property is displaying the ToString() method of the item being bound.

  Now, I need to display the color/dash/thickness of the associated data series. I am using XYDataSeries.

  Questions

  Is there a better way to accomplish this? Better than providing an ItemTemplate?

  What is the type of the object being bound in the ItemTemplate? Is it the associated Series? Is it the Label of the Series?

• 

  wkelly1

  • Post Options:
  • Link
    Copy

  Posted 3 August 2018, 10:24 am EST

  I think I just found the answer to my second question, LegendItem:

  http://help.grapecity.com/componentone/NetHelp/c1wpfchart/webframe.html#C1.WPF.C1Chart.4~C1.WPF.C1Chart.LegendItem_members.html

• 

  basant.khatiyan

  

  • Post Options:
  • Link
    Copy

  Posted 6 August 2018, 8:13 am EST

  Hello,

  For your 1st question, I think using ItemTemplate is the better and easier option to have custom controls for legend items.

  As for your second question, you are right that LegendItem is bound to ItemTemplate. So, you can directly use LegendItem.Symbol/LegendItem.Line for displaying shapes of symbols and connection lines. Please refer the attached sample(prj_CustomLegends.zip) for doing so.

  Thank you.
  
  prj_CustomLegends.zip

• 

  wkelly1

  • Post Options:
  • Link
    Copy

  Posted 14 August 2018, 8:46 am EST

  For those using MVVM and data binding, you might need to know that LegendItem’s Item property does not store the instances of the ChartData’s SeriesItemsSource, as one might expect. Instead, the LegendItem.Item stores a references to the DataSeries (which you are likely defining in a DataTemplate). To get access to the item provided by the SeriesItemSource, you can store the item in the Tag property of the DataSeries.

  Here is my code. Notice how the Tag property is used.

  
  <c1:C1Chart>
      <c1:C1Chart.Data>
          <c1:ChartData DataContext="{Binding NotifyOnTargetUpdated=True}" SeriesItemsSource="{Binding ChartSeriesData}">
              <c1:ChartData.SeriesItemTemplate>
                  <DataTemplate>
                      <c1:XYDataSeries
                          ChartType="Line"
                          ItemsSource="{Binding Points}"
                          Label="{Binding Label}"
                          Tag="{Binding}"
                          ValueBinding="{Binding Y}"
                          Visibility="{Binding IsVisible, Converter={StaticResource BoolToVisibilityConverter}}"
                          XValueBinding="{Binding X}" />
                  </DataTemplate>
              </c1:ChartData.SeriesItemTemplate>
          </c1:ChartData>
      </c1:C1Chart.Data>
      <c1:C1ChartLegend>
          <c1:C1ChartLegend.ItemTemplate>
              <DataTemplate>
                  <StackPanel Orientation="Horizontal">
                      <CheckBox
                          Margin="5"
                          Content="{Binding Label}"
                          IsChecked="{Binding Item.Tag.IsVisible}" />
                      <ContentControl
                          Width="24"
                          Height="20"
                          Content="{Binding Line}" />
                      <ContentControl
                          Width="14"
                          Height="14"
                          Content="{Binding Symbol}" />
                  </StackPanel>
              </DataTemplate>
          </c1:C1ChartLegend.ItemTemplate>
      </c1:C1ChartLegend>
  </c1:C1Chart>