Step 1: Creating an Application with the C1Chart Control

In this step you'll create a new Windows 8 Style application in Visual Studio 2012 and add the C1Chart control to a page.

In Visual Studio 2012 Select File | New | Project.
In the New Project dialog box, expand a language in the left pane, under the language select Windows Store, and in the templates list select Blank App (XAML). Enter a Name and click OK to create your project.
Right-click the References folder in the Solution Explorer and select Add Reference from the dropdown list.
Select the in the Reference Manager and click OK.
Open MainPage.xaml if it isn't already open, place the cursor between the <Grid> and </Grid> tags, and click once.
Navigate to the Toolbox and double-click the C1Chart icon to add the control to the grid. This will add the reference and XAML namespace automatically. The XAML markup resembles the following:

XAML	Copy Code
<Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}"> <Chart:C1Chart/> </Grid>

The chart will appear populated with some default data and a C1ChartLegend component will be positioned on the right edge of the control. In the next step we will populate the chart with new data.

Inside the Grid tags, initialize the C1Chart control and give it a name by adding Margin="0,0,8,8" MinHeight="160" MinWidth="240" Name="c1Chart1" to the <Chart:C1Chart> tag so that it appears similar to the following:

XAML	Copy Code
<Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}"> <Chart:C1Chart Margin="0,0,8,8" MinHeight="160" MinWidth="240" Name="c1Chart1"/> </Grid>

Note that if you run the application now, the chart appears empty since you haven't added data for it yet.

Add the Loaded event to your namespace declarations. The namespace declarations resembles the following:

XAML	Copy Code
<Pagexmlns:Chart="using:C1.Xaml.Chart" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="using:QSAppTest" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:Xaml="using:C1.Xaml" x:Class="QSAppTest.MainPage" mc:Ignorable="d"Loaded="Page_Loaded_1">

XAML

Copy Code

<Pagexmlns:Chart="using:C1.Xaml.Chart"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:QSAppTest"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:Xaml="using:C1.Xaml"
    x:Class="QSAppTest.MainPage"
    mc:Ignorable="d"Loaded="Page_Loaded_1">

What You’ve Accomplished

You've successfully created a WinRT application containing a C1Chart control. In the next step, you'll add data for C1Chart.