Class Chart

Inheritance

System.Object

Syncfusion.EJ2.EJTagHelper

Chart

Namespace: Syncfusion.EJ2.Charts

Assembly: Syncfusion.EJ2.dll

Syntax

public class Chart : EJTagHelper

Constructors

Chart()

Declaration

public Chart()

Properties

Accessibility

Options to improve accessibility for chart elements.

Declaration

public ChartBaseAccessibility Accessibility { get; set; }

Property Value

Type	Description
ChartBaseAccessibility	The default value is null

AfterExport

Triggers after the export is completed.

Declaration

public string AfterExport { get; set; }

Property Value

Type	Description
System.String	The default value is null

AllowExport

To enable export feature in blazor chart.

Declaration

public bool AllowExport { get; set; }

Property Value

Type	Description
System.Boolean	The default value is false

AllowMultiSelection

If set to true, enables multi-drag selection in the chart. This feature allows selecting multiple data points by dragging a selection box.

Note that the selectionMode to be set to DragX, DragY, or DragXY for this feature to work.

Declaration

public bool AllowMultiSelection { get; set; }

Property Value

Type	Description
System.Boolean	The default value is false

AnimationComplete

Triggers after the animation for the series is completed.

Declaration

public string AnimationComplete { get; set; }

Property Value

Type	Description
System.String	The default value is null

AnnotationRender

Triggers before the annotation gets rendered. This event allows for modifications of the annotation content and its location before it is rendered on the chart.

Declaration

public string AnnotationRender { get; set; }

Property Value

Type	Description
System.String	The default value is null

Annotations

Annotations are used to highlight specific data points or areas in the chart, providing additional context and information.

Declaration

public List<ChartAnnotation> Annotations { get; set; }

Property Value

Type	Description
System.Collections.Generic.List<Syncfusion.EJ2.Charts.ChartAnnotation>	The default value is null

Axes

Configuration options for the secondary axis in the chart. Each object in the collection represents an additional axis, allowing for the plotting of multiple data series with different scales.

Declaration

public List<ChartAxis> Axes { get; set; }

Property Value

Type	Description
System.Collections.Generic.List<Syncfusion.EJ2.Charts.ChartAxis>	The default value is null

AxisLabelClick

Triggers when the x-axis label is clicked.

Declaration

public string AxisLabelClick { get; set; }

Property Value

Type	Description
System.String	The default value is null

AxisLabelRender

Triggers before each axis label is rendered. This event allows for the customization of axis label and its font style before rendering on the chart.

Declaration

public string AxisLabelRender { get; set; }

Property Value

Type	Description
System.String	The default value is null

AxisMultiLabelRender

Triggers before each axis multi-label is rendered. This event allows modification of multi-labels on the axis before they are rendered.

Declaration

public string AxisMultiLabelRender { get; set; }

Property Value

Type	Description
System.String	The default value is null

AxisRangeCalculated

Triggers before each axis range is rendered. This event allows modification of the axis range and interval that are calculated based on data.

Declaration

public string AxisRangeCalculated { get; set; }

Property Value

Type	Description
System.String	The default value is null

Background

The background color of the chart accepts values in hex and rgba formats as valid CSS color strings.

Declaration

public string Background { get; set; }

Property Value

Type	Description
System.String	The default value is null

BackgroundImage

The background image of the chart accepts a string value as a URL link or the location of an image.

Declaration

public string BackgroundImage { get; set; }

Property Value

Type	Description
System.String	The default value is null

BeforeExport

Triggers before the export process begins. This event allows for the customization of export settings before the chart is exported.

Declaration

public string BeforeExport { get; set; }

Property Value

Type	Description
System.String	The default value is null

BeforePrint

Triggers before the printing process starts. This event allows for the modification of the chart's HTML content before it is sent to the printer.

Declaration

public string BeforePrint { get; set; }

Property Value

Type	Description
System.String	The default value is null

BeforeResize

Triggers before the chart is resized. This event allows for modifications to the chart size before resizing occurs.

Declaration

public string BeforeResize { get; set; }

Property Value

Type	Description
System.String	The default value is null

Border

Options for customizing the appearance of the border in the chart by using the color and width properties in the border.

Declaration

public ChartBorder Border { get; set; }

Property Value

Type	Description
ChartBorder	The default value is null

ChartArea

Configuration options for the chart area's border and background.

Declaration

public ChartArea ChartArea { get; set; }

Property Value

Type	Description
ChartArea	The default value is null

ChartDoubleClick

Triggers when double-clicking the chart.

Declaration

public string ChartDoubleClick { get; set; }

Property Value

Type	Description
System.String	The default value is null

ChartMouseClick

Triggers when clicking on the chart.

Declaration

public string ChartMouseClick { get; set; }

Property Value

Type	Description
System.String	The default value is null

ChartMouseDown

Triggers on mouse down.

Declaration

public string ChartMouseDown { get; set; }

Property Value

Type	Description
System.String	The default value is null

ChartMouseLeave

Triggers when the cursor leaves the chart.

Declaration

public string ChartMouseLeave { get; set; }

Property Value

Type	Description
System.String	The default value is null

ChartMouseMove

Triggers on hovering over the chart.

Declaration

public string ChartMouseMove { get; set; }

Property Value

Type	Description
System.String	The default value is null

ChartMouseUp

Triggers on mouse up.

Declaration

public string ChartMouseUp { get; set; }

Property Value

Type	Description
System.String	The default value is null

Columns

Options to split the chart into multiple plotting areas vertically. Each object in the collection represents a separate plotting area (column) in the chart, allowing multiple data series to be displayed in distinct vertical sections.

Declaration

public List<ChartColumn> Columns { get; set; }

Property Value

Type	Description
System.Collections.Generic.List<Syncfusion.EJ2.Charts.ChartColumn>	The default value is null

Crosshair

The crosshair displays lines on the chart that follow the mouse cursor and show the axis values of the data points.

Declaration

public ChartCrosshairSettings Crosshair { get; set; }

Property Value

Type	Description
ChartCrosshairSettings	The default value is null

DataSource

Specifies the data source for the chart. It can be an array of JSON objects, or an instance of DataManager.

Declaration

public object DataSource { get; set; }

Property Value

Type	Description
System.Object	The default value is null

Description

A description for the chart that provides additional information about its content for screen readers.

Declaration

public string Description { get; set; }

Property Value

Type	Description
System.String	The default value is null

Drag

Triggers when the point is being dragged.

Declaration

public string Drag { get; set; }

Property Value

Type	Description
System.String	The default value is null

DragComplete

Triggers after the drag selection is completed.

Declaration

public string DragComplete { get; set; }

Property Value

Type	Description
System.String	The default value is null

DragEnd

Triggers when the point drag operation ends.

Declaration

public string DragEnd { get; set; }

Property Value

Type	Description
System.String	The default value is null

DragStart

Triggers when the drag operation for a point starts.

Declaration

public string DragStart { get; set; }

Property Value

Type	Description
System.String	The default value is null

EnableAnimation

If set to true, animation effects will be enabled for chart elements such as axis labels, gridlines, series, markers, and data labels when the legend is clicked, or the data source is updated.

Declaration

public bool EnableAnimation { get; set; }

Property Value

Type	Description
System.Boolean	The default value is true

EnableAutoIntervalOnBothAxis

If set to true, the intervals for all the axes will be calculated automatically based on the zoomed range.

Declaration

public bool EnableAutoIntervalOnBothAxis { get; set; }

Property Value

Type	Description
System.Boolean	The default value is false

EnableCanvas

When set to true, the chart will render using a canvas.

Declaration

public bool EnableCanvas { get; set; }

Property Value

Type	Description
System.Boolean	The default value is false

EnableExport

When set to true, it enables exporting the chart to various formats such as JPEG, PNG, SVG, PDF, XLSX, or CSV.

Declaration

public bool EnableExport { get; set; }

Property Value

Type	Description
System.Boolean	The default value is true

EnableHtmlSanitizer

Specifies whether to display or remove the untrusted HTML values in the Chart component. If 'enableHtmlSanitizer' set to true, the component will sanitize any suspected untrusted strings and scripts before rendering them.

Declaration

public bool EnableHtmlSanitizer { get; set; }

Property Value

Type	Description
System.Boolean	The default value is false

EnablePersistence

Enable or disable persisting component's state between page reloads.

Declaration

public bool EnablePersistence { get; set; }

Property Value

Type	Description
System.Boolean	The default value is false

EnableRtl

Enable or disable rendering component in right to left direction.

Declaration

public bool EnableRtl { get; set; }

Property Value

Type	Description
System.Boolean	The default value is false

EnableSideBySidePlacement

This property controls whether columns for different series appear next to each other in a column chart.

Declaration

public bool EnableSideBySidePlacement { get; set; }

Property Value

Type	Description
System.Boolean	The default value is true

FocusBorderColor

Customize the focus border color. If not specified, the element will use the default focus border color.

Declaration

public string FocusBorderColor { get; set; }

Property Value

Type	Description
System.String	The default value is null

FocusBorderMargin

Customize the focus border margin. If not specified, the element will use the default focus border margin.

Declaration

public double FocusBorderMargin { get; set; }

Property Value

Type	Description
System.Double	The default value is 0

FocusBorderWidth

Customize the focus border width. If not specified, the element will use the default focus border width.

Declaration

public double FocusBorderWidth { get; set; }

Property Value

Type	Description
System.Double	The default value is 1.5

Height

The height of the chart as a string, accepting input such as '100px' or '100%'. If specified as '100%', the chart renders to the full height of its parent element.

Declaration

public string Height { get; set; }

Property Value

Type	Description
System.String	The default value is null

HighlightColor

Defines the color used to highlight a data point on mouse hover.

Declaration

public string HighlightColor { get; set; }

Property Value

Type	Description
System.String	The default value is ""

HighlightMode

The highlightMode property determines how a series or individual data points are highlighted in the chart. The available options are: 'None': Disables highlighting. 'Series': Highlights an entire series of data points. 'Point': Highlights a single data point. 'Cluster': Highlights a group of data points that belong to the same cluster.

Declaration

public HighlightMode HighlightMode { get; set; }

Property Value

Type	Description
HighlightMode	The default value is HighlightMode.None

HighlightPattern

The highlightPattern property determines how the data points or series are visually highlighted. The available options are: 'None': No highlighting pattern. 'Chessboard': Applies a chessboard pattern for highlighting. 'Dots': Applies a dot pattern for highlighting. 'DiagonalForward': Applies a forward diagonal line pattern for highlighting. 'Crosshatch': Applies a crosshatch pattern for highlighting. 'Pacman': Applies a Pacman pattern for highlighting. 'DiagonalBackward': Applies a backward diagonal line pattern for highlighting. 'Grid': Applies a grid pattern for highlighting. 'Turquoise': Applies a turquoise pattern for highlighting. 'Star': Applies a star pattern for highlighting. 'Triangle': Applies a triangle pattern for highlighting. 'Circle': Applies a circle pattern for highlighting. 'Tile': Applies a tile pattern for highlighting. 'HorizontalDash': Applies a horizontal dash pattern for highlighting. 'VerticalDash': Applies a vertical dash pattern for highlighting. 'Rectangle': Applies a rectangle pattern for highlighting. 'Box': Applies a box pattern for highlighting. 'VerticalStripe': Applies a vertical stripe pattern for highlighting. 'HorizontalStripe': Applies a horizontal stripe pattern for highlighting. 'Bubble': Applies a bubble pattern for highlighting.

Declaration

public SelectionPattern HighlightPattern { get; set; }

Property Value

Type	Description
SelectionPattern	The default value is SelectionPattern.None

HtmlAttributes

Allows additional HTML attributes such as title, name, etc., and accepts n number of attributes in a key-value pair format.

Declaration

public object HtmlAttributes { get; set; }

Property Value

Type
System.Object

Indicators

Technical indicators assist in evaluating market conditions and identifying trends for making trading decisions.

Declaration

public List<ChartIndicator> Indicators { get; set; }

Property Value

Type	Description
System.Collections.Generic.List<Syncfusion.EJ2.Charts.ChartIndicator>	The default value is null

IsMultiSelect

When set to true, it allows selecting multiple data points, series, or clusters.

Note that the selectionMode must be set to Point, Series, or Cluster for multi-selection to be enabled.

Declaration

public bool IsMultiSelect { get; set; }

Property Value

Type	Description
System.Boolean	The default value is false

IsTransposed

When set to true, the chart will render in a transposed manner, where the X and Y axes are interchanged.

Declaration

public bool IsTransposed { get; set; }

Property Value

Type	Description
System.Boolean	The default value is false

LegendClick

Triggers after clicking on a legend item.

Declaration

public string LegendClick { get; set; }

Property Value

Type	Description
System.String	The default value is null

LegendRender

Triggers before the legend is rendered. This allows the customization of legend before rendering on the chart.

Declaration

public string LegendRender { get; set; }

Property Value

Type	Description
System.String	The default value is null

LegendSettings

The legend provides descriptive information about the data series displayed in the chart, helping to understand what each series represents.

Declaration

public ChartLegendSettings LegendSettings { get; set; }

Property Value

Type	Description
ChartLegendSettings	The default value is null

Load

Triggers before the chart loads. This event allows for customization and configuration before the chart is rendered.

Declaration

public string Load { get; set; }

Property Value

Type	Description
System.String	The default value is null

Loaded

Triggers after the chart has fully loaded.

Declaration

public string Loaded { get; set; }

Property Value

Type	Description
System.String	The default value is null

Locale

Overrides the global culture and localization value for this component. Default global culture is 'en-US'.

Declaration

public string Locale { get; set; }

Property Value

Type	Description
System.String	The default value is ""

Margin

Options to customize the margins around the chart, including the left, right, top, and bottom margins. These margins refer to the space between the outer edge of the chart and its chart area.

Declaration

public ChartMargin Margin { get; set; }

Property Value

Type	Description
ChartMargin	The default value is null

MultiLevelLabelClick

Triggers after clicking on a multi-level label.

Declaration

public string MultiLevelLabelClick { get; set; }

Property Value

Type	Description
System.String	The default value is null

OnZooming

Triggers when the zoom selection started.

Declaration

public string OnZooming { get; set; }

Property Value

Type	Description
System.String	The default value is null

Palettes

The palettes array defines a set of colors used for rendering the chart's series. Each color in the array is applied to the series in order.

Declaration

public string[] Palettes { get; set; }

Property Value

Type	Description
System.String[]	The default value is null

PointClick

Triggers on point click.

Declaration

public string PointClick { get; set; }

Property Value

Type	Description
System.String	The default value is null

PointDoubleClick

Triggers on point double-click.

Declaration

public string PointDoubleClick { get; set; }

Property Value

Type	Description
System.String	The default value is null

PointMove

Triggers when a data point is hovered.

Declaration

public string PointMove { get; set; }

Property Value

Type	Description
System.String	The default value is null

PointRender

Triggers before each point in the series is rendered. This allows for the customization of each data point before it is rendered on the chart.

Declaration

public string PointRender { get; set; }

Property Value

Type	Description
System.String	The default value is null

PrimaryXAxis

The primaryXAxis property configures the horizontal axis of the chart, including settings for axis labels, tick marks, grid lines, and axis ranges.

Declaration

public ChartAxis PrimaryXAxis { get; set; }

Property Value

Type	Description
Syncfusion.EJ2.Charts.ChartAxis	The default value is null

PrimaryYAxis

The primaryYAxis property configures the vertical axis of the chart, including settings for axis labels, tick marks, grid lines, and axis ranges.

Declaration

public ChartAxis PrimaryYAxis { get; set; }

Property Value

Type	Description
Syncfusion.EJ2.Charts.ChartAxis	The default value is null

RangeColorSettings

The rangeColorSettings property specifies a set of rules for applying different colors to points based on their value ranges.

Declaration

public List<ChartRangeColorSetting> RangeColorSettings { get; set; }

Property Value

Type	Description
System.Collections.Generic.List<Syncfusion.EJ2.Charts.ChartRangeColorSetting>	The default value is null

Resized

Triggers after the chart is resized.

Declaration

public string Resized { get; set; }

Property Value

Type	Description
System.String	The default value is null

Rows

Options to split the chart into multiple plotting areas horizontally. Each object in the collection represents a separate plotting area (row) in the chart, allowing multiple data series to be displayed in distinct horizontal sections.

Declaration

public List<ChartRow> Rows { get; set; }

Property Value

Type	Description
System.Collections.Generic.List<Syncfusion.EJ2.Charts.ChartRow>	The default value is null

ScrollChanged

Triggers when the scroll position changes.

Declaration

public string ScrollChanged { get; set; }

Property Value

Type	Description
System.String	The default value is null

ScrollEnd

Triggers after the scroll action ends.

Declaration

public string ScrollEnd { get; set; }

Property Value

Type	Description
System.String	The default value is null

ScrollStart

Triggers when the scroll action starts.

Declaration

public string ScrollStart { get; set; }

Property Value

Type	Description
System.String	The default value is null

SelectedDataIndexes

Specifies the point indexes to be selected when a chart is initially loaded.

Note that selectionMode or highlightMode must be set to Point, Series, or Cluster for this feature to work.

Declaration

public List<ChartSelectedDataIndex> SelectedDataIndexes { get; set; }

Property Value

Type	Description
System.Collections.Generic.List<Syncfusion.EJ2.Charts.ChartSelectedDataIndex>	The default value is null

SelectionComplete

Triggers after the selection is completed.

Declaration

public string SelectionComplete { get; set; }

Property Value

Type	Description
System.String	The default value is null

SelectionMode

The selectionMode property determines how data points or series can be highlighted or selected. The available options are: 'None': Disables any form of highlight or selection. 'Series': Highlights or selects an entire series of data points. 'Point': Highlights or selects a single data point. 'Cluster': Highlights or selects a group of data points that belong to the same cluster. 'DragXY': Selects points by dragging with respect to both horizontal and vertical axes. 'DragX': Selects points by dragging with respect to horizontal axis. 'DragY': Selects points by dragging with respect to vertical axis. 'Lasso': Selects points by dragging with respect to free form.

Declaration

public SelectionMode SelectionMode { get; set; }

Property Value

Type	Description
SelectionMode	The default value is SelectionMode.None

SelectionPattern

The selectionPattern property determines how the selected data points or series are visually represented. The available options are: 'None': No selection pattern is applied. 'Chessboard': Applies a chessboard pattern as the selection effect. 'Dots': Applies a dot pattern as the selection effect. 'DiagonalForward': Applies a forward diagonal line pattern as the selection effect. 'Crosshatch': Applies a crosshatch pattern as the selection effect. 'Pacman': Applies a Pacman pattern as the selection effect. 'DiagonalBackward': Applies a backward diagonal line pattern as the selection effect. 'Grid': Applies a grid pattern as the selection effect. 'Turquoise': Applies a turquoise pattern as the selection effect. 'Star': Applies a star pattern as the selection effect. 'Triangle': Applies a triangle pattern as the selection effect. 'Circle': Applies a circle pattern as the selection effect. 'Tile': Applies a tile pattern as the selection effect. 'HorizontalDash': Applies a horizontal dash pattern as the selection effect. 'VerticalDash': Applies a vertical dash pattern as the selection effect. 'Rectangle': Applies a rectangle pattern as the selection effect. 'Box': Applies a box pattern as the selection effect. 'VerticalStripe': Applies a vertical stripe pattern as the selection effect. 'HorizontalStripe': Applies a horizontal stripe pattern as the selection effect. 'Bubble': Applies a bubble pattern as the selection effect.

Declaration

public SelectionPattern SelectionPattern { get; set; }

Property Value

Type	Description
SelectionPattern	The default value is SelectionPattern.None

Series

Configuration options for the chart's series. Each object in the series collection represents a distinct data series displayed in the chart. Customize various aspects of each series such as data, type, and appearance.

Declaration

public List<ChartSeries> Series { get; set; }

Property Value

Type	Description
System.Collections.Generic.List<Syncfusion.EJ2.Charts.ChartSeries>	The default value is null

SeriesRender

Triggers before the series is rendered. This event allows for the customization of series properties before they are rendered on the chart.

Declaration

public string SeriesRender { get; set; }

Property Value

Type	Description
System.String	The default value is null

SharedTooltipRender

Triggers before the shared tooltip for the series is rendered. This event allows customization of the shared tooltip properties such as text, style, and template before it is rendered on the chart.

Declaration

public string SharedTooltipRender { get; set; }

Property Value

Type	Description
System.String	The default value is null

SubTitle

The subtitle is positioned below the main title and provides additional details about the data represented in the chart.

Declaration

public string SubTitle { get; set; }

Property Value

Type	Description
System.String	The default value is ""

SubTitleStyle

Options for customizing the appearance of the subtitle, which displays information about the plotted data below the main title. Use the fontFamily, size, fontStyle, fontWeight, and color properties in titleSettings to adjust the subtitle's appearance.

Declaration

public ChartTitleSettings SubTitleStyle { get; set; }

Property Value

Type	Description
ChartTitleSettings	The default value is null

TabIndex

The tabIndex value determines the order in which the chart container receives focus during keyboard navigation.

Declaration

public double TabIndex { get; set; }

Property Value

Type	Description
System.Double	The default value is 1

TextRender

Triggers before the data label for the series is rendered. This allows customization of data labels before they are rendered on the chart.

Declaration

public string TextRender { get; set; }

Property Value

Type	Description
System.String	The default value is null

Theme

The theme applied to the chart for visual styling. Choose from predefined themes to change the overall look and feel of the chart. The available themes are: Fabric FabricDark Bootstrap4 Bootstrap BootstrapDark HighContrastLight HighContrast Tailwind TailwindDark Bootstrap5 Bootstrap5Dark Fluent FluentDark Fluent2 Fluent2Dark Fluent2HighContrast Material3 Material3Dark Material MaterialDark

Declaration

public ChartTheme Theme { get; set; }

Property Value

Type	Description
ChartTheme	The default value is ChartTheme.Material

Title

The title is displayed at the top of the chart to provide information about the plotted data.

Declaration

public string Title { get; set; }

Property Value

Type	Description
System.String	The default value is ""

TitleStyle

Options for customizing the appearance of the title, which displays information about the plotted data. Use the fontFamily, size, fontStyle, fontWeight, and color properties in titleSettings to adjust the title's appearance.

Declaration

public ChartTitleSettings TitleStyle { get; set; }

Property Value

Type	Description
ChartTitleSettings	The default value is null

Configuration options for the chart's tooltip, which displays details about the points when hovering over them.

Declaration

public ChartTooltipSettings Tooltip { get; set; }

Property Value

Type	Description
ChartTooltipSettings	The default value is null

TooltipRender

Triggers before the tooltip for the series is rendered. This event allows customization of the tooltip properties such as text, style, and template before it is rendered on the chart.

Declaration

public string TooltipRender { get; set; }

Property Value

Type	Description
System.String	The default value is null

UseGroupingSeparator

When set to true, a grouping separator will be used for numbers to separate groups of thousands in the chart.

Declaration

public bool UseGroupingSeparator { get; set; }

Property Value

Type	Description
System.Boolean	The default value is false

Width

The width of the chart as a string, accepting input such as '100px' or '100%'. If specified as '100%', the chart renders to the full width of its parent element.

Declaration

public string Width { get; set; }

Property Value

Type	Description
System.String	The default value is null

ZoomComplete

Triggers after the zoom selection is completed.

Declaration

public string ZoomComplete { get; set; }

Property Value

Type	Description
System.String	The default value is null

ZoomSettings

Options to enable and configure the zooming feature in the chart.

Declaration

public ChartZoomSettings ZoomSettings { get; set; }

Property Value

Type	Description
ChartZoomSettings	The default value is null