Class ChartTrendline

Defines the collection of trendlines that are used to predict the trend.

Inheritance

System.Object

ChartSubComponent

ChartTrendline

Namespace: Syncfusion.Blazor.Charts

Assembly: Syncfusion.Blazor.dll

Syntax

public class ChartTrendline : ChartSubComponent, ISubcomponentTracker, IChartElement

Constructors

ChartTrendline()

Declaration

public ChartTrendline()

Properties

AccessibilityDescription

Gets or sets the accessibility description for the ChartTrendline.

Declaration

public string AccessibilityDescription { get; set; }

Property Value

Type	Description
System.String	Accepts a string that defines the accessibility description for the ChartTrendline. The default value is an empty string.

Remarks

Use this property to provide an accessibility description for the ChartTrendline.

Examples

// This example demonstrates how to add a power trendline with an accessibility description to a chart.
<SfChart>
    <ChartSeriesCollection>
        <ChartSeries DataSource="@Data" XName="XValue" YName="YValue">
            <ChartTrendlines>
                <ChartTrendline AccessibilityDescription="Power trendline" />
            </ChartTrendlines>
        </ChartSeries>
    </ChartSeriesCollection>
</SfChart>

AccessibilityDescriptionFormat

Gets or sets the format for the accessibility description of the ChartTrendline.

Declaration

public string AccessibilityDescriptionFormat { get; set; }

Property Value

Type	Description
System.String	Accepts a string that defines the format for the accessibility description of the ChartTrendline. The default value is null.

Remarks

Use this property to provide a format for the accessibility description of the ChartTrendline. The AccessibilityDescription property is used to provide accessibility information statically. But this AccessibilityDescriptionFormat property allows you to provide dynamic information based on the ChartTrendline data. For example, the format "${series.name} : ${point.x}" displays the series name and x-value of the point in the accessibility description.

Examples

// This example demonstrates how to add a power trendline with an accessibility description format to a chart.
<SfChart>
    <ChartSeriesCollection>
        <ChartSeries DataSource="@Data" XName="XValue" YName="YValue">
            <ChartTrendlines>
                <ChartTrendline AccessibilityDescriptionFormat="Power trendline" />
            </ChartTrendlines>
        </ChartSeries>
    </ChartSeriesCollection>
</SfChart>

AccessibilityRole

Gets or sets the accessibility role for the ChartTrendline.

Declaration

public string AccessibilityRole { get; set; }

Property Value

Type	Description
System.String	Accepts a string that defines the accessibility role for the ChartTrendline. The default value is null.

Remarks

Use this property to provide an accessibility role for the ChartTrendline.

Examples

// This example demonstrates how to add a power trendline with an accessibility role to a chart.
<SfChart>
    <ChartSeriesCollection>
        <ChartSeries DataSource="@Data" XName="XValue" YName="YValue">
            <ChartTrendlines>
                <ChartTrendline AccessibilityRole="Trendline" />
            </ChartTrendlines>
        </ChartSeries>
    </ChartSeriesCollection>
</SfChart>

Animation

Gets or sets the animation settings for the trendline.

Declaration

public ChartTrendlineAnimation Animation { get; set; }

Property Value

Type	Description
ChartTrendlineAnimation	An instance of ChartTrendlineAnimation that specifies the animation properties for displaying the trendline.

Remarks

This property allows you to define entry and transition animations for the trendline, enhancing the visual presentation and engagement when the trendline appears on the chart.

Examples

// This example demonstrates how to enable animation for a trendline with a duration of 2000ms.
<SfChart>
    <ChartSeriesCollection>
        <ChartSeries DataSource="@Data" XName="XValue" YName="YValue">
            <ChartTrendlines>
                <ChartTrendline>
                    <ChartTrendlineAnimation Enable="true" Duration="2000" />
                </ChartTrendline>
            </ChartTrendlines>
        </ChartSeries>
    </ChartSeriesCollection>
</SfChart>

BackwardForecast

Gets or sets the backward forecast for the trendline.

Declaration

public double BackwardForecast { get; set; }

Property Value

Type	Description
System.Double	A double representing the backward forecast period.

Remarks

This property is used to define the backward forecast period for the trendline.

Examples

// This example demonstrates how to apply a trendline with a backward forecast of 5 to a chart.
<SfChart>
    <ChartSeriesCollection>
        <ChartSeries DataSource="@Data" XName="XValue" YName="YValue">
            <ChartTrendlines>
                <ChartTrendline BackwardForecast="5" />
            </ChartTrendlines>
        </ChartSeries>
    </ChartSeriesCollection>
</SfChart>

DashArray

Gets or sets the dash array pattern for the trendline.

Declaration

public string DashArray { get; set; }

Property Value

Type	Description
System.String	A string that specifies the dash pattern for the trendline. The default value is "0".

Remarks

The dash array can be used to represent the trendline with different styles, such as dashed or dotted lines.

Examples

// This example demonstrates how to add a dashed trendline to a chart.
<SfChart>
    <ChartSeriesCollection>
        <ChartSeries DataSource="@Data" XName="XValue" YName="YValue">
            <ChartTrendlines>
                <ChartTrendline DashArray="5,1" />
            </ChartTrendlines>
        </ChartSeries>
    </ChartSeriesCollection>
</SfChart>

EnableTooltip

Gets or sets a value indicating whether tooltips are enabled for the trendline.

Declaration

public bool EnableTooltip { get; set; }

Property Value

Type	Description
System.Boolean	A boolean indicating tooltip visibility. The default value is true.

Remarks

This property is used to enable or disable tooltips for the trendline.

Examples

// This example demonstrates how to enable tooltips for trendlines and display trendline markers.
<SfChart>
    <ChartTooltipSettings Enable="true"></ChartTooltipSettings>
    <ChartSeriesCollection>
        <ChartSeries DataSource="@Data" XName="XValue" YName="YValue">
            <ChartTrendlines>
                <ChartTrendline EnableTooltip="true">
                    <ChartTrendlineMarker Visible="true" />
                </ChartTrendline>
            </ChartTrendlines>
        </ChartSeries>
    </ChartSeriesCollection>
</SfChart>

Fill

Gets or sets the fill color of the trendline.

Declaration

public string Fill { get; set; }

Property Value

Type	Description
System.String	A string representing the fill color. The value must be a valid color string in CSS, formatted as either a hexadecimal or rgba value. The default value is an empty string.

Remarks

This property is used to define the fill color of the trendline.

Examples

// This example demonstrates how to set the fill color of a trendline to green.
<SfChart>
    <ChartSeriesCollection>
        <ChartSeries DataSource="@Data" XName="XValue" YName="YValue">
            <ChartTrendlines>
                <ChartTrendline Fill="green" />
            </ChartTrendlines>
        </ChartSeries>
    </ChartSeriesCollection>
</SfChart>

Focusable

Gets or sets the accessibility keyboard navigation focus option for the ChartTrendline.

Declaration

public bool Focusable { get; set; }

Property Value

Type	Description
System.Boolean	Accepts the boolean value to enable or disable the keyboard navigation for the ChartTrendline. The default value is true.

Remarks

Use this property to toggle the keyboard navigation focus for the ChartTrendline.

Examples

// This example demonstrates how to make a trendline focusable in a chart.
<SfChart>
    <ChartSeriesCollection>
        <ChartSeries DataSource="@Data" XName="XValue" YName="YValue">
            <ChartTrendlines>
                <ChartTrendline Focusable="true" />
            </ChartTrendlines>
        </ChartSeries>
    </ChartSeriesCollection>
</SfChart>

ForwardForecast

Gets or sets the forward forecast for the trendline.

Declaration

public double ForwardForecast { get; set; }

Property Value

Type	Description
System.Double	A double representing the forward forecast period.

Remarks

This property is used to define the forward forecast period for the trendline.

Examples

// This example demonstrates how to apply a trendline with a forward forecast of 10 to a chart.
<SfChart>
    <ChartSeriesCollection>
        <ChartSeries DataSource="@Data" XName="XValue" YName="YValue">
            <ChartTrendlines>
                <ChartTrendline ForwardForecast="10" />
            </ChartTrendlines>
        </ChartSeries>
    </ChartSeriesCollection>
</SfChart>

Intercept

Gets or sets the Y-intercept of the trendline.

Declaration

public double Intercept { get; set; }

Property Value

Type	Description
System.Double	A double representing the intercept. The default value is NaN.

Remarks

This property is used to define the Y-intercept of the trendline.

Examples

// This example demonstrates how to apply a trendline with an intercept of 30 to a chart.
<SfChart>
    <ChartSeriesCollection>
        <ChartSeries DataSource="@Data" XName="XValue" YName="YValue">
            <ChartTrendlines>
                <ChartTrendline Intercept="30" />
            </ChartTrendlines>
        </ChartSeries>
    </ChartSeriesCollection>
</SfChart>

LegendShape

Gets or sets the shape of the legend associated with the trendline.

Declaration

public LegendShape LegendShape { get; set; }

Property Value

Type	Description
LegendShape	A LegendShape value defining the legend marker shape.

Remarks

This property is used to define the shape of the legend marker for the trendline.

Examples

// This example demonstrates how to customize the legend shape of a trendline and enable markers in a chart.
<SfChart>
    <ChartSeriesCollection>
        <ChartSeries DataSource="@Data" XName="XValue" YName="YValue">
            <ChartTrendlines>
                <ChartTrendline LegendShape="LegendShape.Rectangle" Name="Triangle">
                    <ChartTrendlineMarker Visible="true" />
                </ChartTrendline>
            </ChartTrendlines>
        </ChartSeries>
    </ChartSeriesCollection>
</SfChart>

Marker

Gets or sets the marker settings for the trendline.

Declaration

public ChartTrendlineMarker Marker { get; set; }

Property Value

Type	Description
ChartTrendlineMarker	An instance of ChartTrendlineMarker that defines the marker properties for the trendline.

Remarks

Use this property to customize the appearance of markers on the trendline, enhancing visual distinction and data point identification through attributes such as size, shape, and color.

Examples

// This example demonstrates how to display trendline markers on a chart.
<SfChart>
    <ChartSeriesCollection>
        <ChartSeries DataSource="@Data" XName="XValue" YName="YValue">
            <ChartTrendlines>
                <ChartTrendline>
                    <ChartTrendlineMarker Visible="true" />
                </ChartTrendline>
            </ChartTrendlines>
        </ChartSeries>
    </ChartSeriesCollection>
</SfChart>

Name

Gets or sets the name of the trendline.

Declaration

public string Name { get; set; }

Property Value

Type	Description
System.String	A string representing the name of the trendline. The default value is an empty string.

Remarks

Setting the name is useful for identifying the trendline in a chart's legend or for accessibility purposes.

Examples

// This example demonstrates how to add a name property to a trendline.
<SfChart>
    <ChartSeriesCollection>
        <ChartSeries DataSource="@Data" XName="XValue" YName="YValue">
            <ChartTrendlines>
                <ChartTrendline Name="Linear" />
            </ChartTrendlines>
        </ChartSeries>
    </ChartSeriesCollection>
</SfChart>

Period

Gets or sets the moving average period for the trendline.

Declaration

public double Period { get; set; }

Property Value

Type	Description
System.Double	A double representing the period of the moving average trendline.

Remarks

This property is used to define the moving average period for the trendline.

Examples

// This example demonstrates how to add a Moving Average trendline with a specified period
// and enable markers for it in a chart.
<SfChart>
    <ChartSeriesCollection>
        <ChartSeries DataSource="@Data" XName="XValue" YName="YValue">
            <ChartTrendlines>
                <ChartTrendline Period="5" Type="TrendlineTypes.MovingAverage">
                    <ChartTrendlineMarker Visible="true" />
                </ChartTrendline>
            </ChartTrendlines>
        </ChartSeries>
    </ChartSeriesCollection>
</SfChart>

PolynomialOrder

Gets or sets the order for polynomial trendline fitting.

Declaration

public double PolynomialOrder { get; set; }

Property Value

Type	Description
System.Double	A double representing the polynomial order. The default value is 2.

Remarks

This property is used to define the order of the polynomial trendline fitting.

Examples

// This example demonstrates how to add a polynomial trendline with order 1 to a chart.
<SfChart>
    <ChartSeriesCollection>
        <ChartSeries DataSource="@Data" XName="XValue" YName="YValue">
            <ChartTrendlines>
                <ChartTrendline PolynomialOrder="1" Type="TrendlineTypes.Polynomial" />
            </ChartTrendlines>
        </ChartSeries>
    </ChartSeriesCollection>
</SfChart>

Type

Gets or sets the type of the trendline.

Declaration

public TrendlineTypes Type { get; set; }

Property Value

Type	Description
TrendlineTypes	A TrendlineTypes enumeration value that specifies the type of trendline.

Remarks

Different trendline types, such as linear, exponential, and polynomial, can be used to fit the trend to the underlying data.

Examples

// This example demonstrates how to add a power trendline to a chart.
<SfChart>
    <ChartSeriesCollection>
        <ChartSeries DataSource="@Data" XName="XValue" YName="YValue">
            <ChartTrendlines>
                <ChartTrendline Type="TrendlineTypes.Power" />
            </ChartTrendlines>
        </ChartSeries>
    </ChartSeriesCollection>
</SfChart>

Visible

Gets or sets a value indicating whether the trendline is visible.

Declaration

public bool Visible { get; set; }

Property Value

Type	Description
System.Boolean	A boolean value indicating the visibility of the trendline. The default value is true.

Remarks

Use this property to toggle the visibility of the trendline on the chart.

Examples

// This example demonstrates how to add a visible trendline to a chart.
<SfChart>
    <ChartSeriesCollection>
        <ChartSeries DataSource="@Data" XName="XValue" YName="YValue">
            <ChartTrendlines>
                <ChartTrendline Visible="true" />
            </ChartTrendlines>
        </ChartSeries>
    </ChartSeriesCollection>
</SfChart>

Width

Gets or sets the width of the trendline.

Declaration

public double Width { get; set; }

Property Value

Type	Description
System.Double	A double representing the line width. The default value is 1.

Remarks

This property is used to define the width of the trendline.

Examples

// This example demonstrates how to set the width of a trendline to 20.
<SfChart>
    <ChartSeriesCollection>
        <ChartSeries DataSource="@Data" XName="XValue" YName="YValue">
            <ChartTrendlines>
                <ChartTrendline Width="20" />
            </ChartTrendlines>
        </ChartSeries>
    </ChartSeriesCollection>
</SfChart>