Collapse All Expand All

In the last step, you added the C1Chart control to the Window. In this step, you will add a DataSeries object and data for it.

To add data to the chart programmatically in the code behind file:

1. Right-click on the MainPage.xaml file and select View Code to open the editor.
2. Add the C1.Xaml.C1Chart namespace directive:

To write the code in Visual Basic:

Visual Basic	Copy Code
Imports C1.Xaml.Chart

To write the code in C#:

C#	Copy Code
using C1.Xaml.Chart;

3. Add the following Page_Loaded_1 event handler with code to create the Bar chart:

To write the code in Visual Basic:

Visual Basic

Copy Code

Private Sub Page_Loaded_1(sender As Object, e As RoutedEventArgs) ' Clear previous data c1Chart1.Data.Children.Clear() ' Add Data Dim ProductNames As String() = {"Hand Mixer", "Stand Mixer", "Can Opener", "Toaster", "Blender", "Food Processor", "Slow Cooker", "Microwave"} Dim PriceX As Integer() = {80, 400, 20, 60, 150, 300, 130, 500} ' create single series for product price Dim ds1 As New DataSeries() ds1.Label = "Price X" 'set price data ds1.ValuesSource = PriceX ' add series to the chart c1Chart1.Data.Children.Add(ds1) ' add item names c1Chart1.Data.ItemNames = ProductNames ' Set chart type c1Chart1.ChartType = ChartType.Bar End Sub

To write the code in C#:

C#

Copy Code

private void Page_Loaded_1(object sender, RoutedEventArgs e) { // Clear previous data c1Chart1.Data.Children.Clear(); // Add Data string[] ProductNames = { "Hand Mixer", "Stand Mixer", "Can Opener", "Toaster", "Blender", "Food Processor", "Slow Cooker", "Microwave" }; int[] PriceX = { 80, 400, 20, 60, 150, 300, 130, 500 }; // create single series for product price DataSeries ds1 = new DataSeries(); ds1.Label = "Price X"; //set price data ds1.ValuesSource = PriceX; // add series to the chart c1Chart1.Data.Children.Add(ds1); // add item names c1Chart1.Data.ItemNames = ProductNames; // Set chart type c1Chart1.ChartType = ChartType.Bar; }

What You've Accomplished

You have successfully added data to C1Chart control so when you run your application the string values appear on the Y-axis like the following:

In the next step you will add a ChartView object so you can customize the X-Axis.

 

 

---

Copyright (c) GrapeCity, inc. All rights reserved.

Product Support Forum  |  Documentation Feedback