Trend Lines

Trend lines are an important tool for analyzing data. Trend line indicates the general rate of increase or decrease of Y data over X data in a chart. A common scenario is measuring the rate change of sales price over time. FlexChart control supports trend lines through a built-in TrendLine class for ease of use during implementation. Trend lines are most commonly used in Line, Column, Bar, or Scatter charts.

FlexChart supports the following regression and non-regression trend lines.

TrendLine.FitType	Description
Linear	A linear trend line is the straight line that most closely approximates the data in the chart. The data is linear, if the data pattern resembles a line. Equation - Y(x) = C0 + C1*x
Polynomial	Polynomial trend lines are curved lines that are used with fluctuating data. They are useful for analyzing gains or losses over a large data set. When using a polynomial trend line, it is important to also set the Order of the line, which can be determined by the number of fluctuations in the data. Equation - Y(x) = C0 + C1x + C2x2 + : + Cn-1*xn-1
Logarithmic	Logarithmic trend line is a best-fit curved line that is most useful when the rate of change in the data increases or decreases quickly and then levels out. A logarithmic trend line can use negative and/or positive values. Equation - Y(x) = C0 * ln(C1*x)
Power	Power trend line is a curved line that is best used with data sets that compare measurements that increase at a specific rate — for example, the acceleration of a race car at one-second intervals. You cannot create a power trend line if your data contains zero or negative values. Equation - Y(x) = C0 * pow(x, C1)
Exponent	Exponential trend line is a curved line that is most useful when data values rise or fall at increasingly higher rates. You cannot create an exponential trend line if your data contains zero or negative values. Equation - Y(x) = C0 * exp( C1*x)
Fourier	Fourier trend line identifies patterns or cycles in a series data set. It removes the effects of trends or other complicating factors from the data set, thereby providing a good estimate of the direction that the data under analysis will take in the future. Equation - Y(x) = C0 + C1 * cos(x) + C2 * sin(x) + C3 * cos(2x) + C4 sin(2*x) + ...
MinX	The minimum X-value on the chart.
MinY	The minimum Y-value on the chart.
MaxX	The maximum X-value on the chart.
MaxY	The maximum Y-value on the chart.
AverageX	The average X-value on the chart.
AverageY	The average Y-value on the chart.

To implement trend line in FlexChart, use the TrendLine class that inherits the Series class. To begin with, create an instance of TrendLine class, and then use the TrendLine object to specify its properties. Once, the associated properties are set, add the trend line to the FlexChart using Series.Add method.

The following image shows how FlexChart appears after adding a linear trend line.

Add the following code in Form1.cs file.

Visual Basic
C#

Visual Basic

Public Partial Class Form1
    Inherits Form

    Private trendLine As C1.Win.Chart.TrendLine

    Private dataList As ObservableCollection(Of DataItem) = New ObservableCollection(Of DataItem)()

    Public Sub New()
        InitializeComponent()
        Dim rnt = New Random()
        For i As Integer = 1 To 30 - 1
            dataList.Add(New DataItem() With {.X = i, .Y = rnt.[Next](100)})
        Next

        flexChart1.AxisY.Min = 0
        flexChart1.AxisY.Max = 100
        flexChart1.ChartType = ChartType.Scatter
        Dim serie = New Series() With 
        {.Name = "Base DataList", .DataSource = dataList, .Binding = "Y", .BindingX = "X"}
        trendLine = New TrendLine() With 
        {.Name = "Trendline", .DataSource = dataList, .Binding = "Y", .BindingX = "X", .Order = 4, .FitType = FitType.Linear}
        flexChart1.Series.Add(serie)
        flexChart1.Series.Add(trendLine)
    End Sub

    Public Class DataItem

        Private _y As Integer

        Public Property X As Integer

        Public Property Y As Integer
            Get
                Return _y
            End Get

            Set(ByVal value As Integer)
                If value = _y Then Return
                _y = value
            End Set
        End Property
    End Class
End Class

public partial class Form1 : Form
    {
        C1.Win.Chart.TrendLine trendLine;
        ObservableCollection<DataItem> dataList = new ObservableCollection<DataItem>();
        public Form1()
        {
            InitializeComponent();

            var rnt = new Random();
            for (int i = 1; i < 30; i++)
            {
                dataList.Add(new DataItem() { X = i, Y = rnt.Next(100) });
            }
            flexChart1.AxisY.Min = 0;
            flexChart1.AxisY.Max = 100;

            flexChart1.ChartType = ChartType.Scatter;

            var serie = new Series()
            {
                Name = "Base DataList",
                DataSource = dataList,
                Binding = "Y",
                BindingX = "X",
            };

            trendLine = new TrendLine()
            {
                Name = "Trendline",
                DataSource = dataList,
                Binding = "Y",
                BindingX = "X",
                Order = 4,
                FitType = FitType.Linear,
            };
            flexChart1.Series.Add(serie);
            flexChart1.Series.Add(trendLine);
        }
        public class DataItem
        {
            int _y;
            public int X { get; set; }

            public int Y
            {
                get { return _y; }
                set
                {
                    if (value == _y) return;
                    _y = value;
                }
            }}
        }
    }