The Expression Editor supports integration with the FlexChart control. Expression Editor, when integrated with chart, enables manipulating the visualization of chart using expressions.

To integrate Expression Editor with FlexChart, you need to use ItemsSource property of C1FlexChart class that gets a collection of objects containing the series data, from CollectionViewSource object. After getting the series data, data source of FlexChart can be bound to data source of Expression Editor using its DataSource property.

The following image exhibits Expression Editor integrated with the FlexChart control. The chart plots country-wise Sales and Expenses for a retail store.

The following code demonstrates integrating FlexChart with Expression Editor control.

1. Create a C1CollectionView type field.
   • VB
   • C#

   • VB

   Public View As C1CollectionView
   

   • C#

   public C1CollectionView View;
   

2. Bind the instance of C1CollectionView component of FlexChart to Expression Editor through its DataSource property.
   • VB
   • C#

   • VB

   Me.InitializeComponent()
   
   View = New C1CollectionView(DataCreator.CreateData()) 'Create instance Of C1CollectionView component
   flexChart.ItemsSource = View 'To get a collection of objects containing the series data
   flexChart.BindingX = "Country"
   flexChart.Series.Add(New Series() With {
           .SeriesName = "Sales",
           .Binding = "Sales"
       })
   flexChart.Series.Add(New Series() With {
           .SeriesName = "Expenses",
           .Binding = "Expenses"
       })
   editor.DataSource = View.CurrentItem 'Bind the instance of C1CollectionView component to ExpressionEditor
   

   • C#

   this.InitializeComponent();
   
   View = new C1CollectionView(DataCreator.CreateData());  // Create instance of C1CollectionView component
   
   flexChart.ItemsSource = View;  // To get a collection of objects containing the series data
   flexChart.BindingX = "Country";
   flexChart.Series.Add(new Series() { SeriesName = "Sales", Binding = "Sales" });
   flexChart.Series.Add(new Series() { SeriesName = "Expenses", Binding = "Expenses" });
   
   editor.DataSource = View.CurrentItem; // Bind the instance of C1CollectionView component to ExpressionEditor
   

Back to Top