SeriesDirective API in Angular Chart API component

Series Directive

<e-series-collection>
<e-series></e-series>
</e-series-collection>

Properties

accessibility

any

Options to improve accessibility for series elements.

animation

any

Options for customizing the animation of the series. By default, animation is enabled with a duration of 1000 milliseconds (about 1 second). It can be disabled by setting enable to false. The following properties are supported in animation:

• enable: If set to true, the series is animated on initial loading.
• duration: The duration of the animation in milliseconds.
• delay: The delay before the animation starts, in milliseconds.

bearFillColor

any

This property is used in financial charts to visualize price movements in stocks. It defines the color of the candle/point when the opening price is less than the closing price.

Defaults to null

binInterval

any

The binInterval property controls the width of each bin and the interval between bins for histogram points.

Defaults to null

border

any

Options for customizing the border of the series.

Note that this property is applicable only for Column and Bar type series.

boxPlotMode

any

Specifies the box plot mode for the box and whisker chart series. The available modes are: Exclusive - Renders the series based on the exclusive mode. Inclusive - Renders the series based on the inclusive mode. Normal - Renders the series based on the normal mode.

Defaults to ‘Normal’

bullFillColor

any

This property is used in financial charts to visualize price movements in stocks. It defines the color of the candle/point when the opening price is higher than the closing price.

Defaults to null

cardinalSplineTension

any

Specifies the tension parameter for cardinal splines. This affects the curvature of the spline.

Defaults to 0.5

close

any

The data source field that contains the close value. It is applicable for both financial series and technical indicators.

Defaults to ”

colorName

any

The data source field that contains the color mapping value. It is applicable for range color mapping.

columnFacet

any

Defines the shape of the data in a column and bar chart. Available shapes are:

• Rectangle: Displays the data in a column and bar chart with a rectangular shape.
• Cylinder: Displays the data in a column and bar chart with a cylindrical shape.

Defaults to ‘Rectangle’

columnSpacing

any

This property determines the space between columns in a column or bar chart.

Note that it takes a value from 0 to 1.

Defaults to 0

columnWidth

any

The columnWidth property can be used to customize the width of the columns in a column series.

Note that if the series type is histogram, the default value is 1; otherwise, it is 0.7.

Defaults to null

columnWidthInPixel

any

To render the column series points with a specific column width in pixels.

Defaults to null

connector

any

Specifies the appearance of the line connecting adjacent points in waterfall charts.

cornerRadius

any

The cornerRadius property specifies the radius for the corners of the column series points to create a rounded appearance in the chart.

dashArray

any

Defines the pattern of dashes and gaps used to stroke the lines in Line type series.

Defaults to ”

dataSource

any

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

Defaults to ”

dragSettings

any

Customize the drag settings for the series with this property to configure drag behavior in the chart.

drawType

any

Specifies the type of series to be drawn in radar or polar charts. The available options are:

• ‘Line’ - Renders a line series.
• ‘Column’ - Renders a column series.
• ‘Area’ - Renders an area series.
• ‘Scatter’ - Renders a scatter series.
• ‘Spline’ - Renders a spline series.
• ‘StackingColumn’ - Renders a stacking column series.
• ‘StackingArea’ - Renders a stacking area series.
• ‘RangeColumn’ - Renders a range column series.
• ‘SplineArea’ - Renders a spline area series.

Defaults to ‘Line’

emptyPointSettings

any

Customization options for the appearance of empty points in the series. null or undefined values are considered empty points.

enableComplexProperty

any

This property is used to improve chart performance through data mapping for the series data source.

Defaults to false

enableSolidCandles

any

This property is applicable for the candle series. It enables or disables the visual comparison of the current values with previous values in stock charts.

Defaults to false

enableTooltip

any

Controls whether the tooltip for the chart series is enabled or disabled. Set to true to display tooltips on hover, or false to hide them.

Defaults to true

errorBar

any

Options for displaying and customizing error bars for individual points in a series.

fill

any

The fill color for the series, which accepts values in hex or rgba as a valid CSS color string. It also represents the color of the signal lines in technical indicators. For technical indicators, the default value is ‘blue’, and for series, it is null.

Defaults to null

groupName

any

Defines the name that specifies the chart series are mutually exclusive and can be overlaid. Series in the same group share the same baseline and location on the corresponding axis.

Defaults to ”

high

any

The data source field that contains the high value. It is applicable for both financial series and technical indicators.

Defaults to ”

intermediateSumIndexes

any

Defines the collection of indexes for the intermediate summary columns in waterfall charts.

Defaults to []

isClosed

any

Specifies whether to join the start and end points of a line/area series used in a polar/radar chart to form a closed path.

Defaults to true

legendImageUrl

any

The URL for the image to be displayed as a legend icon.

Note that legendShape must be set to Image.

Defaults to ”

legendShape

any

Specifies the shape of the legend icon for each series. Available shapes for legend:

• Circle - Renders a circular icon.
• Rectangle - Renders a rectangular icon.
• Triangle - Renders a triangular icon.
• Diamond - Renders a diamond-shaped icon.
• Cross - Renders a cross-shaped icon.
• HorizontalLine - Renders a horizontal line icon.
• VerticalLine - Renders a vertical line icon.
• Pentagon - Renders a pentagon-shaped icon.
• InvertedTriangle - Renders an inverted triangle-shaped icon.
• SeriesType - Uses the default icon shape based on the series type.
• Image - Renders a custom image for the legend icon.

Defaults to ‘SeriesType’

low

any

The data source field that contains the low value. It is applicable for both financial series and technical indicators.

Defaults to ”

marker

any

Options for displaying and customizing markers for individual points in a series.

maxRadius

any

Specifies the maximum radius for the data points in the series.

Defaults to 3

minRadius

any

Specifies the minimum radius for the data points in the series.

Defaults to 1

name

any

The name property allows setting a name for the series, which will be displayed in the legend, identifying different series in the chart, especially when multiple series are present.

Defaults to ”

negativeFillColor

any

Defines the visual representation of negative changes in waterfall charts.

Defaults to ‘#C64E4A’

noRisers

any

When set to true, the step series will be rendered without the vertical lines (risers) connecting the horizontal steps.

Note this property is only applicable to step series.

Defaults to false

nonHighlightStyle

any

The nonHighlightStyle property is used to specify custom CSS styles for the non-highlighted series or points.

Defaults to null

opacity

any

Sets the opacity of the series, with a value between 0 and 1 where 0 is fully transparent and 1 is fully opaque.

Defaults to 1

open

any

The data source field that contains the open value. It is applicable for both financial series and technical indicators.

Defaults to ”

paretoOptions

any

Options for customizing the Pareto line series, including its appearance and behavior in the chart.

pointColorMapping

any

The data source field that contains the color value of a point. It is applicable for series.

Defaults to ”

query

any

Specifies a query to select data from the data source. This property is applicable only when the data source is an ej.DataManager.

Defaults to ”

segmentAxis

any

Defines the axis along which the line series will be split.

segments

any

Specifies a collection of regions used to differentiate a line series.

selectionStyle

any

The selectionStyle property is used to specify custom CSS styles for the selected series or points.

Defaults to null

showMean

any

If set to true, the mean value for the box and whisker plot will be visible.

Defaults to true

showNearestTooltip

any

Enables or disables the display of tooltips for the nearest data point to the cursor for series.

Defaults to true

showNormalDistribution

any

Specifies whether to display the normal distribution curve for the histogram series.

Defaults to false

showOutliers

any

Specifies whether to display outliers in the Box and Whisker chart. If set to true, outliers will be displayed as individual points beyond the whiskers, representing data points that significantly differ from the rest of the dataset. If set to false, outliers will be hidden, and only the box, median, and whiskers will be rendered.

Outliers are typically used to identify extreme values in statistical data representation.

Defaults to true

size

any

The data source field that contains the size value for the y-axis.

Defaults to ”

splineType

any

Specifies the type of spline used for rendering. Available options include:

• Natural - Renders a natural spline.
• Cardinal - Renders a cardinal spline.
• Clamped - Renders a clamped spline.
• Monotonic - Renders a monotonic spline.

Defaults to ‘Natural’

stackingGroup

any

This property allows the grouping of series in stacked column and stacked bar charts. Any string value can be assigned to the stackingGroup property. Series with the same stackingGroup value will be grouped together in the chart.

Defaults to ”

step

any

The step property can be used to change the position of the steps in step line, step area, and step range area chart types.

• Left: Steps start from the left side of the 2nd point.
• Center: Steps start between the data points.
• Right: Steps start from the right side of the 1st point.

Defaults to ‘Left’

sumIndexes

any

Defines the collection of indexes for the overall summary columns in waterfall charts.

Defaults to []

summaryFillColor

any

Defines the visual representation of summaries in waterfall charts.

Defaults to ‘#4E81BC’

tooltipFormat

any

Use this property to define a custom format for how tooltips are displayed.

Defaults to ”

tooltipMappingName

any

The data source field that contains the value to be displayed in the tooltip.

Defaults to ”

trendlines

any

Defines the collection of trendlines used to predict the trend.

type

any

The type of the series determines the visual representation of the data. Available series types include:

• Line - Draws a line series.
• Column - Draws a column series.
• Area - Draws an area series.
• Bar - Draws a bar series.
• Histogram - Draws a histogram series.
• StackingColumn - Draws a stacking column series.
• StackingArea - Draws a stacking area series.
• StackingBar - Draws a stacking bar series.
• StepLine - Draws a step line series.
• StepArea - Draws a step area series.
• Scatter - Draws a scatter series.
• Spline - Draws a spline series.
• StackingColumn100 - Draws a 100% stacked column series.
• StackingBar100 - Draws a 100% stacked bar series.
• StackingArea100 - Draws a 100% stacked area series.
• RangeColumn - Draws a range column series.
• Hilo - Draws a Hilo series.
• HiloOpenClose - Draws a Hilo Open Close series.
• Waterfall - Draws a waterfall series.
• RangeArea - Draws a range area series.
• SplineRangeArea - Draws a spline range area series.
• Bubble - Draws a bubble series.
• Candle - Draws a candle series.
• Polar - Draws a polar series.
• Radar - Draws a radar series.
• BoxAndWhisker - Draws a box and whisker series.
• Pareto - Draws a Pareto series.

Defaults to ‘Line’

unSelectedStyle

any

The unSelectedStyle property is used to specify custom CSS styles for the deselected series or points.

Defaults to null

visible

any

If set to true, the series will be visible. If set to false, the series will be hidden.

Defaults to true

volume

any

Defines the data source field that contains the volume value in candle charts. It is applicable for both financial series and technical indicators.

Defaults to ”

width

any

The stroke width for the series, applicable only for Line type series. It also represents the stroke width of the signal lines in technical indicators.

Defaults to 1

xAxisName

any

The name of the horizontal axis associated with the series. It requires axes of the chart. It is applicable for series and technical indicators.

Defaults to null

xName

any

The data source field that contains the x value. It is applicable to both series and technical indicators.

Defaults to ”

yAxisName

any

The name of the vertical axis associated with the series. It requires axes of the chart. It is applicable for series and technical indicators.

Defaults to null

yName

any

The data source field that contains the y value.

Defaults to ”

zOrder

any

The z-order of the series, which controls the stack order of the series. Higher values are drawn on top of lower values.

Defaults to 0