We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback


Overview

The WPF Line Chart represents and visualizes time-dependent data to show trends at equal intervals. It supports numeric, category, date-time, and logarithmic axes and works well with large amounts of data with animation, zooming, and panning.

WPF Line chart documentation

WPF Line Chart


Key features

WPF Vertical Line Chart

Vertical Line Chart

The WPF Line Chart can be transposed vertically to view the data from a different perspective.

WPF Line Chart showing Empty Point aka Null Point

Empty or null point chart

Empty or null data points are elegantly handled in a line chart in WPF.

WPF Line Chart with Multiple Axes

Multiple axes

Use multiple axes to plot different data sets that widely vary from one another.

WPF Line Chart with Data Markers

Line chart markers

The WPF Line Chart data points are visualized as markers with built-in symbols such as crosses, squares, pluses, inverted triangles, hexagon, ellipses, vertical lines, horizontal lines, diamonds, triangles, and pentagons.


Code example

<Window x:Class="ChartExample.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:ChartExample"
        xmlns:chart="clr-namespace:Syncfusion.UI.Xaml.Charts;assembly=Syncfusion.SfChart.WPF"
        mc:Ignorable="d"
        Title="WPF Line Chart" Height="450" Width="700">
    
    <!--Setting DataContext-->
    <Window.DataContext>
        <local:ViewModel/>
    </Window.DataContext>
    
    <StackPanel>
        <chart:SfChart Height="300" Width="500">
            <!--Initialize the horizontal axis for the WPF Chart-->
            <chart:SfChart.PrimaryAxis>
                <chart:CategoryAxis />
            </chart:SfChart.PrimaryAxis>

            <!--Initialize the vertical axis for the WPF Chart-->
            <chart:SfChart.SecondaryAxis>
                <chart:NumericalAxis />
            </chart:SfChart.SecondaryAxis>
           
            <!--Adding LineSeries to the WPF Chart-->
            <chart:LineSeries 
                    ItemsSource="{Binding Data}" 
                    XBindingPath="Month"
                    YBindingPath="Target">
            </chart:LineSeries>
        </chart:SfChart>
    </StackPanel>
</Window>
public class Model
{
    public string Month { get; set; }

    public double Target { get; set; }

    public Model(string xValue, double yValue)
    {
        Month = xValue;
        Target = yValue;
    }
}

public class ViewModel
{
    public ObservableCollection<Model> Data { get; set; }

    public ViewModel()
    {
        Data = new ObservableCollection<Model>()
        {
            new Model("Jan", 50),
            new Model("Feb", 70),
            new Model("Mar", 65),
            new Model("Apr", 57),
            new Model("May", 48), 
        };
    }
}

Learning resources

Navigate to GitHub code used to configure the WPF Line Chart

GitHub code

The WPF Line Chart configuration code is available in GitHub.

Navigate to the options available in the user guide to customize the WPF Line Chart

WPF Line Chart user guide

Learn more about the available options to customize WPF Line Charts.

Navigate to the API references documentation of the WPF Line Chart

WPF Line Chart API reference

Explore the WPF Line Chart APIs.


100+ WPF CONTROLS

Scroll up icon

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon