# Data Binding

Sparkline for WinForms control allows you to easily bind any enumerable collection of data values. See more demos, documentation, and samples here.

## Content

Data binding is the core for any data visualization control. The Sparkline control can easily bind to any enumerable collection of data values i.e. to any class that implements the **IEnumerable** interface. Also, the class can implement the **INotifyCollectionChanged** interface to have support for modifying data after binding.

### .NET Framework

To create a simple WinForms application for Sparkline control, follow the mentioned steps and the below output appears after executing the application.

![Sparklie WinForms](https://cdn.mescius.io/document-site-files/images/adac4adb-2280-4c58-a35f-c4af030999c6/images/sparklineqs.png)

### Add a C1Sparkline control

1. Create a new Windows Forms application.
2. Set the height and width of the form to 350
3. Drag and drop the C1Sparkline control from the Toolbox onto your from.
4. Set the height and width of the sparkline control to 250.

< Data a>

In this step, you add a class to your project that returns an enumerable collection of numeric data points to be plotted on the Sparkline chart. This code example assumes that you add a class named SampleData.cs to return a collection of numeric values.

1. In the **Solution Explorer**, right-click your project name and select **Add \| Class**.
2. Specify the name of the class i.e. **SampleData** and click **Add**.
3. Add relevant code to create an enumerable collection of numeric data and return the same in a method. 

    ```vbnet
    Class SampleData
        Public ReadOnly Property Sales As List(Of Double)
            Get
                Dim data As List(Of Double) = New List(Of Double)() From 
                    { 1.0,-1.0,2.0,-3.0,4.0,5.0,-5.0,2.0 }
                Return data
            End Get
        End Property
    End Class
    ```

    ```csharp
    class SampleData
        {
            public List<double> Sales
            {
                get
                {
                    List<double> data = new List<double>() 
                         { 1.0, -1.0, 2.0, -3.0, 4.0, 5.0, -5.0, 2.0 };
                    return data;
                }
            }
        }
    ```

### View C1Sparkline control

The **SampleData.cs** class added in the above step returns a collection of numeric values using the  ESTRONG>Sales Eproperty defined in the class. In this step, you bind this collection to the Sparkline control so that data can be plotted at runtime.

1. In the Form1\_Load event, create an instance of SampleData class and assign the value returned by the **Sales** property to the control's **Data** property.

    ```vbnet
    Dim sampleData As SampleData = New SampleData()
        c1Sparkline1.Data = sampleData.Sales
    ```

    ```csharp
    SampleData sampleData = new SampleData();
    c1Sparkline1.Data = sampleData.Sales;
    ```

### .NET

To create a simple WinForms application in .NET for Sparkline control, follow the mentioned steps and the below output appears after executing the application.

![Sparkline WinForms](https://cdn.mescius.io/document-site-files/images/adac4adb-2280-4c58-a35f-c4af030999c6/images/sparklineqs.png)

### Add a C1Sparkline control

1. Create a new Windows Forms .NET application.
2. Set the height and width of the form to 350
3. In the Solution Explorer, right click Dependencies and choose Manage NuGet Packages and add C1.Win.Sparkline .NET packages.
4. Switch to code view and add the following code in the code behind of Form.cs file

```csharp
//Initialized the C1Sparkline control

     C1Sparkline sparkline= new C1Sparkline();
//Adding the CSparkline control to the form

      this.Controls.Add(sparkline);
```

### Create a Data Source

In this step, you add a class to your project that returns an enumerable collection of numeric data points to be plotted on the Sparkline chart. This code example assumes that you add a class named SampleData.cs to return a collection of numeric values.

1. In the **Solution Explorer**, right-click your project name and select **Add \| Class**.
2. Specify the name of the class i.e. **SampleData** and click **Add**.
3. Add relevant code to create an enumerable collection of numeric data and return the same in a method.

    ```csharp
    class SampleData
        {
            public List<double> Sales
            {
                get
                {
                    List<double> data = new List<double>() 
                           { 1.0, -1.0, 2.0, -3.0, 4.0, 5.0, -5.0, 2.0 };
                    return data;
                }
            }
        }
    ```

### View C1Sparkline control

The **SampleData.cs** class added in the above step returns a collection of numeric values using the \<STRONG>Sales property defined in the class. In this step, you bind this collection to the Sparkline control so that data can be plotted at runtime.

1. In the Form1\_Load event, create an instance of SampleData class and assign the value returned by the **Sales** property to the control's **Data** property.

    ```csharp
    //Initialized the SampleData class      
    SampleData sampleData = new SampleData();
    //Assigned the "Sales" list available in the SampleData class //to the "Data" property of the C1Sparkline control     
    sparkline.Data = sampleData.Sales;
    ```

Click **Build \| Build Solution** to build the project. Run the application and observe how the **C1Sparkline** control appears at runtime.