Trendlines

Trendlines (or trend lines) are automatically generated indicators that show the the overall trends in the series data.

Defining Trendlines

Trendlines are defined as a special type of series that are linked to the main series by name.

To define a trendline, define a series item and set its for attribute to the parent series name:

Copy Code<kendo-chart-series-item
    name="Sales By Quarter"
    type="line"
    ...
></kendo-chart-series-item>
<kendo-chart-series-item
    name="Sales Trendline (LINEAR)"
    type="linearTrendline"
    for="Sales By Quarter"
></kendo-chart-series-item>

The Chart supports the following types of trendlines:

• Linear Trendline
• Exponential Trendline
• Logarithmic Trendline
• Power Trendline
• Polynomial Trendline
• Moving Average

The following example demonstrates how to add trendlines to chart series.

Linear Trendline

The linear trendline shows if a particular quantity is increasing or decreasing in time. They are commonly used to create Forecasts.

The following example demonstrates how to create a linear trendline for Categorical series.

The following example demonstrates how to create a linear trendline for Scatter series.

Exponential Trendline

Exponential trendlines are most suitable for data sets with accelerating rate of growth or decline. They can be used only for positive values.

The following example demonstrates how to create an exponential trendline for Categorical series.

The following example demonstrates how to create an exponential trendline for Scatter series.

Logarithmic Trendline

Logarithmic trendlines are best suited for data sets that grow quickly at the beginning and then taper off. They can only be use with both positive and negative values.

The following example demonstrates how to create a logarithmic trendline for Categorical series.

The following example demonstrates how to create a logarithmic trendline for Scatter series.

Power Trendline

Similar to Linear trendlines, power trendlines. They can be used only with positive values.

The following example demonstrates how to create a power trendline for Categorical series.

The following example demonstrates how to create a power trendline for Scatter series.

Polynomial Trendline

Polynomial trendlines are best suited for data series that alternates between growth and decline.

This type of trendlines accepts an order parameter that specifies the degree of the polynomial. The default order is 2. Accepted values are from 2 to 6:

• 2: a Quadratic polynomial with a single extreme point (minimum or maximum) point.
• 3: a Cubic polynomial with up to 2 extreme points.
• 4: a polynomial of 4th degree with up to 3 extreme points.
• 5: a polynomial of 5th degree with up to 4 extreme points.
• 6: a polynomial of 6th degree with up to 5 extreme points.

The following example demonstrates how to create a polynomial trendline for Categorical series.

The following example demonstrates how to create a polynomial trendline for Scatter series.

Moving Average Trendline

The moving average trendline is used to smooth out the variations in the data by averaging all points in a period. By default, the period is set to 2 chart intervals.

The following example demonstrates how to create a moving average trendline for Categorical series.

The following example demonstrates how to create a moving average trendline for Scatter series.

Data Binding

Trendline series use the data from the main series and do not support binding to a different data set. However, it's possible to bind to a different data field.

The following example demonstrates binding to the 'low' field of the main OHLC series. Please note, that the trendline must use the canonical field name ("low") and not the data item name ("Low").

Date Series and Aggregates

If the main series is using Aggregates, as is most common for Date Series, the trendlines bind to the aggregated data. For example when using the "sum" aggregate, the trendline plot the trend for the sums in each category.

Forecasts

For date and scatter series, trendlines can be extended in both directions by setting the forecast property.

The setting has no effect for Moving Average trendlines as this type does not support forecasts.

To enable the forecast for a trendline, set the before or after properties to the desired number of intervals.

Copy Code<kendo-chart-series-item-trendline
    [forecast]="{ before: 2, after: 5 }"
></kendo-chart-series-item-trendline>

The example below demonstrates how to add a forecast to a trendline:

Supported Series Types

Trendlines are supported for the following chart types:

• "area"
• "bar"
• "boxPlot"
• "bubble"
• "bullet"
• "candlestick"
• "column"
• "horizontalWaterfall"
• "line"
• "ohlc"
• "pie"
• "polarArea"
• "polarLine"
• "polarScatter"
• "radarArea"
• "radarColumn"
• "radarLine"
• "rangeArea"
• "rangeBar"
• "rangeColumn"
• "scatter"
• "scatterLine"
• "verticalArea"
• "verticalBoxPlot"
• "verticalBullet"
• "verticalLine"
• "verticalRangeArea"
• "waterfall"

Customization

The trendlines support many of the common series options:

• color
• dashType
• field—(see notes on data binding).
• highlight
• labels
• markers
• style
• name
• opacity
• tooltip
• type
• visible
• visibleInLegend
• width
• zIndex

Legend Items

By default, the trendlines are displayed in the Legend. They can be toggled by clicking on the legend item as regular series. Hiding the main series also hide the trendlines.

To hide the trendlines from the legend, set their visibleInLegend option to false:

Support and Learning Resources

• Getting Started with the Kendo UI for Angular Chart
• API Reference of the Chart
• Axes
• Legend
• Series
• Title
• Tooltip
• Getting Started with Kendo UI for Angular (Online Guide)
• Getting Started with Kendo UI for Angular (Video Tutorial)
• Virtual Classroom (Training Courses for Registered Users)
• Chart Forum
• Before You Start: All Things Angular (Telerik Blog Post)
• Knowledge Base

Additional Resources

• Angular Blogs
• Angular Videos
• Kendo UI for Angular Roadmap