FlexChart快速入门

此快速入门将指导您完成使用FlexChart控件创建简单折线图的步骤。请按照以下步骤开始：

设置应用

1. 创建一个新的Windows窗体应用程序。
2. 将FlexChart控件从工具箱拖放到窗体上。
   如上图，会自动绘制带有默认数据的柱状图类型的图表。

将FlexChart控件绑定到一个数据源

1. 创建一个数据源

   CS

   public List<Product> GetProductRevenue()
   {
       List<Product> _list = new List<Product>();
       _list.Add(new Product() { Name = "Desktop", Date = new DateTime(2018, 04, 07), Orders = 265, Revenue = 6625 });
       _list.Add(new Product() { Name = "Desktop", Date = new DateTime(2018, 05, 08), Orders = 107, Revenue = 2675 });
       _list.Add(new Product() { Name = "Mouse", Date = new DateTime(2018, 06, 02), Orders = 56, Revenue = 560 });
       _list.Add(new Product() { Name = "Mouse", Date = new DateTime(2018, 07, 06), Orders = 572, Revenue = 5720 });
       _list.Add(new Product() { Name = "Mouse", Date = new DateTime(2018, 08, 05), Orders = 468, Revenue = 4680 });
       _list.Add(new Product() { Name = "Printer", Date = new DateTime(2018, 09, 02), Orders = 154, Revenue = 2310 });
       _list.Add(new Product() { Name = "Desktop", Date = new DateTime(2018, 10, 03), Orders = 89, Revenue = 2225 });
       _list.Add(new Product() { Name = "Desktop", Date = new DateTime(2018, 11, 05), Orders = 347, Revenue = 8675 });
       _list.Add(new Product() { Name = "Printer", Date = new DateTime(2018, 12, 07), Orders = 204, Revenue = 3060 });
       _list.Add(new Product() { Name = "Printer", Date = new DateTime(2019, 01, 03), Orders = 34, Revenue = 510 });
       _list.Add(new Product() { Name = "Mouse", Date = new DateTime(2019, 02, 06), Orders = 223, Revenue = 2230 });
       _list.Add(new Product() { Name = "Desktop", Date = new DateTime(2019, 03, 08), Orders = 119, Revenue = 2975 });
       return _list;
   }

2. 通过设置DataSource属性将FlexChart绑定到此数据源

   CS

   //Passing data to FlexChart 
   this.flexChart1.DataSource = GetProductRevenue();

配置FlexChart控件

1. 清除默认序列显示在图表中。
2. 使用Add方法添加一个新系列，并通过设置BindingX和Binding属性来配置X和Y轴。

3. 通过设置ChartType和其他必需的属性来配置图表。

   CS

   flexChart1.Series.Clear();
   
   //Selecting chart's type 
   this.flexChart1.ChartType = C1.Chart.ChartType.LineSymbols;
   
   //Setting chart's Header and styling it 
   this.flexChart1.Header.Content = "DateWise Revenue";
   
   //Adding a Series to chart and binding it (AxisY) to 'Revenue' field of DataCollection 
   this.flexChart1.Series.Add(new C1.Win.Chart.Series
   {
       //Name property specifies the string to be displayed corresponding to this Series in Legend     Name = "Sales",
       Binding = "Revenue"
   });
   
   //Binding chart's AxisX to 'Date' so Dates are shown in Horizontal axis 
   this.flexChart1.BindingX = "Date";