Element: <oj-chart>

Styling

CSS Variables

See JET CSS Variables for additional details.

Name	Type	Description
--oj-chart-axis-title-text-color	<color>	Chart axis title text color
--oj-chart-axis-tick-label-text-color	<color>	Chart axis tick label text color
--oj-chart-animation-rising-icon-color	<color>	Chart rising animation icon color
--oj-chart-animation-falling-icon-color	<color>	Chart falling animation icon color
--oj-chart-animation-marker-color	<color>	Chart animation marker color
--oj-chart-data-cursor-line-color	<color>	Chart data cursor line color

Polar chart

Name	Type	Description
--oj-chart-polar-axis-tick-label-inside-bg-color	<color>	Polar chart inside tick label background color
--oj-chart-polar-axis-tick-label-outside-bg-color	<color>	Polar chart outside tick label background color

Stock Chart

Name	Type	Description
--oj-chart-stock-falling-bg-color	<color>	Stock chart falling stock background color
--oj-chart-stock-range-bg-color	<color>	Stock chart stock range background color
--oj-chart-stock-rising-bg-color	<color>	Stock chart rising stock background color

Slots

JET components that allow child content support slots. Please see the slots section of the JET component overview doc for more information on allowed slot content and slot types.

contextMenu

The contextMenu slot is set on the oj-menu within this element. This is used to designate the JET Menu that this component should launch as a context menu on right-click, Shift-F10, Press & Hold, or component-specific gesture. If specified, the browser's native context menu will be replaced by the JET Menu specified in this slot.

The application can register a listener for the Menu's ojBeforeOpen event. The listener can cancel the launch via event.preventDefault(), or it can customize the menu contents by editing the menu DOM directly, and then calling refresh() on the Menu.

To help determine whether it's appropriate to cancel the launch or customize the menu, the ojBeforeOpen listener can use component API's to determine which table cell, chart item, etc., is the target of the context menu. See the JSDoc of the individual components for details.

Keep in mind that any such logic must work whether the context menu was launched via right-click, Shift-F10, Press & Hold, or component-specific touch gesture.

groupTemplate

The groupTemplate slot is used to specify the template for generating the group properties of the chart. The slot content must be a single <template> element. The content of the template should only be one <oj-chart-group> element. See the oj-chart-group doc for more details.

When the template is executed for each group, it will have access to the chart's binding context containing the following properties:

• $current - an object that contains information for the current item. (See oj.ojChart.GroupTemplateContext or the table below for a list of properties available on $current)
• alias - if as attribute was specified, the value will be used to provide an application-named alias for $current.

Properties of $current:

Name	Type	Description
componentElement	Element	The <oj-chart> custom element Deprecated: Since Description 16.0.0 The componentElement property is deprecated. This shouldn't be needed, as the component template with access to this context is unique to the component.
depth	number	The depth of the group. The depth of the outermost group under the invisible root is 1.
ids	Array.<string>	An array of group IDs, from the outermost group to the current group. For non-hierarchical group, the array will contain only one id.
index	number	The group index
items	Array.<Object>	The array of objects which are chart items that belong to this group. The objects will have the following properties: Properties Name Type Description data D The data object for the item index number The zero-based index of the item key any The key of the current item
leaf	boolean	True if the group is a leaf group.

itemTemplate

The itemTemplate slot is used to specify the template for creating each item of the chart. The slot content must be a <template> element. The content of the template should only be one <oj-chart-item> element. See the oj-chart-item doc for more details. A series-id and group-id must be specified.

When the template is executed for each item, it will have access to the chart's binding context containing the following properties:

• $current - an object that contains information for the current item. (See oj.ojChart.ItemTemplateContext or the table below for a list of properties available on $current)
• alias - if as attribute was specified, the value will be used to provide an application-named alias for $current.

Properties of $current:

Name	Type	Description
componentElement	Element	The <oj-chart> custom element Deprecated: Since Description 16.0.0 The componentElement property is deprecated. This shouldn't be needed, as the component template with access to this context is unique to the component.
data	D	The data object for the current item
index	number	The zero-based index of the current item
key	K	The key of the current item

pieCenterTemplate

The pieCenterTemplate slot is used to specify custom center content for a pie chart. The slot content must be a single <template> element. This slot takes precedence over the pieCenter.renderer property if specified.

When the template is executed, the component's binding context is extended with the following properties:

• $current - an object that contains information for the pie center. (See oj.ojChart.PieCenterContext or the table below for a list of properties available on $current)

Properties of $current:

Name	Type	Description
componentElement	Element	The chart element. Deprecated: Since Description 16.0.0 The componentElement property is deprecated. This shouldn't be needed, as the component template with access to this context is unique to the component.
innerBounds	Object	Object containing (x, y, width, height) of the rectangle inscribed in the center area. The x and y coordinates are relative to the top, left corner of the element. Properties Name Type Description height number The height of the rectangle inscribed in the center area. width number The width of the rectangle inscribed in the center area. x number The x coordinate of the rectangle inscribed in the center area, relative to the top, left corner of the element. y number The y coordinate of the rectangle inscribed in the center area, relative to the top, left corner of the element.
label	string	The pieCenter label.
labelStyle	Partial<CSSStyleDeclaration>=	The CSS style object defining the style of the label. The following style properties are supported: color, cursor, fontFamily, fontSize, fontStyle, fontWeight, textDecoration.
outerBounds	Object	Object containing (x, y, width, height) of the rectangle circumscribing the center area. The x and y coordinates are relative to the top, left corner of the element. Properties Name Type Description height number The height of the rectangle circumscribing the center area. width number The width of the rectangle circumscribing the center area. x number The x coordinate of the rectangle circumscribing the center area, relative to the top, left corner of the element. y number The y coordinate of the rectangle circumscribing the center area, relative to the top, left corner of the element.
totalValue	number	The total of all values in the pie chart.

seriesTemplate

The seriesTemplate slot is used to specify the template for generating the series properties of the chart. The slot content must be a single <template> element. The content of the template should only be one <oj-chart-series> element.See the oj-chart-series doc for more details.

When the template is executed for each series, it will have access to the chart's binding context containing the following properties:

• $current - an object that contains information for the current item. (See oj.ojChart.SeriesTemplateContext or the table below for a list of properties available on $current)
• alias - if as attribute was specified, the value will be used to provide an application-named alias for $current.

Properties of $current:

Name	Type	Description
componentElement	Element	The <oj-chart> custom element Deprecated: Since Description 16.0.0 The componentElement property is deprecated. This shouldn't be needed, as the component template with access to this context is unique to the component.
id	string	The series id
index	number	The series index
items	Array.<Object>	The array of objects which are chart items that belong to this series. The objects will have the following properties Properties Name Type Description data D The data object for the item index number The zero-based index of the item key any The key of the current item

tooltipTemplate

The tooltipTemplate slot is used to specify custom tooltip content. The slot content must be a single <template> element. This slot takes precedence over the tooltip.renderer property if specified.

When the template is executed, the component's binding context is extended with the following properties:

• $current - an object that contains information for the current item. (See oj.ojChart.TooltipContext or the table below for a list of properties available on $current)

Properties of $current:

Name	Type	Description
close	number	The close value of the hovered stock chart item.
color	string	The color of the hovered item.
componentElement	Element	The chart element. Deprecated: Since Description 16.0.0 The componentElement property is deprecated. This shouldn't be needed, as the component template with access to this context is unique to the component.
data	ojChart.Item<K, Array<oj.ojChart.Item<any, null>> | Array<number> | null> | number | null oj.ojChart.Item.<K, I> | Array<number> | null> | number | null	The data object of the hovered item. For nested items, it will be an array containing the parent item data and nested item data.
group	string | Array.<string>	The ids or an array of ids of the group(s) the hovered item belongs to. For hierarchical groups, it will be an array of outermost to innermost group ids.
groupData	Array.<oj.ojChart.Group> | null	An array of data for the group the hovered item belongs to. For hierarchical groups, it will be an array of outermost to innermost group data related to the hovered item.
high	number	The high value of the data item present in range bar/area, stock candlestick, or box plot item.
id	any	The id of the hovered item.
itemData	D	The row data object for the hovered item. This will only be set if a DataProvider is being used.
label	string	The data label of the hovered item.
low	number	The low value of the data item present in range bar/area, stock candlestick, or box plot item.
open	number	The open value of the hovered stock chart item.
parentElement	Element	The tooltip element. This can be used to change the tooltip border or background color.
q1	number	The first quartile value of the hovered the box plot item.
q2	number	The second quartile (median) value of the hovered box plot item.
q3	number	The third quartile value of the hovered box plot item.
series	string	The id of the series the hovered item belongs to.
seriesData	oj.ojChart.Series.<K, I> | null	The data for the series the hovered item belongs to.
targetValue	number	The target value of the hovered funnel item.
totalValue	number	The total of all values in the chart. This will only be included for pie charts.
value	number	The value of the hovered item.
volume	number	The volume value of the hovered stock chart item.
x	number | string	The x value of the hovered item.
y	number	The y value of the hovered item.
z	number	The z value of the hovered item.

Attributes

animation-on-data-change :"slideToLeft"|"slideToRight"|"auto"|"none"

Defines the animation that is applied on data changes. Animation is automatically disabled when there are a large number of data items.

Supported Values:

Value	Description
auto	Default non-sliding animation.
none	No animation is applied on data change.
slideToLeft	Data changes will have a sliding animation to the left.
slideToRight	Data changes will have a sliding animation to the right.

Default Value:

• "none"

Names

Item	Name
Property	animationOnDataChange
Property change event	animationOnDataChangeChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-animation-on-data-change-changed

animation-on-display :"alphaFade"|"zoom"|"auto"|"none"

Defines the animation that is shown on initial display. Animation is automatically disabled when there are a large number of data items.

Supported Values:

Value	Description
alphaFade	Chart uses an alpha fade animation on initial display.
auto	Default animation on initial display.
none	No animation is applied on initial display.
zoom	Chart zooms into view on initial display.

Default Value:

• "none"

Names

Item	Name
Property	animationOnDisplay
Property change event	animationOnDisplayChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-animation-on-display-changed

as :string

An alias for the $current context variable when referenced inside the item, series, or group templates when using a DataProvider.

Deprecated:

Since	Description
6.2.0	Set the alias directly on the template element using the data-oj-as attribute instead.

Default Value:

• ""

Names

Item	Name
Property	as
Property change event	asChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-as-changed

combo-series-order :"data"|"seriesType"

Specifies the series render order for combo charts. If set to 'seriesType', the combo chart rendering order between series types will follow a set z-ordering aimed at minimizing overlap: area and line with area series type in the background, then bar series, then line series in the foreground. Series within the same type are rendered in the order presented in the data. If set to 'data', series z-order follows the series order in the data. Note that, series-comparator can be used to change the series order in the data.

Supported Values:

Value	Description
data	Series z order follows the series order in the data.
seriesType	The combo chart rendering order between series types will follow a set z-ordering aimed at minimizing overlap: area and line with area series type in the background, then bar series, then line series in the foreground. Series within the same type are rendered in the order presented in the data.

Default Value:

• "seriesType"

Names

Item	Name
Property	comboSeriesOrder
Property change event	comboSeriesOrderChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-combo-series-order-changed

coordinate-system :"polar"|"cartesian"

The coordinate system of the chart. Only applies to bar, line, area, combo, scatter, and bubble charts.

Supported Values:

Value	Description
cartesian	Cartesian coordinate system is used to plot the chart.
polar	Polar coordinate system is used to plot the chart.

Default Value:

• "cartesian"

Names

Item	Name
Property	coordinateSystem
Property change event	coordinateSystemChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-coordinate-system-changed

data :(DataProvider.<K, D>|null)

An object defining the series and groups, when using a DataProvider to provide data to the chart. The DataProvider can either have an arbitrary data shape, in which case an element must be specified in the itemTemplate slot or it can have ojChart.DataItem as its data shape, in which case no template is required.

Default Value:

• null

Names

Item	Name
Property	data
Property change event	dataChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-data-changed

data-cursor :"off"|"on"|"auto"

Defines whether the data cursor is enabled. If set to "auto", the data cursor is shown only for line or area charts on touch devices. The data cursor is not shown when the tooltip is null and it is not supported on polar charts.

Supported Values:

Value	Description
auto	The data cursor is shown only for line or area charts on touch devices.
off	Data cursor is disabled.
on	Data cursor is enabled. Not supported by polar charts.

Default Value:

• "auto"

Names

Item	Name
Property	dataCursor
Property change event	dataCursorChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-data-cursor-changed

data-cursor-behavior :"smooth"|"snap"|"auto"

Defines the behavior of the data cursor when moving between data items.

Supported Values:

Value	Description
auto	The data cursor exhibits the snap behavior except for line and area chart which exhibit the smooth behavior.
smooth	Data cursor follows the mouse cursor smoothly between data items.
snap	Data cursor snaps between data items.

Default Value:

• "auto"

Names

Item	Name
Property	dataCursorBehavior
Property change event	dataCursorBehaviorChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-data-cursor-behavior-changed

data-cursor-position :oj.ojChart.DataCursorPosition

Specifies the position of the data cursor. Used for synchronizing data cursors across multiple charts. Null if the data cursor is not displayed.

Supports writeback:

• true

Names

Item	Name
Property	dataCursorPosition
Property change event	dataCursorPositionChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-data-cursor-position-changed

(nullable) data-label :((context: ojChart.DataLabelContext<K, D, I>) => (Array<string>|string|Array<number>|number))

A function that returns a custom data label. The function takes a DataLabelContext argument, provided by the chart. The function may return a number or a string or in the case of range charts, an array of numbers or strings. If any label is a number, it will be formatted by the valueFormat of the type 'label' before being used as a label.

Default Value:

• null

Names

Item	Name
Property	dataLabel
Property change event	dataLabelChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-data-label-changed

dnd :Object

Provides support for HTML5 Drag and Drop events. Please refer to third party documentation on HTML5 Drag and Drop to learn how to use it.

Names

Item	Name
Property	dnd
Property change event	dndChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-dnd-changed

dnd.drag :oj.ojChart.DndDragConfigs.<K, D, I>

An object that describes drag functionality.

Names

Item	Name
Property	dnd.drag

dnd.drop :oj.ojChart.DndDropConfigs

An object that describes drop functionality.

Names

Item	Name
Property	dnd.drop

drag-mode :"pan"|"zoom"|"select"|"off"|"user"

The action that is performed when a drag occurs on the chart. Pan and marquee zoom are only available if zoom and scroll is turned on. Marquee select is only available if multiple selection is turned on. If the value is set to "user" and multiple actions are available, buttons will be displayed on the plot area to let users switch between modes.

Supported Values:

Value	Description
off	Drag is disabled.
pan	Pan action is performed when a drag occurs on the chart.
select	Marquee selection is performed when a drag occurs on the chart.
user	User can switch between different mode. Buttons will be displayed on the plot area to let users switch between modes.
zoom	Zoom action is performed when a drag occurs on the chart.

Default Value:

• "user"

Names

Item	Name
Property	dragMode
Property change event	dragModeChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-drag-mode-changed

drilling :"on"|"seriesOnly"|"groupsOnly"|"off"

Whether drilling is enabled. Drillable objects will show a pointer cursor on hover and fire an ojDrill event on click (double click if selection is enabled). Use "on" to enable drilling for all series objects (legend items), group objects (x-axis labels), and data items. Use "seriesOnly" or "groupsOnly" to enable drilling for series objects or group objects only. To enable or disable drilling on individual series, group, or data item, use the drilling attribute in each series, group, or data item. See multiSeriesDrilling documentation for details on drilling on the legend item for Other.

Supported Values:

Value	Description
groupsOnly	Drilling is enabled only on axis labels.
off	Drilling is not enabled.
on	Drilling is enabled on data items, axis labels and legend items.
seriesOnly	Drilling is enabled only on legend items. Use multiSeriesDrilling attribute to enable drilling on the legend item for Other.

Default Value:

• "off"

Names

Item	Name
Property	drilling
Property change event	drillingChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-drilling-changed

(nullable) group-comparator :((context1: ojChart.GroupTemplateContext<D>, context2: oj.ojChart.GroupTemplateContext<D>) => number)

A comparator function that determines the ordering of the chart groups when using a DataProvider. If undefined, the group will follow the order in which they are found in the data. The group objects will have the same properties as the context for groupTemplate's $current.

Default Value:

• null

Names

Item	Name
Property	groupComparator
Property change event	groupComparatorChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-group-comparator-changed

groups :(Array.<string>|Promise.<Array.<string>>|Array.<oj.ojChart.Group>|Promise.<Array.<oj.ojChart.Group>>|null)

An array of strings identifying the group labels, or an array of Group objects specifying group labels and styles. Also accepts a Promise for deferred data rendering.

Default Value:

• null

Names

Item	Name
Property	groups
Property change event	groupsChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-groups-changed

hidden-categories :Array.<string>

An array of category strings used for filtering. Series or data items with any category matching an item in this array will be filtered.

Default Value:

• []

Supports writeback:

• true

Names

Item	Name
Property	hiddenCategories
Property change event	hiddenCategoriesChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-hidden-categories-changed

hide-and-show-behavior :"withRescale"|"withoutRescale"|"none"

Defines the hide and show behavior that is performed when clicking on a legend item. When data items are hidden, the y axes can be optionally rescaled to fit to the remaining data.

Supported Values:

Value	Description
none	Hide and show behavior is disabled.
withRescale	Y axes rescales when data items are hidden or showed by clicking on a legend item.
withoutRescale	Y axes does not rescale when data items are hidden or showed by clicking on a legend item.

Default Value:

• "none"

Names

Item	Name
Property	hideAndShowBehavior
Property change event	hideAndShowBehaviorChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-hide-and-show-behavior-changed

highlight-match :"any"|"all"

The matching condition for the highlightedCategories property. By default, highlightMatch is 'all' and only items whose categories match all of the values specified in the highlightedCategories array will be highlighted. If highlightMatch is 'any', then items that match at least one of the highlightedCategories values will be highlighted.

Supported Values:

Value	Description
all	Only data items that match all of the highlightedCategories values will be highlighted.
any	Only data items that match at least one of the highlightedCategories values will be highlighted.

Default Value:

• "all"

Names

Item	Name
Property	highlightMatch
Property change event	highlightMatchChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-highlight-match-changed

highlighted-categories :Array.<string>

An array of category strings used for highlighting. Series or data items matching categories in this array will be highlighted.

Default Value:

• []

Supports writeback:

• true

Names

Item	Name
Property	highlightedCategories
Property change event	highlightedCategoriesChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-highlighted-categories-changed

hover-behavior :"dim"|"none"

Defines the behavior applied when hovering over data items.

Supported Values:

Value	Description
dim	Dimming hover behavior is applied.
none	No hover behavior will be applied.

Default Value:

• "none"

Names

Item	Name
Property	hoverBehavior
Property change event	hoverBehaviorChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-hover-behavior-changed

initial-zooming :"first"|"last"|"none"

Whether automatic initial zooming is enabled. The valid values are "first" to initially zoom to the first data points (after the viewportMin) that can fit in the plot area, "last" to initially zoom to the last data points (before the viewportMax), and "none" to disable initial zooming. Only applies to bar, line, area, and combo charts with zoomAndScroll turned on.

Supported Values:

Value	Description
first	Zoom to first data points (after the viewportMin) that can fit in the plot area on initial render.
last	Zoom to last data points (before the viewportMax) that can fit in the plot area on initial render.
none	No initial zooming.

Default Value:

• "none"

Names

Item	Name
Property	initialZooming
Property change event	initialZoomingChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-initial-zooming-changed

legend :oj.ojChart.Legend

An object defining the style, positioning, and behavior of the legend.

Names

Item	Name
Property	legend
Property change event	legendChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-legend-changed

multi-series-drilling :"on"|"off"

Specifies whether drilling on chart objects representing multiple series (e.g. other slice and legend item in pie charts) is enabled or not. Multiseries drill event is fired from the other slice and legend item of pieChart.

Supported Values:

Value	Description
off	Drill action for Other slice and legend item in pie chart will be disabled.
on	Drill action for Other slice and legend item in pie chart will be enabled.

Default Value:

• 'off'

Names

Item	Name
Property	multiSeriesDrilling
Property change event	multiSeriesDrillingChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-multi-series-drilling-changed

orientation :"horizontal"|"vertical"

The chart orientation. Only applies to bar, line, area, combo, box plot, and funnel charts.

Supported Values:

Value	Description
horizontal	Chart will be horizontally oriented.
vertical	Chart will be vertically oriented.

Default Value:

• "vertical"

Names

Item	Name
Property	orientation
Property change event	orientationChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-orientation-changed

other-threshold :number

Specifies the fraction of the whole pie under which a slice would be aggregated into an "Other" slice. Valid values range from 0 (default) to 1. For example, a value of 0.1 would cause all slices which are less than 10% of the pie to be aggregated into the "Other" slice. Only applies to pie chart.

Default Value:

• 0

Names

Item	Name
Property	otherThreshold
Property change event	otherThresholdChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-other-threshold-changed

overview :oj.ojChart.Overview.<C>

An object defining the overview scrollbar. Only applies if zoomAndScroll is not off. Currently only supported for vertical bar, line, area, stock, and combo charts.

Names

Item	Name
Property	overview
Property change event	overviewChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-overview-changed

pie-center :oj.ojChart.PieCenter

An object defining the center content of a pie chart. Either a label can be displayed at the center of the pie chart or custom HTML content.

Names

Item	Name
Property	pieCenter
Property change event	pieCenterChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-pie-center-changed

plot-area :oj.ojChart.PlotArea

An object defining the style of the plot area.

Names

Item	Name
Property	plotArea
Property change event	plotAreaChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-plot-area-changed

polar-grid-shape :"polygon"|"circle"

Defines whether the grid shape of the polar chart is circle or polygon. Only applies to polar line and area charts.

Supported Values:

Value	Description
circle	The grid shape of polar chart will be circular.
polygon	The grid shape of polar chart will be a polygonal with number of side of the polygon equal to number of groups in chart.

Default Value:

• "circle"

Names

Item	Name
Property	polarGridShape
Property change event	polarGridShapeChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-polar-grid-shape-changed

selection :Array<K>

An array used to define the ids of the initially selected objects. When the selection is changed, the event.detail of the selectionChanged event will contain the following additional properties:

Name	Type	Description
selectionData	Object	an array containing objects describing the selected data items Properties Name Type Description data object the data of the item, if one was specified itemData object the row data of the item, if one was specified. This will only be set if a DataProvider is used. groupData Array the group data of the item seriesData object the series data of the item
endGroup	string	the end group of a marquee selection on a chart with categorical axis
startGroup	string	the start group of a marquee selection on a chart with categorical axis
xMax	number	the maximum x value of a marquee selection
xMin	number	the minimum x value of a marquee selection
yMax	number	the maximum y value of a marquee selection
yMin	number	the minimum y value of a marquee selection

Default Value:

• []

Supports writeback:

• true

Names

Item	Name
Property	selection
Property change event	selectionChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-selection-changed

selection-mode :"none"|"single"|"multiple"

The type of selection behavior that is enabled on the chart. This attribute controls the number of selections that can be made via selection gestures at any given time.

If single or multiple is specified, selection gestures will be enabled, and the chart's selection styling will be applied to all items specified by the selection attribute. If none is specified, selection gestures will be disabled, and the chart's selection styling will not be applied to any items specified by the selection attribute.

Changing the value of this attribute will not affect the value of the selection attribute.

Supported Values:

Value	Description
multiple	Multiple items can be selected at the same time.
none	Selection is disabled.
single	Only a single item can be selected at a time.

Default Value:

• "none"

Names

Item	Name
Property	selectionMode
Property change event	selectionModeChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-selection-mode-changed

series :(Array.<oj.ojChart.Series>|Promise.<Array.<oj.ojChart.Series>>|null)

An array of Series objects, used to define series labels and override series styles. Only a single series is supported for stock charts. Also accepts a Promise for deferred data rendering.

Default Value:

• null

Names

Item	Name
Property	series
Property change event	seriesChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-series-changed

(nullable) series-comparator :((context1: ojChart.SeriesTemplateContext<D>, context2: oj.ojChart.SeriesTemplateContext<D>) => number)

A comparator function that determines the ordering of the chart series when using a DataProvider. If undefined, the series will follow the order in which they are found in the data. The series objects will have the same properties as the context for seriesTemplate's $current.

Default Value:

• null

Names

Item	Name
Property	seriesComparator
Property change event	seriesComparatorChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-series-comparator-changed

sorting :"ascending"|"descending"|"off"

Specifies the sorting of the data. It should only be used for pie charts, bar/line/area charts with one series, or stacked bar/area charts. Sorting will not apply when using a hierarchical group axis.

Supported Values:

Value	Description
ascending	Data items are sorted in ascending order.
descending	Data items are sorted in descending order.
off	Groups are sorted in the order they are discovered in the data.

Default Value:

• "off"

Names

Item	Name
Property	sorting
Property change event	sortingChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-sorting-changed

split-dual-y :"on"|"off"|"auto"

Defines whether the plot area is split into two sections, so that sets of data assigned to the different Y-axes appear in different parts of the plot area. Stock charts do not support "off".

Supported Values:

Value	Description
auto	Plot area will not be split into two sections except for the stock charts.
off	Plot area will not be split into two sections.
on	Plot area will be split into two sections corresponding to datasets assigned to the different Y-axes.

Default Value:

• "auto"

Names

Item	Name
Property	splitDualY
Property change event	splitDualYChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-split-dual-y-changed

splitter-position :number

In a split dual-Y chart, specifies the fraction of the space that is given to the Y-axis subchart. Valid values are numbers from 0 to 1.

Default Value:

• 0.5

Names

Item	Name
Property	splitterPosition
Property change event	splitterPositionChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-splitter-position-changed

stack :"on"|"off"

Defines whether the data items are stacked. Only applies to bar, line, area, and combo charts. Does not apply to range series.

Supported Values:

Value	Description
off	Data items will not be stacked.
on	Data items belonging to same group will be stacked.

Default Value:

• "off"

Names

Item	Name
Property	stack
Property change event	stackChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-stack-changed

stack-label :"on"|"off"

Defines whether the total values of stacked data items should be displayed. Only applies to bar charts. It can be formatted by the valueFormat of the type 'label'.

Supported Values:

Value	Description
off	The total value of the stacked data items will not be displayed.
on	The total value of the stacked data items will be displayed.

Default Value:

• "off"

Names

Item	Name
Property	stackLabel
Property change event	stackLabelChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-stack-label-changed

stack-label-provider :((context: ojChart.StackLabelContext<K, D, I>) => (string))

A function that returns a custom data label for stacks in bar charts with stacking enabled. The function takes a StackLabelContext argument, provided by the chart. The function returns a string.

Default Value:

• null

Names

Item	Name
Property	stackLabelProvider
Property change event	stackLabelProviderChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-stack-label-provider-changed

style-defaults :oj.ojChart.StyleDefaults

An object defining the default styles for series colors, marker shapes, and other style attributes. Properties specified on this object may be overridden by specifications on the data object.

Names

Item	Name
Property	styleDefaults
Property change event	styleDefaultsChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-style-defaults-changed

time-axis-type :"enabled"|"mixedFrequency"|"skipGaps"|"disabled"|"auto"

The type of time axis to display in the chart. Time axis is only supported for Cartesian bar, line, area, stock, box plot, and combo charts. If the value is "enabled" or "skipGaps", the time values must be provided through the "group-id" attribute of the oj-chart-item element. In this case stacking is supported. If the value is "skipGaps", the groups will be rendered at a regular interval regardless of any time gaps that may exist in the data. If the value is "mixedFrequency", the time values must be provided through the "x" attribute of the oj-chart-item element. In this case stacking is not supported. The time values provided through "group-id" or "x" attribute of the oj-chart-item must be an ISO string.

Supported Values:

Value	Description
auto	Time axis is disabled unless it is a stock chart, for which the timeAxisType is mixedFrequency.
disabled	Time axis is disabled.
enabled	The time value for each data item is passed using the group-id attribute of oj-chart-item. The time intervals do not have to be uniform. Data items from the same group should have the same time value.
mixedFrequency	The time value for each data item is passed using the x attribute of oj-chart-item. The time intervals do not have to be uniform. Data item from the same group can have different time values.
skipGaps	The time value for each data item is passed using the group-id attribute of oj-chart-item. The times will always be drawn uniformly ignoring gaps. Data items from the same group should have the same time value.

Default Value:

• "auto"

Names

Item	Name
Property	timeAxisType
Property change event	timeAxisTypeChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-time-axis-type-changed

tooltip :Object

An object containing an optional callback function for tooltip customization.

Names

Item	Name
Property	tooltip
Property change event	tooltipChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-tooltip-changed

(nullable) tooltip.renderer :oj.dvtBaseComponent.PreventableDOMRendererFunction.<oj.ojChart.TooltipRendererContext.<K, D, I>>

A function that returns a custom tooltip for chart. The function takes a TooltipRendererContext argument, provided by the chart, and returns an object with the following properties:

• insert: HTMLElement | string - An HTML element, which will be appended to the tooltip, or a tooltip string.
• preventDefault: true - Indicates that the tooltip should not be displayed. It is not necessary to return {preventDefault:false} to display tooltip, since this is a default behavior.

Default Value:

• null

Names

Item	Name
Property	tooltip.renderer

touch-response :"touchStart"|"auto"

Data visualizations require a press and hold delay before triggering tooltips, marquee selection, and rollover effects on mobile devices to avoid interfering with page panning, but these hold delays can make applications seem slower and less responsive.For a better user experience, the application can remove the touch and hold delay when data visualizations are used within a non scrolling container or if there is sufficient space outside of the visualization for panning. If touchResponse is touchStart the element will instantly trigger the touch gesture and consume the page pan events if the element does not require an internal feature that requires a touch start gesture like panning, zooming, or when marquee selection is initiated. If touchResponse is auto, the element will behave like touchStart if it determines that it is not rendered within scrolling content and if panning is not available for those elements that support the feature.

Supported Values:

Value	Description
auto	Chart will behave like touchStart if it determines that it is not rendered within scrolling content and if panning is not available for those elements that support the feature.
touchStart	Chart will instantly trigger the touch gesture and consume the page pan events if it does not require an internal feature that requires a touch start gesture like panning, zooming, or when marquee selection is initiated.

Default Value:

• "auto"

Names

Item	Name
Property	touchResponse
Property change event	touchResponseChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-touch-response-changed

track-resize :"on"|"off"

Defines whether the element will automatically render in response to changes in size. If set to off, then the application is responsible for calling refresh to render the element at the new size.

Supported Values:

Value
off
on

Default Value:

• "on"

Names

Item	Name
Property	trackResize
Property change event	trackResizeChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-track-resize-changed

translations :object|null

A collection of translated resources from the translation bundle, or null if this component has no resources. Resources may be accessed and overridden individually or collectively, as seen in the examples.

If the component does not contain any translatable resource, the default value of this attribute will be null. If not, an object containing all resources relevant to the component.

If this component has translations, their documentation immediately follows this doc entry.

Names

Item	Name
Property	translations
Property change event	translationsChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-translations-changed

(nullable) translations.accessible-contains-controls :string

Used to describe a container that contains controls.

See the translations attribute for usage examples.

Since:

• 13.0.0

Names

Item	Name
Property	translations.accessibleContainsControls

(nullable) translations.component-name :string

Used to describe the data visualization type for accessibility.

See the translations attribute for usage examples.

Default Value:

• "Chart"

Names

Item	Name
Property	translations.componentName

(nullable) translations.label-and-value :string

Used to display a label and its value.

See the translations attribute for usage examples.

Default Value:

• "{0}: {1}"

Names

Item	Name
Property	translations.labelAndValue

(nullable) translations.label-clear-selection :string

Text shown for clearing multiple selection on touch devices.

See the translations attribute for usage examples.

Default Value:

• "Clear Selection"

Names

Item	Name
Property	translations.labelClearSelection

(nullable) translations.label-close :string

Used for the close value in the tooltip for stock data.

See the translations attribute for usage examples.

Default Value:

• "Close"

Names

Item	Name
Property	translations.labelClose

(nullable) translations.label-count-with-total :string

Used to display a count out of a total.

See the translations attribute for usage examples.

Default Value:

• "{0} of {1}"

Names

Item	Name
Property	translations.labelCountWithTotal

(nullable) translations.label-data-visualization :string

Label for data visualizations used for accessibility.

See the translations attribute for usage examples.

Default Value:

• "Data Visualization"

Names

Item	Name
Property	translations.labelDataVisualization

(nullable) translations.label-date :string

Used for the date value in the tooltip, if a time axis is being used.

See the translations attribute for usage examples.

Default Value:

• "Value"

Names

Item	Name
Property	translations.labelDate

(nullable) translations.label-default-group-name :string

Used when the group names are not specified.

See the translations attribute for usage examples.

Default Value:

• "Group {0}"

Names

Item	Name
Property	translations.labelDefaultGroupName

(nullable) translations.label-group :string

Used for the default tooltip.

See the translations attribute for usage examples.

Default Value:

• "Group"

Names

Item	Name
Property	translations.labelGroup

(nullable) translations.label-high :string

>Used for the high value in the tooltip for stock and range data.

See the translations attribute for usage examples.

Default Value:

• "High"

Names

Item	Name
Property	translations.labelHigh

(nullable) translations.label-invalid-data :string

Text shown when the component receives invalid data.

See the translations attribute for usage examples.

Default Value:

• "Invalid data"

Names

Item	Name
Property	translations.labelInvalidData

(nullable) translations.label-low :string

Used for the low value in the tooltip for stock and range data.

See the translations attribute for usage examples.

Default Value:

• "Low"

Names

Item	Name
Property	translations.labelLow

(nullable) translations.label-no-data :string

Text shown when the component receives no data.

See the translations attribute for usage examples.

Default Value:

• "No data to display"

Names

Item	Name
Property	translations.labelNoData

(nullable) translations.label-open :string

Used for the open value in the tooltip for stock data.

See the translations attribute for usage examples.

Default Value:

• "Open"

Names

Item	Name
Property	translations.labelOpen

(nullable) translations.label-other :string

Used for the other series label which aggregates small data values.

See the translations attribute for usage examples.

Default Value:

• "Other"

Names

Item	Name
Property	translations.labelOther

(nullable) translations.label-percentage :string

Used for displaying the percentage in the tooltip.

See the translations attribute for usage examples.

Default Value:

• "Percentage"

Names

Item	Name
Property	translations.labelPercentage

(nullable) translations.label-q1 :string

Used for displaying the first quartile for box plots.

See the translations attribute for usage examples.

Default Value:

• "Q1"

Names

Item	Name
Property	translations.labelQ1

(nullable) translations.label-q2 :string

Used for displaying the second quartile (i.e. median) for box plots.

See the translations attribute for usage examples.

Default Value:

• "Q2"

Names

Item	Name
Property	translations.labelQ2

(nullable) translations.label-q3 :string

Used for displaying the third quartile for box plots.

See the translations attribute for usage examples.

Default Value:

• "Q3"

Names

Item	Name
Property	translations.labelQ3

(nullable) translations.label-series :string

Used for the default tooltip.

See the translations attribute for usage examples.

Default Value:

• "Series"

Names

Item	Name
Property	translations.labelSeries

(nullable) translations.label-target-value :string

Used for the funnel chart target value.

See the translations attribute for usage examples.

Default Value:

• "Target"

Names

Item	Name
Property	translations.labelTargetValue

(nullable) translations.label-value :string

Used for the data item value in the tooltip.

See the translations attribute for usage examples.

Default Value:

• "Value"

Names

Item	Name
Property	translations.labelValue

(nullable) translations.label-volume :string

Used for the volume value in the tooltip for stock data.

See the translations attribute for usage examples.

Default Value:

• "Volume"

Names

Item	Name
Property	translations.labelVolume

(nullable) translations.label-x :string

Used for the x value in the tooltip.

See the translations attribute for usage examples.

Default Value:

• "X"

Names

Item	Name
Property	translations.labelX

(nullable) translations.label-y :string

Used for the y value in the tooltip.

See the translations attribute for usage examples.

Default Value:

• "Y"

Names

Item	Name
Property	translations.labelY

(nullable) translations.label-z :string

Used for the z value in the tooltip.

See the translations attribute for usage examples.

Default Value:

• "Z"

Names

Item	Name
Property	translations.labelZ

(nullable) translations.state-collapsed :string

Used to describe the collapsed state for accessibility.

See the translations attribute for usage examples.

Default Value:

• "Collapsed"

Names

Item	Name
Property	translations.stateCollapsed

(nullable) translations.state-drillable :string

Used to describe a drillable object for accessibility.

See the translations attribute for usage examples.

Default Value:

• "Drillable"

Names

Item	Name
Property	translations.stateDrillable

(nullable) translations.state-expanded :string

Used to describe the expanded state for accessibility.

See the translations attribute for usage examples.

Default Value:

• "Expanded"

Names

Item	Name
Property	translations.stateExpanded

(nullable) translations.state-hidden :string

Used to describe the hidden state for accessibility.

See the translations attribute for usage examples.

Default Value:

• "Hidden"

Names

Item	Name
Property	translations.stateHidden

(nullable) translations.state-isolated :string

Used to describe the isolated state for accessibility.

See the translations attribute for usage examples.

Default Value:

• "Isolated"

Names

Item	Name
Property	translations.stateIsolated

(nullable) translations.state-maximized :string

Used to describe the maximized state for accessibility.

See the translations attribute for usage examples.

Default Value:

• "Maximized"

Names

Item	Name
Property	translations.stateMaximized

(nullable) translations.state-minimized :string

Used to describe the minimized state for accessibility.

See the translations attribute for usage examples.

Default Value:

• "Minimized"

Names

Item	Name
Property	translations.stateMinimized

(nullable) translations.state-selected :string

Used to describe the selected state for accessibility.

See the translations attribute for usage examples.

Default Value:

• "Selected"

Names

Item	Name
Property	translations.stateSelected

(nullable) translations.state-unselected :string

Used to describe the unselected state for accessibility.

See the translations attribute for usage examples.

Default Value:

• "Unselected"

Names

Item	Name
Property	translations.stateUnselected

(nullable) translations.state-visible :string

Used to describe the visible state for accessibility.

See the translations attribute for usage examples.

Default Value:

• "Visible"

Names

Item	Name
Property	translations.stateVisible

(nullable) translations.tooltip-pan :string

Used for the pan tooltip.

See the translations attribute for usage examples.

Default Value:

• "Pan"

Names

Item	Name
Property	translations.tooltipPan

(nullable) translations.tooltip-select :string

Used for the marquee select tooltip.

See the translations attribute for usage examples.

Default Value:

• "Marquee select"

Names

Item	Name
Property	translations.tooltipSelect

(nullable) translations.tooltip-zoom :string

Used for the marquee zoom tooltip.

See the translations attribute for usage examples.

Default Value:

• "Marquee zoom"

Names

Item	Name
Property	translations.tooltipZoom

type :oj.ojChart.ChartType

The chart type. By default, the first three series of "combo" chart are assigned 'bar', 'line', and 'area' type respectively and then the type repeats, i.e sucessive series will be of types 'bar', 'line', and 'area' and so on. To customize individual series, see oj-chart-series for more details.

Default Value:

• "bar"

Names

Item	Name
Property	type
Property change event	typeChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-type-changed

value-formats :oj.ojChart.ValueFormats

An object specifying value formatting and tooltip behavior, whose keys generally correspond to the attribute names on the data items.

Names

Item	Name
Property	valueFormats
Property change event	valueFormatsChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-value-formats-changed

x-axis :oj.ojChart.XAxis

An object defining properties for the axis, tick marks, tick labels, and axis titles.

Names

Item	Name
Property	xAxis
Property change event	xAxisChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-x-axis-changed

y2-axis :oj.ojChart.Y2Axis

An object defining properties for the axis, tick marks, tick labels, and axis titles. Y2 axis is only supported for Cartesian bar, line, area, and combo charts.

Names

Item	Name
Property	y2Axis
Property change event	y2AxisChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-y2-axis-changed

y-axis :oj.ojChart.YAxis

An object defining properties for the axis, tick marks, tick labels, and axis titles.

Names

Item	Name
Property	yAxis
Property change event	yAxisChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-y-axis-changed

zoom-and-scroll :"delayedScrollOnly"|"liveScrollOnly"|"delayed"|"live"|"off"

Specifies the zoom and scroll behavior of the chart. "Live" behavior means that the chart will be updated continuously as it is being manipulated, while "delayed" means that the update will wait until the zoom/scroll action is done. While "live" zoom and scroll provides the best end user experience, no guarantess are made about the rendering performance or usability for large data sets or slow client environments. If performance is an issue, "delayed" zoom and scroll should be used instead.

Supported Values:

Value	Description
delayed	When zooming or scrolling, chart will wait to update until the zoom/scroll action is done.
delayedScrollOnly	Zooming is disabled and chart will wait to update until scroll action is done.
live	When zooming or scrolling, chart will be updated continuously as it is being manipulated.
liveScrollOnly	Zooming is disabled and chart is updated continuously when scrolled.
off	Zoom and scroll will be disabled.

Default Value:

• "off"

Names

Item	Name
Property	zoomAndScroll
Property change event	zoomAndScrollChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-zoom-and-scroll-changed

zoom-direction :"x"|"y"|"auto"

Specifies the zoom direction of bubble and scatter charts. "Auto" zooms in both x and y direction. Use "x" or "y" for single direction zooming.

Supported Values:

Value	Description
auto	Chart will zoom in both x and y direction.
x	Chart will only zoom in x direction.
y	Chart will only zoom in y direction.

Default Value:

• "auto"

Names

Item	Name
Property	zoomDirection
Property change event	zoomDirectionChanged
Property change listener attribute (must be of type function, see Events and Listeners for additional information.)	on-zoom-direction-changed

Context Objects

Each context object contains, at minimum, a subId property, whose value is a string that identifies a particular DOM node in this element. It can have additional properties to further specify the desired node. See getContextByNode for more details.

Following are the valid subIds:

oj-chart-axis-title

Context for the title of the specified axis.

Properties:

Name	Type	Description
axis	string	xAxis, yAxis, or y2Axis

oj-chart-group

Context for a categorical axis label that represents the group with the specified index.

Properties:

Name	Type	Description
indexPath	Array	The array of indices corresponding to the position of the group in the properties array.

oj-chart-item

Context for chart data items indexed by series and group indices.

Properties:

Name	Type
itemIndex	number
seriesIndex	number

oj-chart-pie-center-label

Context for the center label of a pie chart.

oj-chart-reference-object

Context for the reference object of the specified axis with the given index.

Properties:

Name	Type	Description
axis	string	xAxis, yAxis, or y2Axis
index	number	The index of the reference object for the specified axis.

oj-chart-series

Context for a legend item that represents the series with the specified index.

Properties:

Name	Type
index	number

oj-legend-item

Context for a legend item indexed by its position in its parent section's item array and its parent's sectionIndex.

Properties:

Name	Type	Description
itemIndex	number	The index of the item within the specified section.
sectionIndexPath	Array	The array of numerical indices for the section.

Events

ojDrill

Triggered during a drill gesture (double click if selection is enabled, single click otherwise).

Deprecated:

Since	Description
10.0.0	No longer recommended. Use separate drill listeners - ojItemDrill, ojGroupDrill, ojSeriesDrill, and ojMultiSeriesDrill instead.

Properties:

All of the event payloads listed below can be found under event.detail. See Events and Listeners for additional information.

Name	Type	Description
data	ojChart.Item<K, Array.<oj.ojChart.Item<any, null>> | Array.<number> | null> | number | null oj.ojChart.Item.<K, I> | number | null	the data object of the drilled item
group	string	the group id of the drilled object, if applicable
groupData	Array.<oj.ojChart.Group> | null	an array of data for the group the drilled object belongs to. For hierarchical groups, it will be an array of outermost to innermost group data related to the drilled object
id	string	the id of the drilled object
itemData	D	the row data object of the drilled item. This will only be set if a DataProvider is being used.
series	string	the series id of the drilled object, if applicable
seriesData	oj.ojChart.Series.<K, I> | null	the data for the series of the drilled object

ojGroupDrill

Triggered on a chart group drill gesture (double click if selection is enabled, single click otherwise).

Properties:

All of the event payloads listed below can be found under event.detail. See Events and Listeners for additional information.

Name	Type	Description
group	string | Array.<string>	the group id of the drilled object. For hierarchical groups, it will be an array of outermost to innermost group id related to the drilled object
groupData	Array.<oj.ojChart.Group>	an array of data for the group the drilled object belongs to. For hierarchical groups, it will be an array of outermost to innermost group data related to the drilled object
id	string	the id of the drilled object
items	Array.<oj.ojChart.DrillItem.<K, D, I>>	an array containing objects describing the data items belonging to the drilled group

ojItemDrill

Triggered on a chart item (double click if selection is enabled, single click otherwise).

Properties:

All of the event payloads listed below can be found under event.detail. See Events and Listeners for additional information.

Name	Type	Description
data	ojChart.Item<K, Array.<oj.ojChart.Item<any, null>> | Array.<number> | null> | number oj.ojChart.Item.<K, I> | number	the data object of the drilled item
group	string | Array.<string>	the group id of the drilled object. For hierarchical groups, it will be an array of outermost to innermost group id related to the drilled object
groupData	Array.<oj.ojChart.Group>	an array of data for the group the drilled object belongs to. For hierarchical groups, it will be an array of outermost to innermost group data related to the drilled object
id	string	the id of the drilled object
itemData	D	the row data object of the drilled item. This will only be set if a DataProvider is being used.
series	string	the series id of the drilled object
seriesData	oj.ojChart.Series.<K, I>	the data for the series of the drilled object

ojMultiSeriesDrill

Triggered on the drill gesture on chart object representing multiple series (e.g. other slice and legend item in pie charts). (double click if selection is enabled, single click otherwise). Multi series drilling is enabled when multi-series-drilling is set to on.

Properties:

All of the event payloads listed below can be found under event.detail. See Events and Listeners for additional information.

Name	Type	Description
items	Array.<oj.ojChart.DrillItem.<K, D, I>>	an array containing objects describing the data items belonging to the drilled group
series	Array.<string>	an array of series id of all the series belonging to the drill event
seriesData	oj.ojChart.Series.<K, I>	an array of series data of all the series belonging to the drill event

ojSelectInput

Triggered during a selection gesture, such as a change in the marquee selection rectangle.

Properties:

All of the event payloads listed below can be found under event.detail. See Events and Listeners for additional information.

Name	Type	Description
endGroup	string	the end group of a marquee selection on a chart with categorical axis
items	Array.<string>	an array containing the string ids of the selected data items
selectionData	Array.<Object>	an array containing objects describing the selected data items Properties Name Type Description data ojChart.Item<K, Array.<oj.ojChart.Item<any, null>> | Array.<number> | null> | number oj.ojChart.Item.<K, I> | number the data of the item, if one was specified groupData Array.<oj.ojChart.Group> the group data of the item itemData D the row data of the item, if one was specified. This will only be set if a DataProvider is used. seriesData oj.ojChart.Series.<K, I> the series data of the item
startGroup	string	the start group of a marquee selection on a chart with categorical axis
xMax	number	the maximum x value of a marquee selection
xMin	number	the minimum x value of a marquee selection
yMax	number	the maximum y value of a marquee selection
yMin	number	the minimum y value of a marquee selection

ojSeriesDrill

Triggered on a chart series drill gesture (double click if selection is enabled, single click otherwise).

Properties:

All of the event payloads listed below can be found under event.detail. See Events and Listeners for additional information.

Name	Type	Description
id	string	the id of the drilled object
items	Array.<oj.ojChart.DrillItem.<K, D, I>>	an array containing objects describing the data items belonging to the drilled group
series	string	the series id of the drilled object
seriesData	oj.ojChart.Series.<K, I>	the data for the series of the drilled object

ojViewportChange

Triggered after the viewport is changed due to a zoom or scroll operation.

Properties:

All of the event payloads listed below can be found under event.detail. See Events and Listeners for additional information.

Name	Type	Description
endGroup	string	the end group of the new viewport on a chart with categorical axis
startGroup	string	the start group of the new viewport on a chart with categorical axis
xMax	number	the maximum x value of the new viewport
xMin	number	the minimum x value of the new viewport
yMax	number	the maximum y value of the new viewport
yMin	number	the minimum y value of the new viewport

ojViewportChangeInput

Triggered during a viewport change gesture, such as a drag operation on the overview window. Note: There are situations where the chart cannot determine whether the viewport change gesture is still in progress, such as with mouse wheel zoom interactions. Standard viewportChange events are fired in these cases.

Properties:

All of the event payloads listed below can be found under event.detail. See Events and Listeners for additional information.

Name	Type	Description
endGroup	string	the end group of the new viewport on a chart with categorical axis
startGroup	string	the start group of the new viewport on a chart with categorical axis
xMax	number	the maximum x value of the new viewport
xMin	number	the minimum x value of the new viewport
yMax	number	the maximum y value of the new viewport
yMin	number	the minimum y value of the new viewport

Methods

getContextByNode(node) : {(oj.ojChart.PieCenterLabelContext|oj.ojChart.LegendItemContext|oj.ojChart.ReferenceObject|oj.ojChart.GroupContext|oj.ojChart.AxisTitleContext|oj.ojChart.ItemContext|oj.ojChart.SeriesContext)}

Returns an object with context for the given child DOM node. This will always contain the subid for the node, defined as the 'subId' property on the context object. Additional component specific information may also be included. For more details on returned objects, see context objects.

Parameters:

Name	Type	Argument	Description
node	Element	<not nullable>	The child DOM node

Returns:

The context for the DOM node, or null when none is found.

Type

(oj.ojChart.PieCenterLabelContext|oj.ojChart.LegendItemContext|oj.ojChart.ReferenceObject|oj.ojChart.GroupContext|oj.ojChart.AxisTitleContext|oj.ojChart.ItemContext|oj.ojChart.SeriesContext)

getDataItem(seriesIndex, groupIndex) : {Object|null}

Returns an object with the following properties for automation testing verification of the data item with the specified series and group indices.

Parameters:

Name	Type	Description
seriesIndex	number
groupIndex	number

Deprecated:

Since	Description
7.0.0	The use of this function is no longer recommended.

Properties:

Name	Type	Description
borderColor	string
close	number	The closing value for a stock item
color	string
group	string	The group id.
high	number	The high value for a range or stock item
label	string
low	number	The low value for a range or stock item
open	number	The opening value for a stock item
selected	boolean
series	string	The series id.
targetValue	number	The target value for a funnel slice.
tooltip	string
value	number
volume	number	The volume of a stock item
x	number
y	number
z	number

Returns:

An object containing properties for the data item, or null if none exists.

Type

Object | null

getGroup(groupIndex) : {string}

Returns the group corresponding to the given index

Parameters:

Name	Type	Description
groupIndex	string	the group index

Deprecated:

Since	Description
7.0.0	The use of this function is no longer recommended.

Returns:

The group name corresponding to the given group index

Type

string

getGroupCount : {number}

Returns number of groups in the chart data

Deprecated:

Since	Description
7.0.0	The use of this function is no longer recommended.

Returns:

The number of groups

Type

number

getLegend : {{bounds: {x: number, y: number, width: number, height: number}}}

Returns an object that contains sizing information for the chart legend.

Properties:

Name	Type	Description
bounds	Object	An object containing the bounds of the legend. Properties Name Type height number width number x number y number
title	string	Deprecated: Since Description 7.0.0 The use of this property is no longer recommended.

Returns:

An object containing properties for the chart legend.

Type

{bounds: {x: number, y: number, width: number, height: number}}

getPlotArea : {{bounds: {x: number, y: number, width: number, height: number}}}

Returns an object that contains sizing information for the chart plot area.

Properties:

Name	Type	Description
bounds	Object	An object containing the bounds of the plot area. Properties Name Type height number width number x number y number

Returns:

An object containing properties for the chart plot area.

Type

{bounds: {x: number, y: number, width: number, height: number}}

getProperty(property) : {any}

Retrieves the value of a property or a subproperty. The return type will be the same as the type of the property as specified in this API document. If the method is invoked with an incorrect property/subproperty name, it returns undefined.

Parameters:

Name	Type	Description
property	string	The property name to get. Supports dot notation for subproperty access.

Since:

• 4.0.0

Returns:

Type

any

Example

Get a single subproperty of a complex property:

let subpropValue = myComponent.getProperty('complexProperty.subProperty1.subProperty2');

getSeries(seriesIndex) : {string}

Returns the series corresponding to the given index

Parameters:

Name	Type	Description
seriesIndex	string	the series index

Deprecated:

Since	Description
7.0.0	The use of this function is no longer recommended.

Returns:

The series name corresponding to the given series index

Type

string

getSeriesCount : {number}

Returns number of series in the chart data

Deprecated:

Since	Description
7.0.0	The use of this function is no longer recommended.

Returns:

The number of series

Type

number

getValuesAt(x, y) : {{x: number|string|null, y: number|null, y2:number|null}}

Returns the x, y, and y2 axis values at the specified X and Y coordinate.

Parameters:

Name	Type	Description
x	number	The X coordinate relative to the component.
y	number	The Y coordinate relative to the component.

Returns:

An object containing the "x", "y", and "y2" axis values.

Type

{x: number|string|null, y: number|null, y2:number|null}

getXAxis : {{bounds: {x: number, y: number, width: number, height: number}, getPreferredSize(width: number, height: number): {width: number, height: number}}}

Returns an object that contains sizing information for the chart X-Axis.

Properties:

Name	Type	Description
bounds	Object	An object containing the bounds of the x axis. Properties Name Type height number width number x number y number
getPreferredSize	Function(number, number)	Returns the preferred size of the axis, given the available width and height. This value can be passed into the size and maxSize options of the axis. A re-render must be triggered by calling refresh after invoking this function. Properties Name Type height number width number
title	string	Deprecated: Since Description 7.0.0 The use of this property is no longer recommended.

Returns:

An object containing properties for the x axis.

Type

{bounds: {x: number, y: number, width: number, height: number}, getPreferredSize(width: number, height: number): {width: number, height: number}}

getY2Axis : {{bounds: {x: number, y: number, width: number, height: number}, getPreferredSize(width: number, height: number): {width: number, height: number}}}

Returns an object that contains sizing information for the chart Y2-Axis.

Properties:

Name	Type	Description
bounds	Object	An object containing the bounds of the y2 axis. Properties Name Type height number width number x number y number
getPreferredSize	Function(number, number)	Returns the preferred size of the axis, given the available width and height. This value can be passed into the size and maxSize options of the axis. A re-render must be triggered by calling refresh after invoking this function. Properties Name Type height number width number
title	string	Deprecated: Since Description 7.0.0 The use of this property is no longer recommended.

Returns:

An object containing properties for the y2 axis.

Type

{bounds: {x: number, y: number, width: number, height: number}, getPreferredSize(width: number, height: number): {width: number, height: number}}

getYAxis : {{bounds: {x: number, y: number, width: number, height: number}, getPreferredSize(width: number, height: number): {width: number, height: number}}}

Returns an object that contains sizing information for the chart Y-Axis.

Properties:

Name	Type	Description
bounds	Object	An object containing the bounds of the y axis. Properties Name Type height number width number x number y number
getPreferredSize	Function(number, number)	Returns the preferred size of the axis, given the available width and height. This value can be passed into the size and maxSize options of the axis. A re-render must be triggered by calling refresh after invoking this function. Properties Name Type height number width number
title	string	Deprecated: Since Description 7.0.0 The use of this property is no longer recommended.

Returns:

An object containing properties for the y axis.

Type

{bounds: {x: number, y: number, width: number, height: number}, getPreferredSize(width: number, height: number): {width: number, height: number}}

refresh : {void}

Refreshes the component.

Returns:

Type

void

setProperties(properties) : {void}

Performs a batch set of properties. The type of value for each property being set must match the type of the property as specified in this API document.

Parameters:

Name	Type	Description
properties	Object	An object containing the property and value pairs to set.

Since:

• 4.0.0

Returns:

Type

void

Example

Set a batch of properties:

myComponent.setProperties({"prop1": "value1", "prop2.subprop": "value2", "prop3": "value3"});

setProperty(property, value) : {void}

Sets a property or a subproperty (of a complex property) and notifies the component of the change, triggering a [property]Changed event. The value should be of the same type as the type of the attribute mentioned in this API document.

Parameters:

Name	Type	Description
property	string	The property name to set. Supports dot notation for subproperty access.
value	any	The new value to set the property to.

Since:

• 4.0.0

Returns:

Type

void

Example

Set a single subproperty of a complex property:

myComponent.setProperty('complexProperty.subProperty1.subProperty2', "someValue");

Type Definitions

AxisLine

Object type that defines an axis line.

Properties:

Name	Type	Argument	Default	Description
lineColor	string	<optional>	null	The color of the line.
lineWidth	number	<optional>	null	The width of the line.
rendered	"off" | "on" | "auto"	<optional>	"auto"	Defines whether the line is rendered.

AxisTitleContext

Properties:

Name	Type	Description
axis	"xAxis" | "yAxis" | "y2Axis"
subId	string	Sub-id string to identify a particular dom node.

BoxPlotDefaults

Object type containing the style properties of the box plot items.

Properties:

Name	Type	Argument	Default	Description
medianSvgClassName	string	<optional>	""	The CSS style class to apply to the median line.
medianSvgStyle	Partial<CSSStyleDeclaration>	<optional>	{}	The CSS inline style to apply to the median line. Only SVG CSS style properties are supported.
whiskerEndLength	string	<optional>	null	Specifies the length of the whisker ends in pixels (e.g. '9px') or as a percentage of the box width (e.g. '50%').
whiskerEndSvgClassName	string	<optional>	""	The CSS style class to apply to the whisker ends.
whiskerEndSvgStyle	Partial<CSSStyleDeclaration>	<optional>	{}	The CSS inline style to apply to the whisker ends. Only SVG CSS style properties are supported.
whiskerSvgClassName	string	<optional>	""	The CSS style class to apply to the whisker stems.
whiskerSvgStyle	Partial<CSSStyleDeclaration>	<optional>	{}	The CSS inline style to apply to the whisker stems. Only SVG CSS style properties are supported.

BoxPlotStyle

Object type that defines box plot style properties.

Properties:

Name	Type	Argument	Description
medianSvgClassName	string	<optional>	The CSS style class to apply to the median line.
medianSvgStyle	Partial<CSSStyleDeclaration>	<optional>	The CSS inline style to apply to the median line. Only SVG CSS style properties are supported.
q2Color	string	<optional>	The color of the Q2 segment of the box.
q2SvgClassName	string	<optional>	The CSS style class to apply to the Q2 segment of the box. The style class and inline style will override any other styling specified through the properties. For tooltips and hover interactivity, it's recommended to also pass a representative color to the q2Color attribute.
q2SvgStyle	Partial<CSSStyleDeclaration>	<optional>	The CSS inline style to apply to the Q2 segment of the box. The style class and inline style will override any other styling specified through the properties. For tooltips and hover interactivity, it's recommended to also pass a representative color to the q2Color attribute. Only SVG CSS style properties are supported.
q3Color	string	<optional>	The color of the Q3 segment of the box.
q3SvgClassName	string	<optional>	The CSS style class to apply to the Q3 segment of the box. The style class and inline style will override any other styling specified through the properties. For tooltips and hover interactivity, it's recommended to also pass a representative color to the q3Color attribute.
q3SvgStyle	Partial<CSSStyleDeclaration>	<optional>	The CSS inline style to apply to the Q3 segment of the box. The style class and inline style will override any other styling specified through the properties. For tooltips and hover interactivity, it's recommended to also pass a representative color to the q3Color attribute. Only SVG CSS style properties are supported.
whiskerEndLength	string	<optional>	Specifies the length of the whisker ends in pixels (e.g. '9px') or as a percentage of the box width (e.g. '50%').
whiskerEndSvgClassName	string	<optional>	The CSS style class to apply to the whisker ends.
whiskerEndSvgStyle	Partial<CSSStyleDeclaration>	<optional>	The CSS inline style to apply to the whisker ends. Only SVG CSS style properties are supported.
whiskerSvgClassName	string	<optional>	The CSS style class to apply to the whisker stems.
whiskerSvgStyle	Partial<CSSStyleDeclaration>	<optional>	The CSS inline style to apply to the whisker stems. Only SVG CSS style properties are supported.

CategoricalValueFormat<T extends string|number = string|number>

Object type that specifies the value formatting and tooltip behavior for the x values.

Properties:

Name	Type	Argument	Default	Description
converter	?(Converter<T>)	<optional>	null	The converter (an instance that duck types oj.Converter) used to format the label. When using a converter, scaling should be set to none, as the formatted result may not be compatible with the scaling suffixes.
scaling	"none" | "thousand" | "million" | "billion" | "trillion" | "quadrillion" | "auto"	<optional>	"auto"	The scaling behavior of the value. When using a converter, scaling should be set to none, as the formatted result may not be compatible with the scaling suffixes.
tooltipDisplay	"off" | "auto"	<optional>	"auto"	Whether the value is displayed in the tooltip.
tooltipLabel	string	<optional>	null	A string representing the label that is displayed before the value in the tooltip.

ChartType

Enum type that defines the chart type. By default, the first three series of "combo" chart are assigned 'bar', 'line', and 'area' type respectively and then the type repeats, i.e sucessive series will be of types 'bar', 'line', and 'area' and so on. To customize individual series, see oj-chart-series for more details.

Supported Values:

Value	Description
area	Series will be represented by an area. Use lineWithArea to prevent values from being obscured.
bar	Data items will be represented by bars.
boxPlot	Series will be represented by box plot markers.
bubble	Data items will be represented as bubble markers with x, y, and z values. z value defines the relative size of the bubbles.
combo	Multiple series can be represented with multiple types of markers: bar, line and area.
funnel	Data items are represented as funnel slices.
line	Series will be represented by a line.
lineWithArea	Series will be presented by a line and area.
pie	Data items are represented as pie slices.
pyramid	Data items are represented as pyramid slices.
scatter	Data items will be represented as markers with x and y values.
stock	Series will be represented by candlestick markers. There are other representations available like area, bar, line and line with area.

DataCursorDefaults

Object type defining the data cursor style.

Properties:

Name	Type	Argument	Default	Description
lineColor	string	<optional>	null	The color of the data cursor line.
lineStyle	oj.ojChart.LineStyle	<optional>	"solid"	The line style of the data cursor line.
lineWidth	number	<optional>	null	The width of the data cursor line in pixels.
markerColor	string	<optional>	null	The color of the data cursor marker. Defaults to the data series color.
markerDisplayed	"off" | "on"	<optional>	"on"	Whether the data cursor marker is displayed. Marker should only be hidden if the data cursor is displaying information for the entire group.
markerSize	number	<optional>	null	The size of the data cursor marker in pixels.

DataCursorPosition<T extends number|string = number|string>

Object type that specifies the position of the data cursor. Used for synchronizing data cursors across multiple charts.

Properties:

Name	Type	Argument	Default	Description
x	T	<optional>	null	The x value of the data cursor.
y	number	<optional>	null	The y value of the data cursor. If both y and y2 are defined, y will take precedence.
y2	number	<optional>	null	The y2 value of the data cursor. If both y and y2 are defined, y will take precedence.

DataItem<I extends Array<ojChart.Item<any, null>>|Array<number>|null,K=any,D=any>

Object type that defines a chart data item for the no template case.

Properties:

Name	Type	Argument	Default	Description
borderColor	string	<optional>		The border color of the data item. For funnel and pyramid charts, it is used for the slice border.
borderWidth	number	<optional>		The border width of the data item. For funnel and pyramid charts, it is used for the slice border.
boxPlot	ojChart.BoxPlotStyle=	<optional>		An object containing the style properties of the box plot item.
categories	Array.<string>	<optional>		An optional array of category strings corresponding to this data item. This enables highlighting and filtering of individual data items through interactions with the legend or other visualization elements. If not defined, series categories are used.
close	number	<optional>		The close value for stock candlestick. When bar, line, or area series type are used on a stock chart, this value is displayed.
color	string	<optional>		The color of the data item. This color value is not inherited by chart legend. See chart series color and display-in-legend for more details.
drilling	"on" | "off" | "inherit"	<optional>	"inherit"	Whether drilling is enabled for the data item. Drillable objects will show a pointer cursor on hover and fire an ojDrill event on click (double click if selection is enabled). To enable drilling for all data items at once, use the drilling attribute in the top level.
groupId	Array.<(string|number)>			The id of the group item. This id will be provided as part of the context for events on the chart.
high	number	<optional>		The high value for range bar/area, stock candlestick, or box plot item. Define 'low' and 'high' instead of 'value' or 'y' to create a range bar/area chart.
label	string | Array.<string>	<optional>		The label for the data item. For range series, if an array of two values is provided, the first and second value will apply to the low and high point respectively. Not supported for box plot or candlestick.
labelPosition	"center" | "outsideSlice" | "aboveMarker" | "belowMarker" | "beforeMarker" | "afterMarker" | "insideBarEdge" | "outsideBarEdge" | "none" | "auto"	<optional>		The position of the data label. For range series, if an array of two values is provided, the first and second value will apply to the low and high point respectively. The 'outsideSlice' value only applies to pie charts. The 'aboveMarker', 'belowMarker', 'beforeMarker', and 'afterMarker' values only apply to line, area, scatter, and bubble series. The 'insideBarEdge' and 'outsideBarEdge' values only apply to non-polar bar series. Stacked bars do not support 'outsideBarEdge'. The chart does not currently adjust layout to fit labels within the plot area or deal with any overlaps between labels.
labelStyle	Partial<CSSStyleDeclaration> | Array.<Partial<CSSStyleDeclaration>>	<optional>		The CSS style object defining the style of the data label. For range series, if an array of two values is provided, the first and second value will apply to the low and high point respectively. The following style properties are supported: color, cursor, fontFamily, fontSize, fontStyle, fontWeight, textDecoration.
low	number	<optional>		The low value for range bar/area, stock candlestick, or box plot item. Define 'low' and 'high' instead of 'value' or 'y' to create a range bar/area chart.
markerDisplayed	"on" | "off" | "auto"	<optional>		Defines whether the data marker is displayed. Only applies to line, area, scatter, and bubble series. If auto, the markers will be displayed whenever the data points are not connected by a line.
markerShape	"circle" | "diamond" | "human" | "plus" | "square" | "star" | "triangleDown" | "triangleUp" | "auto" | string	<optional>		The shape of the data markers. Only applies to line, area, scatter, and bubble series. In addition to the built-in shapes, it may also take SVG path commands to specify a custom shape. The chart will style the custom shapes the same way as built-in shapes, supporting properties like color and borderColor and applying hover and selection effects. Only 'auto' is supported for range series.
markerSize	number	<optional>		The size of the data markers. Only applies to line, area, and scatter series. Does not apply to bubble charts, which calculate marker size based on the z values.
open	number	<optional>		The open value for stock candlestick.
pattern	"smallChecker" | "smallCrosshatch" | "smallDiagonalLeft" | "smallDiagonalRight" | "smallDiamond" | "smallTriangle" | "largeChecker" | "largeCrosshatch" | "largeDiagonalLeft" | "largeDiagonalRight" | "largeDiamond" | "largeTriangle" | "auto"	<optional>	"auto"	The pattern used to fill the data item. A solid fill is used by default, unless the seriesEffect is 'pattern'.
q1	number	<optional>		The first quartile value for box plot.
q2	number	<optional>		The second quartile (median) value for box plot.
q3	number	<optional>		The third quartile value for box plot.
seriesId	string | number			The id of the series item. This id will be provided as part of the context for events on the chart.
shortDesc	(string | ((context: ojChart.ItemShortDescContext<K,D,I>) => string))	<optional>		The description of this object. Will be lazily created if a function is used. This is used for accessibility and also for customizing the tooltip text.
source	string	<optional>		The URI of the custom image. If specified, it takes precedence over marker-shape.
sourceHover	string	<optional>		The optional URI for the hover state. If not specified, the source image will be used.
sourceHoverSelected	string	<optional>		The optional URI for the hover selected state. If not specified, the source image will be used.
sourceSelected	string	<optional>		The optional URI for the selected state. If not specified, the source image will be used.
svgClassName	string	<optional>		The CSS style class to apply to the data item. The style class and inline style will override any other styling specified through the properties. For tooltips and hover interactivity, it's recommended to also pass a representative color to the item color attribute.
svgStyle	Partial<CSSStyleDeclaration>	<optional>		The CSS inline style to apply to the data item. The style class and inline style will override any other styling specified through the properties. For tooltips and hover interactivity, it's recommended to also pass a representative color to the item color attribute. Only SVG CSS style properties are supported.
targetValue	number	<optional>		The target value for a funnel chart. When this is set, the value attribute defines the filled area within the slice and this represents the value of the whole slice.
value	number	<optional>		The value for this data item. Corresponding to the y value for bar, line, area, and combo charts and the slice values for pie, funnel and pyramid charts. Null can be specified to skip a data point.
volume	number	<optional>		The value for stock volume bar. When this value is provided, the volume bar is displayed on the y2 axis.
x	number | string	<optional>		The x value. Mainly used for scatter and bubble chart and to specify the date for mixed-frequency time axis. For categorical axis, if the x value is not specified, it will default to the item index. For regular time axis, if the x value is not specified, it will default to the group name of the item. For mixed-frequency time axis, the date specified for the x value must be an ISO string.
y	number	<optional>		The y value. Also the primary value for charts without a y-Axis, such as pie charts.
z	number	<optional>		The z value. Defines the bubble radius for a bubble chart, as well as the width of a bar or a box plot item.

DataLabelContext<K, D, I extends Array<ojChart.Item<any, null>>|Array<number>|null>

Properties:

Name	Type	Description
close	number	The close value of the stock chart data item.
componentElement	Element	The chart element.
data	ojChart.Item<K, Array<oj.ojChart.Item<any, null>> | Array<number> | null> | number | null oj.ojChart.Item.<K, I> | Array<number> | null> | number | null	The data object of the data item. For nested items, it will be an array containing the parent item data and nested item data.
dimensions	Object | null	The height and width of the data item. This will only be set for bar series types. Properties Name Type Description height number The height of the data item. width number The width of the data item.
group	string | Array.<string>	The id or an array of ids of the group(s) the data item belongs to. For hierarchical groups, it will be an array of outermost to innermost group ids.
groupData	Array.<oj.ojChart.Group> | null	An array of data for the group the data item belongs to. For hierarchical groups, it will be an array of outermost to innermost group data related to the data item.
high	number	The high value of the data item present in range bar/area, stock candlestick, or box plot item
id	any	The id of the data item.
itemData	D	The row data object for the data item. This will only be set if a DataProvider is being used.
label	string	The label for the data item if the dataLabel callback is ignored. The dataLabel callback can concatenate this with another string to easily enhance the default label.
low	number	The low value of the data item present in range bar/area, stock candlestick, or box plot item.
open	number	The open value of the stock chart data item.
q1	number	The first quartile value of the boxplot data item.
q2	number	The second quartile (median) value of the boxplot data item.
q3	number	The third quartile value of the boxplot data item.
series	string	The id of the series the data item belongs to.
seriesData	oj.ojChart.Series.<K, I> | null	The data for the series the data item belongs to.
targetValue	number	The targetValue of the funnel data item.
totalValue	number	The total of all values in the chart. This will only be included for pie charts.
value	number	The value of the data item.
volume	number	The volume value of the stock chart data item.
x	number | string	The x value of the data item.
y	number	The y value of the data item.
z	number	The z value of the data item.

DndDragConfig<T>

Object type that allows dragging elements.

Properties:

Name	Type	Argument	Default	Description
dataTypes	string | Array.<string>	<optional>	null	The MIME types to use for the dragged data in the dataTransfer object. This can be a string if there is only one type, or an array of strings if multiple types are needed. For example, if selected employee data items are being dragged, dataTypes could be "application/employees+json". Drop targets can examine the data types and decide whether to accept the data. For each type in the array, dataTransfer.setData will be called with the specified type and the data. The data is an array of the dataContexts of the selected elements. The dataContext is the JSON version of the dataContext that we use for "tooltip" and "dataLabels" properties, excluding componentElement and parentElement. This property is required unless the application calls setData itself in a dragStart callback function.
drag	function(Event)	<optional>	null	An optional callback function that receives the "drag" event as argument.
dragEnd	function(Event)	<optional>	null	An optional callback function that receives the "dragend" event as argument.
dragStart	((event: Event, context: T) => void)	<optional>	null	An optional callback function that receives the "dragstart" event and context information as arguments. The context information is as follows: element {Array.(Object)}: An array of dataContexts of the dragged elements. The dataContext is the same as what we use for "tooltip" and "dataLabels" properties. This function can set its own data and drag image as needed. When this function is called, event.dataTransfer is already populated with the default data and drag image.

DndDragConfigs<K, D, I extends Array.<ojChart.Item<any, null>>|Array.<number>|null>

Object type that describes drag functionality.

Properties:

Name	Type	Argument	Description
groups	oj.ojChart.DndDragConfig.<ojChart.DndGroup>	<optional>	Allows dragging of chart groups from the categorical axis labels.
items	oj.ojChart.DndDragConfig.<ojChart.DndItem.<K, D, I>>	<optional>	Allows dragging of chart data items, including bars, line/area/scatter markers, bubbles, and pie/funnel/pyramid slices.
series	oj.ojChart.DndDragConfig.<ojChart.DndSeries.<K, I>>	<optional>	Allows dragging of chart series from the legend items.

DndDrop

Properties:

Name	Type	Description
x	number | null	The X axis value at the event position. This is populated for plot area and x axis "drops".
y	number | null	The Y axis value at the event position. This is populated for plot area and y axis "drops".
y2	number | null	The Y2 axis value at the event position. This is populated for plot area and y2 axis "drops".

DndDropConfig

Object type that allows dropping on an element.

Properties:

Name	Type	Argument	Default	Description
dataTypes	string | Array.<string>	<optional>	null	An array of MIME data types this element can accept. This property is required unless dragEnter, dragOver, and drop callback functions are specified to handle the corresponding events.
dragEnter	((event: Event, context: ojChart.DndDrop) => void)	<optional>	null	An optional callback function that receives the "dragenter" event and context information as arguments. This function should call event.preventDefault() to indicate the dragged data can be accepted. Otherwise, dataTypes will be matched against the drag data types to determine if the data is acceptable.
dragLeave	((event: Event, context: ojChart.DndDrop) => void)	<optional>	null	An optional callback function that receives the "dragleave" event and context information as arguments.
dragOver	((event: Event, context: ojChart.DndDrop) => void)	<optional>	null	An optional callback function that receives the "dragover" event and context information as arguments. This function should call event.preventDefault() to indicate the dragged data can be accepted. Otherwise, dataTypes will be matched against the drag data types to determine if the data is acceptable.
drop	((event: Event, context: ojChart.DndDrop) => void)	<optional>	null	An optional callback function that receives the "drop" event and context information as arguments. This function should call event.preventDefault() to indicate the dragged data can be accepted.

DndDropConfigs

Object type that describes drop functionality.

Properties:

Name	Type	Argument	Description
legend	oj.ojChart.DndDropConfig	<optional>	Allows dropping on the legend.
plotArea	oj.ojChart.DndDropConfig	<optional>	Allows dropping on the plot area.
xAxis	oj.ojChart.DndDropConfig	<optional>	Allows dropping on the X axis.
y2Axis	oj.ojChart.DndDropConfig	<optional>	Allows dropping on the Y2 axis.
yAxis	oj.ojChart.DndDropConfig	<optional>	Allows dropping on the Y axis.

DndGroup

Properties:

Name	Type	Description
group	string | number | Array.<(string|number)>	The id of the group.
id	string | number | Array.<(string|number)>	The id of the group.
label	string	The label for the group.

DndItem<K, D, I extends Array<ojChart.Item<any, null>>|Array<number>|null>

Properties:

Name	Type	Description
item	Array.<oj.ojChart.DataLabelContext.<K, D, I>>	An array of dataContexts of the dragged data items. The dataContext is the same as what we use for "tooltip" and "dataLabels" properties.

DndSeries<K, I extends Array<ojChart.Item<any, null>>|Array<number>|null>

Properties:

Name	Type	Description
color	string	The color of the series.
componentElement	any	The chart element.
id	string | number	The id of the series.
series	string | number	The id of the series.
seriesData	oj.ojChart.Series.<K, I>	The data for the series.

DrillItem<K, D, I extends Array.<ojChart.Item<any, null>>|Array.<number>|null>

Object type that defines the item belonging to drilled element.

Properties:

Name	Type	Description
data	ojChart.Item<K, Array.<oj.ojChart.Item<any, null>> | Array.<number> | null> | number oj.ojChart.Item.<K, I> | number	The data object of the drilled item.
group	string | Array.<string>	The group id of the data item. For hierarchical group, it will be an array of outermost to innermost group related to the object.
id	K	The id for the data item.
itemData	D	The row data object of the drilled item. This will only be set if a DataProvider is being used.
series	string	The series id of the data item.

Group

Object type that defines a chart group.

Properties:

Name	Type	Argument	Default	Description
drilling	"on" | "off" | "inherit"	<optional>	"inherit"	Whether drilling is enabled on the group label. Drillable objects will show a pointer cursor on hover and fire an ojDrill event on click. To enable drilling for all group labels at once, use the drilling attribute in the top level.
groups	Array<ojChart.Group>=	<optional>		An array of nested group objects.
id	string | number	<optional>		The id of the group. Defaults to the name if not specified. This is also used to specify the date for non mixed frequency time axes. The specified date for non mixed frequency time axes must be an ISO string.
labelStyle	Partial<CSSStyleDeclaration>	<optional>		The CSS style object defining the style of the group label text. The following style properties are supported: backgroundColor, borderColor, borderRadius, borderWidth, color, cursor, fontFamily, fontSize, fontStyle, fontWeight, textDecoration. Only applies to a categorical axis.
name	string	<optional>		The name of the group.
shortDesc	string	<optional>		The description of the group. This is used for customizing the tooltip text and only applies to a categorical axis.

GroupContext

Properties:

Name	Type	Description
indexPath	Array	The array of indices corresponding to the position of the group in the properties array. The array of numerical indices for the section.
subId	string	Sub-id string to identify a particular dom node.

GroupSeparatorDefaults

Object type defining the style for hierarchical label separators.

Properties:

Name	Type	Argument	Default	Description
color	string	<optional>	null	The color of the separators lines.
rendered	"off" | "auto"	<optional>	"auto"	Defines whether the group separators are displayed.

GroupTemplateContext<D>

Properties:

Name	Type	Description
componentElement	Element	The <oj-chart> custom element Deprecated: Since Description 16.0.0 The componentElement property is deprecated. This shouldn't be needed, as the component template with access to this context is unique to the component.
depth	number	The depth of the group. The depth of the outermost group under the invisible root is 1.
ids	Array.<string>	An array of group IDs, from the outermost group to the current group. For non-hierarchical group, the array will contain only one id.
index	number	The group index
items	Array.<Object>	The array of objects which are chart items that belong to this group. The objects will have the following properties: Properties Name Type Description data D The data object for the item index number The zero-based index of the item key any The key of the current item
leaf	boolean	True if the group is a leaf group.

GroupValueFormat

Object type that specifies tooltip behavior for the groups.

Properties:

Name	Type	Argument	Default	Description
tooltipDisplay	"off" | "auto"	<optional>	"auto"	Whether the value is displayed in the tooltip.
tooltipLabel	string | Array.<string>	<optional>	null	A string representing the label that is displayed before the value in the tooltip. This value can also take an array of strings to be applied to hierarchical group names, from outermost to innermost.

Item<K, I extends Array<ojChart.Item<any, null>>|Array<number>|null,D=any>

Object type that defines a chart data item.

Properties:

Name	Type	Argument	Default	Description
borderColor	string	<optional>		The border color of the data item. For funnel and pyramid charts, it is used for the slice border.
borderWidth	number	<optional>		The border width of the data item. For funnel and pyramid charts, it is used for the slice border.
boxPlot	ojChart.BoxPlotStyle=	<optional>		An object containing the style properties of the box plot item.
categories	Array.<string>	<optional>		An optional array of category strings corresponding to this data item. This enables highlighting and filtering of individual data items through interactions with the legend or other visualization elements. If not defined, series categories are used.
close	number	<optional>		The close value for stock candlestick. When bar, line, or area series type are used on a stock chart, this value is displayed.
color	string	<optional>		The color of the data item. This color value is not inherited by chart legend. See chart series color and display-in-legend for more details.
drilling	"on" | "off" | "inherit"	<optional>	"inherit"	Whether drilling is enabled for the data item. Drillable objects will show a pointer cursor on hover and fire an ojDrill event on click (double click if selection is enabled). To enable drilling for all data items at once, use the drilling attribute in the top level.
high	number	<optional>		The high value for range bar/area, stock candlestick, or box plot item. Define 'low' and 'high' instead of 'value' or 'y' to create a range bar/area chart.
id	K			The id of the chart item. This id will be provided as part of the context for events on the chart.
items	I	<optional>		An array of nested data items to be used for defining the markers for outliers or additional data items of a box plot.
label	string | Array.<string>	<optional>		The label for the data item. For range series, if an array of two values is provided, the first and second value will apply to the low and high point respectively. Not supported for box plot or candlestick.
labelPosition	"center" | "outsideSlice" | "aboveMarker" | "belowMarker" | "beforeMarker" | "afterMarker" | "insideBarEdge" | "outsideBarEdge" | "none" | "auto"	<optional>		The position of the data label. For range series, if an array of two values is provided, the first and second value will apply to the low and high point respectively. The 'outsideSlice' value only applies to pie charts. The 'aboveMarker', 'belowMarker', 'beforeMarker', and 'afterMarker' values only apply to line, area, scatter, and bubble series. The 'insideBarEdge' and 'outsideBarEdge' values only apply to non-polar bar series. Stacked bars do not support 'outsideBarEdge'. The chart does not currently adjust layout to fit labels within the plot area or deal with any overlaps between labels.
labelStyle	Partial<CSSStyleDeclaration> | Array.<Partial<CSSStyleDeclaration>>	<optional>		The CSS style object defining the style of the data label. For range series, if an array of two values is provided, the first and second value will apply to the low and high point respectively. The following style properties are supported: color, cursor, fontFamily, fontSize, fontStyle, fontWeight, textDecoration.
low	number	<optional>		The low value for range bar/area, stock candlestick, or box plot item. Define 'low' and 'high' instead of 'value' or 'y' to create a range bar/area chart.
markerDisplayed	"on" | "off" | "auto"	<optional>		Defines whether the data marker is displayed. Only applies to line, area, scatter, and bubble series. If auto, the markers will be displayed whenever the data points are not connected by a line.
markerShape	"circle" | "diamond" | "human" | "plus" | "square" | "star" | "triangleDown" | "triangleUp" | "auto" | string	<optional>		The shape of the data markers. Only applies to line, area, scatter, and bubble series. In addition to the built-in shapes, it may also take SVG path commands to specify a custom shape. The chart will style the custom shapes the same way as built-in shapes, supporting properties like color and borderColor and applying hover and selection effects. Only 'auto' is supported for range series.
markerSize	number	<optional>		The size of the data markers. Only applies to line, area, and scatter series. Does not apply to bubble charts, which calculate marker size based on the z values.
open	number	<optional>		The open value for stock candlestick.
pattern	"smallChecker" | "smallCrosshatch" | "smallDiagonalLeft" | "smallDiagonalRight" | "smallDiamond" | "smallTriangle" | "largeChecker" | "largeCrosshatch" | "largeDiagonalLeft" | "largeDiagonalRight" | "largeDiamond" | "largeTriangle" | "auto"	<optional>	"auto"	The pattern used to fill the data item. A solid fill is used by default, unless the seriesEffect is 'pattern'.
q1	number	<optional>		The first quartile value for box plot.
q2	number	<optional>		The second quartile (median) value for box plot.
q3	number	<optional>		The third quartile value for box plot.
shortDesc	(string | ((context: ojChart.ItemShortDescContext<K,D,I>) => string))	<optional>		The description of this object. Will be lazily created if a function is used. This is used for accessibility and also for customizing the tooltip text.
source	string	<optional>		The URI of the custom image. If specified, it takes precedence over marker-shape.
sourceHover	string	<optional>		The optional URI for the hover state. If not specified, the source image will be used.
sourceHoverSelected	string	<optional>		The optional URI for the hover selected state. If not specified, the source image will be used.
sourceSelected	string	<optional>		The optional URI for the selected state. If not specified, the source image will be used.
svgClassName	string	<optional>		The CSS style class to apply to the data item. The style class and inline style will override any other styling specified through the properties. For tooltips and hover interactivity, it's recommended to also pass a representative color to the item color attribute.
svgStyle	Partial<CSSStyleDeclaration>	<optional>		The CSS inline style to apply to the data item. The style class and inline style will override any other styling specified through the properties. For tooltips and hover interactivity, it's recommended to also pass a representative color to the item color attribute. Only SVG CSS style properties are supported.
targetValue	number	<optional>		The target value for a funnel chart. When this is set, the value attribute defines the filled area within the slice and this represents the value of the whole slice.
value	number	<optional>		The value for this data item. Corresponding to the y value for bar, line, area, and combo charts and the slice values for pie, funnel and pyramid charts. Null can be specified to skip a data point.
volume	number	<optional>		The value for stock volume bar. When this value is provided, the volume bar is displayed on the y2 axis.
x	number | string	<optional>		The x value. Mainly used for scatter and bubble chart and to specify the date for mixed-frequency time axis. For categorical axis, if the x value is not specified, it will default to the item index. For regular time axis, if the x value is not specified, it will default to the group name of the item. For mixed-frequency time axis, the date specified for the x value must be an ISO string.
y	number	<optional>		The y value. Also the primary value for charts without a y-Axis, such as pie charts.
z	number	<optional>		The z value. Defines the bubble radius for a bubble chart, as well as the width of a bar or a box plot item.

ItemContext

Properties:

Name	Type	Description
itemIndex	number	The index of the item within the specified section.
seriesIndex	number	The index of the series within the specified section.
subId	string	Sub-id string to identify a particular dom node.

ItemShortDescContext<K, D, I extends Array<ojChart.Item<any, null>>|Array<number>|null>

Properties:

Name	Type	Description
close	number	The close value of the hovered stock chart item.
data	ojChart.Item<K, Array<oj.ojChart.Item<any, null>> | Array<number> | null> | number | null oj.ojChart.Item.<K, I> | Array<number> | null> | number | null	The data object of the hovered item. For nested items, it will be an array containing the parent item data and nested item data.
group	string | Array.<string>	The ids or an array of ids of the group(s) the hovered item belongs to. For hierarchical groups, it will be an array of outermost to innermost group ids.
groupData	Array.<oj.ojChart.Group> | null	An array of data for the group the hovered item belongs to. For hierarchical groups, it will be an array of outermost to innermost group data related to the hovered item.
high	number	The high value of the data item present in range bar/area, stock candlestick, or box plot item.
id	any	The id of the hovered item.
itemData	D	The row data object for the hovered item. This will only be set if a DataProvider is being used.
label	string	The data label of the hovered item.
low	number	The low value of the data item present in range bar/area, stock candlestick, or box plot item.
open	number	The open value of the hovered stock chart item.
q1	number	The first quartile value of the hovered the box plot item.
q2	number	The second quartile (median) value of the hovered box plot item.
q3	number	The third quartile value of the hovered box plot item.
series	string	The id of the series the hovered item belongs to.
seriesData	oj.ojChart.Series.<K, I> | null	The data for the series the hovered item belongs to.
targetValue	number	The target value of the hovered funnel item.
totalValue	number	The total of all values in the chart. This will only be included for pie charts.
value	number	The value of the hovered item.
volume	number	The volume value of the hovered stock chart item.
x	number | string	The x value of the hovered item.
y	number	The y value of the hovered item.
z	number	The z value of the hovered item.

ItemTemplateContext<K = any,D = any>

Properties:

Name	Type	Description
componentElement	Element	The <oj-chart> custom element Deprecated: Since Description 16.0.0 The componentElement property is deprecated. This shouldn't be needed, as the component template with access to this context is unique to the component.
data	D	The data object for the current item
index	number	The zero-based index of the current item
key	K	The key of the current item

LabelValueFormat

Object type that specifies the value formatting for the data item labels.

Properties:

Name	Type	Argument	Default	Description
converter	?(Converter<string>)	<optional>	null	The converter (an instance that duck types oj.Converter) used to format the label. When using a converter, scaling should be set to none, as the formatted result may not be compatible with the scaling suffixes.
scaling	"none" | "thousand" | "million" | "billion" | "trillion" | "quadrillion" | "auto"	<optional>	"auto"	The scaling behavior of the value. When using a converter, scaling should be set to none, as the formatted result may not be compatible with the scaling suffixes.

Legend

Object type that specifies the style, positioning, and behavior of the legend.

Properties:

Name	Type	Argument	Default	Description
backgroundColor	string	<optional>	null	The color of the legend background.
borderColor	string	<optional>	null	The border color of the legend.
maxSize	string	<optional>	null	Defines the maximum size of the legend in pixels (e.g. '50px') or percent (e.g. '15%').
position	"start" | "end" | "bottom" | "top" | "auto"	<optional>	"auto"	The position of the legend within the chart. By default, the legend will be placed on the side or bottom, based on the size of the chart and the legend contents.
referenceObjectSection	oj.ojChart.LegendReferenceObjectSection	<optional>		An object with the following properties for the reference object section in the legend.
rendered	"on" | "off" | "auto"	<optional>	"auto"	Defines whether the legend is displayed. If set to auto, the legend will be hidden for charts with a large number of series. To ensure that the legend is always displayed, set this attribute to 'on'. To turn on legend for stock, funnel and pyramid charts, set the displayInLegend property for the series items to 'on'.
scrolling	"off" | "asNeeded"	<optional>	"asNeeded"	Defines whether scrolling is enabled for the legend. Deprecated: Since Description 12.1.0 Setting scrolling to off is not supported in Redwood theme and it is not recommended. As such, this attribute is deprecated.
sectionTitleHalign	"center" | "end" | "start"	<optional>	"start"	The horizontal alignment of the section titles.
sectionTitleStyle	Partial<CSSStyleDeclaration>	<optional>	{}	The CSS style object defining the style of the section titles' text. The following style properties are supported: color, fontFamily, fontSize, fontStyle, fontWeight and textDecoration.
sections	Array.<oj.ojChart.LegendSection>	<optional>	[]	An array of objects with the following properties defining the additional legend sections, other than the default series and reference object sections.
seriesSection	oj.ojChart.LegendSeriesSection	<optional>		An object that specifies the properties for the series section in the legend.
size	string	<optional>	null	Defines the size of the legend in pixels (e.g. '50px') or percent (e.g. '15%').
symbolHeight	number	<optional>	null	The height of the legend symbol (line or marker) in pixels.
symbolWidth	number	<optional>	null	The width of the legend symbol (line or marker) in pixels.
textStyle	Partial<CSSStyleDeclaration>	<optional>	{}	The CSS style object defining the style of the legend text. The following style properties are supported: color, cursor, fontFamily, fontSize, fontStyle, fontWeight and textDecoration.
title	string	<optional>	null	The legend title.
titleHalign	"center" | "end" | "start"	<optional>		The horizontal alignment of the title. Deprecated: Since Description 15.1.0 Individual section title alignment is no longer supported. Use section-title-halign in legend to align all section titles
titleStyle	Partial<CSSStyleDeclaration>	<optional>	{}	The CSS style object defining the style of the title. The following style properties are supported: color, cursor, fontFamily, fontSize, fontStyle, fontWeight and textDecoration. Deprecated: Since Description 15.1.0 Individual section title style is no longer supported. Use section-title-style in legend to style all section titles

LegendItem

Object type that defines a chart data item.

Properties:

Name	Type	Argument	Default	Description
borderColor	string	<optional>		The border color of the marker. Only applies if symbolType is "marker" or "lineWithMarker".
categories	Array.<string>	<optional>		An array of categories for the legend item. Legend items currently only support a single category. If no category is specified, this defaults to the id or text of the legend item.
categoryVisibility	"hidden" | "visible"	<optional>	"visible"	Defines whether the legend item corresponds to visible data items. A hollow symbol is shown if the value is "hidden". Deprecated: Since Description 14.1.0 This attribute is deprecated. Use hidden-categories on oj-chart instead
color	string	<optional>		The color of the legend symbol (line or marker). When symbolType is "lineWithMarker", this attribute defines the line color and the markerColor attribute defines the marker color.
id	string	<optional>		The id of the legend item, which is provided as part of the context for events fired by the legend. If not specified, the default depends upon whether a DataProvider is being used. For the DataProvider case, the key for the node will be used as the default id. Otherwise, the id defaults to the text of the legend item.
lineStyle	"dashed" | "dotted" | "solid"	<optional>	"solid"	The line style. Only applies when the symbolType is "line" or "lineWithMarker".
lineWidth	number	<optional>		The line width in pixels. Only applies when the symbolType is "line" or "lineWithMarker".
markerColor	string	<optional>		The color of the marker, if different than the line color. Only applies if the symbolType is "lineWithMarker".
markerShape	"circle" | "diamond" | "ellipse" | "human" | "plus" | "rectangle" | "square" | "star" | "triangleDown" | "triangleUp" | string	<optional>	"square"	The shape of the marker. Only applies if symbolType is "marker" or "lineWithMarker". Can take the name of a built-in shape or the SVG path commands for a custom shape. Does not apply if a custom image is specified.
pattern	"largeChecker" | "largeCrosshatch" | "largeDiagonalLeft" | "largeDiagonalRight" | "largeDiamond" | "largeTriangle" | "none" | "smallChecker" | "smallCrosshatch" | "smallDiagonalLeft" | "smallDiagonalRight" | "smallDiamond" | "smallTriangle"	<optional>	"none"	The pattern used to fill the marker. Only applies if symbolType is "marker" or "lineWithMarker".
shortDesc	string	<optional>		The description of this legend item. This is used for accessibility and for customizing the tooltip text.
source	string	<optional>		The URI of the image of the legend symbol.
symbolType	"image" | "line" | "lineWithMarker" | "marker"	<optional>	"marker"	The type of legend symbol to display.
text	string			The legend item text.

LegendItemContext

Properties:

Name	Type	Description
itemIndex	number	The index of the item within the specified section.
sectionIndexPath	Array	The array of numerical indices for the section.
subId	string	Sub-id string to identify a particular dom node.

LegendReferenceObjectSection

Object type that specifies the properties for the reference object section in the legend.

Properties:

Name	Type	Argument	Default	Description
title	string	<optional>	null	The title of the section.
titleHalign	"center" | "end" | "start"	<optional>	"start"	The horizontal alignment of the section title. Deprecated: Since Description 15.1.0 Individual section title alignment is no longer supported. Use section-title-halign in legend to align all section titles.
titleStyle	Partial<CSSStyleDeclaration>	<optional>	{}	The CSS style object defining the style of the section title. The following style properties are supported: color, cursor, fontFamily, fontSize, fontStyle, fontWeight, textDecoration. Deprecated: Since Description 15.1.0 Individual section title style is no longer supported. Use section-title-style in legend to style all section titles.

LegendSection

Object type that specifies the properties for a legend section.

Properties:

Name	Type	Argument	Default	Description
items	Array.<oj.ojChart.LegendItem>	<optional>		An array of objects with the following properties defining the legend items. Also accepts a Promise for deferred data rendering. No data will be rendered if the Promise is rejected.
sections	Array.<oj.ojChart.LegendSection>	<optional>		An array of nested legend sections.
title	string	<optional>	null	The title of the section.
titleHalign	"center" | "end" | "start"	<optional>	"start"	The horizontal alignment of the section title. Deprecated: Since Description 15.1.0 Individual section title alignment is no longer supported. Use section-title-halign in legend to align all section titles.
titleStyle	Partial<CSSStyleDeclaration>	<optional>	{}	The CSS style object defining the style of the section title. The following style properties are supported: color, cursor, fontFamily, fontSize, fontStyle, fontWeight, textDecoration. Deprecated: Since Description 15.1.0 Individual section title style is no longer supported. Use section-title-style in legend to style all section titles.

LegendSeriesSection

Object type that specifies the properties for the series section in the legend.

Properties:

Name	Type	Argument	Default	Description
title	string	<optional>	null	The title of the section.
titleHalign	"center" | "end" | "start"	<optional>	"start"	The horizontal alignment of the section title. Deprecated: Since Description 15.1.0 Individual section title alignment is no longer supported. Use section-title-halign in legend to align all section titles.
titleStyle	Partial<CSSStyleDeclaration>	<optional>	{}	The CSS style object defining the style of the section title. The following style properties are supported: color, cursor, fontFamily, fontSize, fontStyle, fontWeight, textDecoration. Deprecated: Since Description 15.1.0 Individual section title style is no longer supported. Use section-title-style in legend to style all section titles.

LineStyle

Enum type that defines a line style.

Supported Values:

Value	Description
dashed	Line will have dashed strokes.
dotted	Line will have dotted strokes.
solid	Line will have a solid stroke.

LineType

Enum type that defines a line type.

Supported Values:

Value	Description
centeredSegmented	Data points will be connected with a centered segmented line.
centeredStepped	Data points will be connected with a centered stepped line.
curved	Data points will be connected with a curved line.
segmented	Data points will be connected with a segmented line.
stepped	Data points will be connected with a stepped line.
straight	Data points will be connected with a straight line.

MajorTick

Object type that defines a major tick.

Properties:

Name	Type	Argument	Default	Description
baselineColor	"inherit" | "auto" | string	<optional>	"auto"	The color of the major tick mark at the baseline. Valid values are auto, inherit, or a custom color. If set to inherit, it will follow the lineColor attribute.
baselineStyle	oj.ojChart.LineStyle	<optional>	"solid"	The line style of the major tick mark at the baseline. If not specified, it will follow the lineStyle attribute.
baselineWidth	number	<optional>	null	The width of the major tick mark at the baseline. If not specified, it will follow the lineWidth attribute.
lineColor	string	<optional>	null	The color of the line.
lineStyle	oj.ojChart.LineStyle	<optional>	"solid"	The line style of the tick marks.
lineWidth	number	<optional>	null	The width of the line.
rendered	"off" | "on" | "auto"	<optional>	"auto"	Defines whether the line is rendered.

MinorTick

Object type that defines a minor tick.

Properties:

Name	Type	Argument	Default	Description
lineColor	string	<optional>	null	The color of the line.
lineStyle	oj.ojChart.LineStyle	<optional>	"solid"	The line style of the tick marks.
lineWidth	number	<optional>	null	The width of the line.
rendered	"off" | "on" | "auto"	<optional>	"auto"	Defines whether the line is rendered.

NumericValueFormat

Object type that specifies the value formatting and tooltip behavior for the y values.

Properties:

Name	Type	Argument	Default	Description
converter	?(Converter<number>)	<optional>	null	The converter (an instance that duck types oj.Converter) used to format the label. When using a converter, scaling should be set to none, as the formatted result may not be compatible with the scaling suffixes.
scaling	"none" | "thousand" | "million" | "billion" | "trillion" | "quadrillion" | "auto"	<optional>	"auto"	The scaling behavior of the value. When using a converter, scaling should be set to none, as the formatted result may not be compatible with the scaling suffixes.
tooltipDisplay	"off" | "auto"	<optional>	"auto"	Whether the value is displayed in the tooltip.
tooltipLabel	string	<optional>	null	A string representing the label that is displayed before the value in the tooltip.

Overview<C>

Object type defining the overview scrollbar. Only applies if zoomAndScroll is not off. Currently only supported for vertical bar, line, area, stock, and combo charts.

Properties:

Name	Type	Argument	Default	Description
content	C	<optional>	{}	An object containing the property override for the overview chart. The API is the same as the chart property API, and the property provided here will be merged on top of the default property of the overview chart. This can be used to customize the style or the type of the overview chart.
height	string	<optional>	null	Specifies the height of the overview scrollbar in pixels (e.g. '50px') or percent (e.g. '15%').
rendered	"on" | "off"	<optional>	"off"	Specifies whether the overview scrollbar is rendered. If not, simple scrollbar will be used.

PieCenter

Object type defining the center content of a pie chart. Either a label can be displayed at the center of the pie chart or custom HTML content.

Properties:

Name	Type	Argument	Default	Description
converter	?(Converter<number>)	<nullable>	null	The converter (an instance that duck types oj.Converter) used to format the label if it is numeric. When using a converter, scaling should be set to none, as the formatted result may not be compatible with the scaling suffixes.
label	number | string	<optional>	null	Specifies the text for the label. When a innerRadius is specified, the label will automatically be scaled to fit within the inner circle. If the innerRadius is 0, the default font size will be used.
labelStyle	Partial<CSSStyleDeclaration>	<optional>	{}	The CSS style object defining the style of the label. The following style properties are supported: color, cursor, fontFamily, fontSize, fontStyle, fontWeight, textDecoration.
renderer	oj.dvtBaseComponent.PreventableDOMRendererFunction.<oj.ojChart.PieCenterRendererContext>	<optional>	null	A function that returns custom center content. The function takes a PieCenterRendererContext argument, provided by the chart, and returns an object with the following properties: insert: HTMLElement | string - HTML content, which will be overlaid on top of the pie chart. The HTML content will block interactivity of the chart by default, but the CSS pointer-events property can be set to 'none' on this content if the chart's interactivity is desired. preventDefault: true - Indicates that the tooltip should not be displayed. It is not necessary to return {preventDefault:false} to display tooltip, since this is a default behavior.
scaling	"none" | "thousand" | "million" | "billion" | "trillion" | "quadrillion" | "auto"	<optional>	"auto"	The scaling behavior of the label if it is numeric. When using a converter, scaling should be set to none, as the formatted result may not be compatible with the scaling suffixes.

PieCenterContext

Properties:

Name	Type	Description
componentElement	Element	The chart element. Deprecated: Since Description 16.0.0 The componentElement property is deprecated. This shouldn't be needed, as the component template with access to this context is unique to the component.
innerBounds	Object	Object containing (x, y, width, height) of the rectangle inscribed in the center area. The x and y coordinates are relative to the top, left corner of the element. Properties Name Type Description height number The height of the rectangle inscribed in the center area. width number The width of the rectangle inscribed in the center area. x number The x coordinate of the rectangle inscribed in the center area, relative to the top, left corner of the element. y number The y coordinate of the rectangle inscribed in the center area, relative to the top, left corner of the element.
label	string	The pieCenter label.
labelStyle	Partial<CSSStyleDeclaration>=	The CSS style object defining the style of the label. The following style properties are supported: color, cursor, fontFamily, fontSize, fontStyle, fontWeight, textDecoration.
outerBounds	Object	Object containing (x, y, width, height) of the rectangle circumscribing the center area. The x and y coordinates are relative to the top, left corner of the element. Properties Name Type Description height number The height of the rectangle circumscribing the center area. width number The width of the rectangle circumscribing the center area. x number The x coordinate of the rectangle circumscribing the center area, relative to the top, left corner of the element. y number The y coordinate of the rectangle circumscribing the center area, relative to the top, left corner of the element.
totalValue	number	The total of all values in the pie chart.

PieCenterLabelContext

Properties:

Name	Type	Description
subId	string	Sub-id string to identify a particular dom node.

PieCenterRendererContext

Properties:

Name	Type	Description
componentElement	Element	The chart element.
innerBounds	Object	Object containing (x, y, width, height) of the rectangle inscribed in the center area. The x and y coordinates are relative to the top, left corner of the element. Properties Name Type Description height number The height of the rectangle inscribed in the center area. width number The width of the rectangle inscribed in the center area. x number The x coordinate of the rectangle inscribed in the center area, relative to the top, left corner of the element. y number The y coordinate of the rectangle inscribed in the center area, relative to the top, left corner of the element.
label	string	The pieCenter label.
labelStyle	Partial<CSSStyleDeclaration>=	The CSS style object defining the style of the label. The following style properties are supported: color, cursor, fontFamily, fontSize, fontStyle, fontWeight, textDecoration.
outerBounds	Object	Object containing (x, y, width, height) of the rectangle circumscribing the center area. The x and y coordinates are relative to the top, left corner of the element. Properties Name Type Description height number The height of the rectangle circumscribing the center area. width number The width of the rectangle circumscribing the center area. x number The x coordinate of the rectangle circumscribing the center area, relative to the top, left corner of the element. y number The y coordinate of the rectangle circumscribing the center area, relative to the top, left corner of the element.
totalValue	number	The total of all values in the pie chart.

PlotArea

Object type defining the style of the plot area.

Properties:

Name	Type	Argument	Default	Description
backgroundColor	string	<optional>	null	The color of the plot area background.
borderColor	string	<optional>	null	The border color to be set on the chart's plot area.
borderWidth	number	<optional>	null	The border width to be set on the chart's plot area.
rendered	"off" | "on"	<optional>	"on"	Specifies whether the plot area is rendered.

ReferenceObject

Properties:

Name	Type	Description
axis	"xAxis" | "yAxis" | "y2Axis"
index	number	The index of the reference object for the specified axis.
subId	string	Sub-id string to identify a particular dom node.

ReferenceObjectItem<T extends number|string = number|string>

Object type that defines the data for a varying reference object. Only supported for y1 and y2 axes for all chart types.

Properties:

Name	Type	Argument	Default	Description
high	number	<optional>	null	The high value of this point of a varying area reference object.
low	number	<optional>	null	The low value of this point of a varying area reference object.
value	number	<optional>	null	The value of this point of a varying line reference object. Null can be specified to skip a data point.
x	T	<optional>	null	The x value of this point. Mainly used for scatter and bubble charts, and to specify the date for mixed-frequency time axis. For categorical axis, if the x value is not specified, it will default to the item index. For regular time axis, if the x value is not specified, it will default to the group name of the item.

Series<K, I extends Array<ojChart.Item<any, null>>|Array<number>|null>

Object type that defines a chart series.

Properties:

Name	Type	Argument	Default	Description
areaColor	string	<optional>		The area color of the series. Only applies if series type is area or lineWithArea.
areaSvgClassName	string	<optional>		The CSS style class to apply if series type is area or lineWithArea. The style class and inline style will override any other styling specified through the properties. For tooltips and hover interactivity, it's recommended to also pass a representative color to the color attribute.
areaSvgStyle	Partial<CSSStyleDeclaration>=	<optional>		The inline style to apply if series type is area or lineWithArea. The style class and inline style will override any other styling specified through the properties. For tooltips and hover interactivity, it's recommended to also pass a representative color to the color attribute. Only SVG CSS style properties are supported.
assignedToY2	"on" | "off"	<optional>	"off"	Defines whether the series is associated with the y2 axis. Only applies to Cartesian bar, line, area, and combo charts.
borderColor	string	<optional>		The border color of the series.
borderWidth	number	<optional>		The border width of the series.
boxPlot	ojChart.BoxPlotStyle=	<optional>		An object containing the style properties of the box plot series.
categories	Array.<string>	<optional>		An optional array of category strings corresponding to this series. This allows highlighting and filtering of a series through interactions with legend sections. If not defined, the series id is used.
color	string	<optional>		The color of the series. The chart legend item will inherit this color value.
displayInLegend	"on" | "off" | "auto"	<optional>	"auto"	Defines whether the series should be shown in the legend. When set to 'auto', the series will not be displayed in the legend if it has null data or if it is a stock, funnel, or pyramid series.
drilling	"on" | "off" | "inherit"	<optional>	"inherit"	Whether drilling is enabled on the series item. Drillable objects will show a pointer cursor on hover and fire an ojDrill event on click (double click if selection is enabled). To enable drilling for all series items at once, use the drilling attribute in the top level.
id	string | number	<optional>		The id of the series. Defaults to the name or the series index if not specified.
items	(Array<ojChart.Item<K, Array<oj.ojChart.Item<any, null>> | Array<number> | null>> | Array<number>)= (Array<ojChart.Item<K, I> | Array<number> | null>> | Array<number>)=	<optional>		An array of values or an array of objects that defines the data items for the series.
lineStyle	oj.ojChart.LineStyle	<optional>		The line style of the data line. Only applies to line, lineWithArea, scatter, and bubble series.
lineType	"curved" | "stepped" | "centeredStepped" | "segmented" | "centeredSegmented" | "none" | "straight" | "auto"	<optional>		The line type of the data line or area. Only applies to line, area, scatter, and bubble series. centeredStepped and centeredSegmented are not supported for polar, scatter, and bubble charts.
lineWidth	number	<optional>		The width of the data line. Only applies to line, lineWithArea, scatter, and bubble series.
markerColor	string	<optional>		The color of the data markers, if different from the series color.
markerDisplayed	"on" | "off" | "auto"	<optional>		Defines whether the data marker is displayed. Only applies to line, area, scatter, and bubble series. If auto, the markers will be displayed whenever the data points are not connected by a line.
markerShape	"circle" | "diamond" | "human" | "plus" | "square" | "star" | "triangleDown" | "triangleUp" | "auto" | string	<optional>		The shape of the data markers. In addition to the built-in shapes, it may also take SVG path commands to specify a custom shape. The chart will style the custom shapes the same way as built-in shapes, supporting properties like color and borderColor and applying hover and selection effects. Only 'auto' is supported for range series.
markerSize	number	<optional>		The size of the data markers.
markerSvgClassName	string	<optional>		The CSS style class to apply to the data markers. The style class and inline style will override any other styling specified through the properties. For tooltips and hover interactivity, it's recommended to also pass a representative color to the marker color attribute.
markerSvgStyle	Partial<CSSStyleDeclaration>=	<optional>		The inline style to apply to the data markers. The style class and inline style will override any other styling specified through the properties. For tooltips and hover interactivity, it's recommended to also pass a representative color to the marker color attribute. Only SVG CSS style properties are supported.
name	string	<optional>		The name of the series, displayed in the legend and tooltips.
pattern	"smallChecker" | "smallCrosshatch" | "smallDiagonalLeft" | "smallDiagonalRight" | "smallDiamond" | "smallTriangle" | "largeChecker" | "largeCrosshatch" | "largeDiagonalLeft" | "largeDiagonalRight" | "largeDiamond" | "largeTriangle" | "auto"	<optional>	"auto"	The pattern used to fill the series. A solid fill is used by default, unless the seriesEffect is 'pattern'.
pieSliceExplode	number	<optional>	0	A number from 0 to 1 indicating the amount to explode the pie slice. Only applies to pie charts.
shortDesc	string	<optional>		The description of this series. This is used for accessibility and for customizing the tooltip text on the corresponding legend item for the series.
source	string	<optional>		The URI of the custom image. If specified, it takes precedence over shape.
sourceHover	string	<optional>		The optional URI for the hover state. If not specified, the source image will be used.
sourceHoverSelected	string	<optional>		The optional URI for the hover selected state. If not specified, the source image will be used.
sourceSelected	string	<optional>		The optional URI for the selected state. If not specified, the source image will be used.
stackCategory	string	<optional>		In stacked charts, groups series together for stacking. All series without a stackCategory will be assigned to the same stack.
svgClassName	string	<optional>		The CSS style class to apply to the series. For series of type lineWithArea, this style will only be applied to the line if areaSvgClassName is also specified. The style class and inline style will override any other styling specified through the properties. For tooltips and hover interactivity, it's recommended to also pass a representative color to the color attribute.
svgStyle	Partial<CSSStyleDeclaration>=	<optional>		The inline style to apply to the series. For series of type lineWithArea, this style will only be applied to the line if areaSvgStyle is also specified. The style class and inline style will override any other styling specified through the properties. For tooltips and hover interactivity, it's recommended to also pass a representative color to the color attribute. Only SVG CSS style properties are supported.
type	"line" | "area" | "lineWithArea" | "bar" | "candlestick" | "boxPlot" | "auto"	<optional>	"auto"	The type of data objects to display for this series. Only applies to combo and stock charts.

SeriesContext

Context for a legend item that represents the series with the specified index.

Properties:

Name	Type	Description
itemIndex	number	The index of the item within the specified section.
subId	string	Sub-id string to identify a particular dom node.

SeriesTemplateContext<D>

Properties:

Name	Type	Description
componentElement	Element	The <oj-chart> custom element Deprecated: Since Description 16.0.0 The componentElement property is deprecated. This shouldn't be needed, as the component template with access to this context is unique to the component.
id	string	The series id
index	number	The series index
items	Array.<Object>	The array of objects which are chart items that belong to this series. The objects will have the following properties Properties Name Type Description data D The data object for the item index number The zero-based index of the item key any The key of the current item

SeriesValueFormat

Object type that specifies tooltip behavior for the series.

Properties:

Name	Type	Argument	Default	Description
tooltipDisplay	"off" | "auto"	<optional>	"auto"	Whether the value is displayed in the tooltip.
tooltipLabel	string	<optional>	null	A string representing the label that is displayed before the value in the tooltip.

StackLabelContext<K, D, I extends Array.<ojChart.Item<any, null>>|Array.<number>|null>

Properties:

Name	Type	Description
data	Array.<ojChart.Item<K, Array.<oj.ojChart.Item<any, null>> | Array.<number> | null> | number | null> Array.<ojChart.Item<K, I> | number | null>	The array of data for the individual bars being stacked.
groupData	Array.<oj.ojChart.Group> | null	An array of data for the group the data item belongs to. For hierarchical groups, it will be an array of outermost to innermost group data related to the data item.
groups	string | Array.<string>	The id or an array of ids of the group(s) the data items belong to that are being stacked. For hierarchical groups, it will be an array of outermost to innermost group ids.
itemData	Array<D>	The array of itemData for the individual bars being stacked.
value	number	The sum of the values of the individual bars being stacked.

StyleDefaults

Object type defining the default styles for series colors, marker shapes, and other style attributes. Properties specified on this object may be overridden by specifications on the data object.

Properties:

Name	Type	Argument	Default	Description
animationDownColor	string	<optional>	null	The color of the indicator shown for a decreasing data change animation.
animationDuration	number	<optional>	null	The duration of the animations in milliseconds.
animationIndicators	"none" | "all"	<optional>	"all"	Defines whether data change indicators are displayed during animation.
animationUpColor	string	<optional>	null	The color of the indicator shown for an increasing data change animation.
barGapRatio	number	<optional>	null	Specifies the width of the bar group gap as a ratio of the group width. The valid value is a number from 0 to 1.
borderColor	string	<optional>	null	The default border color for the data items. For funnel and pyramid charts, it is used for the slice border.
borderWidth	number	<optional>	null	The default border width for the data items. For funnel and pyramid charts, it is used for the slice border.
boxPlot	oj.ojChart.BoxPlotDefaults	<optional>		An object containing the style properties of the box plot items.
colors	Array.<string>	<optional>	null	The array defining the default color ramp for the series.
dataCursor	oj.ojChart.DataCursorDefaults	<optional>		An object defining the data cursor style.
dataItemGaps	string	<optional>	null	Specifies the presence and size of the gaps between data items, such as bars, markers, and areas. Valid values are a percentage string from 0% to 100%, where 100% produces the maximum supported gaps.
dataLabelCollision	"fitInBounds" | "none"	<optional>	"none"	Rule for adjusting data label layout. If set to fitInBounds, data label positions will be adjusted if they overlap with the chart's major axes or the legend, or go outside the bounds of the chart's plot area.
dataLabelPosition	"center" | "outsideSlice" | "aboveMarker" | "belowMarker" | "beforeMarker" | "afterMarker" | "insideBarEdge" | "outsideBarEdge" | "none" | "auto"	<optional>	"auto"	The position of the data label. For range series, if an array of two values is provided, the first and second value will apply to the low and high point respectively. The 'outsideSlice' value only applies to pie charts. The 'aboveMarker', 'belowMarker', 'beforeMarker', and 'afterMarker' values only apply to line, area, scatter, and bubble series. The 'insideBarEdge' and 'outsideBarEdge' values only apply to non-polar bar series. Stacked bars do not support 'outsideBarEdge'. The chart does not currently adjust layout to fit labels within the plot area or deal with any overlaps between labels.
dataLabelStyle	Partial<CSSStyleDeclaration> | Array.<Partial<CSSStyleDeclaration>>	<optional>	null	The CSS style object defining the style of the data label text. For range series, if an array of two values are provided, the first and second value will apply to the low and high point respectively. The following style properties are supported: color, cursor, fontFamily, fontSize, fontStyle, fontWeight, textDecoration.
funnelBackgroundColor	string	<optional>	null	The default background color of funnel slices that show actual/target values.
groupSeparators	oj.ojChart.GroupSeparatorDefaults	<optional>		An object defining the style for hierarchical label separators.
hoverBehaviorDelay	number	<optional>	null	Specifies initial hover delay in milliseconds for highlighting items in chart.
lineStyle	oj.ojChart.LineStyle	<optional>	"solid"	The line style of the data line. Only applies to line, lineWithArea, scatter, and bubble series.
lineType	"curved" | "stepped" | "centeredStepped" | "segmented" | "centeredSegmented" | "straight" | "none" | "auto"	<optional>	"auto"	The line type of the data line or area. Only applies to line, area, scatter, and bubble series. centeredStepped and centeredSegmented are not supported for polar, scatter, and bubble charts.
lineWidth	number	<optional>	null	The width of the data line. Only applies to line, lineWithArea, scatter, and bubble series.
markerColor	string	<optional>	null	The color of the data markers, if different from the series color.
markerDisplayed	"on" | "off" | "auto"	<optional>	"auto"	Defines whether the data markers should be displayed. Only applies to line, area, scatter, and bubble series. If auto, the markers will be displayed for combo chart and whenever the data points are not connected by a line.
markerShape	"circle" | "diamond" | "human" | "plus" | "square" | "star" | "triangleDown" | "triangleUp" | "auto" | string	<optional>	"auto"	The shape of the data markers. In addition to the built-in shapes, it may also take SVG path commands to specify a custom shape. The chart will style the custom shapes the same way as built-in shapes, supporting properties like color and borderColor and applying hover and selection effects. Only 'auto' is supported for range series.
markerSize	number	<optional>	null	The size of the data markers in pixels.
marqueeBorderColor	string	<optional>	null	The border color of the marquee. Applies to marquee selection and marquee zoom.
marqueeColor	string	<optional>	null	The fill color of the marquee. Applies to marquee selection and marquee zoom.
maxBarWidth	number	<optional>	null	Specifies the maximum width of each bar in pixels.
otherColor	string	<optional>	null	Specifies the color of the "Other" slice. Only applies to pie chart.
patterns	Array.<string>	<optional>	null	The array defining the default pattern ramp for the series. This is used only when seriesEffect is 'pattern'.
pieFeelerColor	string	<optional>	null	The color of the line extending from the pie slice to the slice label.
pieInnerRadius	number	<optional>	0	Specifies the radius of the inner circle that can be used to create a donut chart. Valid values range from 0 (default) to 1. Not supported if 3D effect is on.
selectionEffect	"explode" | "highlightAndExplode" | "highlight"	<optional>	"highlight"	The selection effect that is applied to selected items. The values explode and highlightAndExplode only apply to pie charts.
seriesEffect	"color" | "pattern" | "gradient"	<optional>	"color"	Defines the fill effect for the data items.
shapes	Array.<string>	<optional>	null	The array defining the default shape ramp for the series. Valid values are defined in the markerShape attribute.
stackLabelStyle	Partial<CSSStyleDeclaration>	<optional>	{}	The CSS style object defining the style of the stack label. Only applies to stacked bar charts. The following style properties are supported: color, cursor, fontFamily, fontSize, fontStyle, fontWeight, textDecoration.
stockFallingColor	string	<optional>	null	In stock charts, the color of the candlestick when the 'open' value is greater than the 'close' value.
stockRangeColor	string	<optional>	null	In stock charts, the color of the range bars for candlestick.
stockRisingColor	string	<optional>	null	In stock charts, the color of the candlestick when the 'close' value is greater than the 'open' value.
stockVolumeColor	string	<optional>	null	In stock charts, the color of the volume bars. If specified, overrides the default rising and falling colors used by the volume bars.
threeDEffect	"on" | "off"	<optional>	"off"	Defines whether the chart is displayed with a 3D effect. Only applies to pie, funnel and pyramid charts.
tooltipLabelStyle	Partial<CSSStyleDeclaration>	<optional>	{}	The CSS style object defining the style of the labels in the tooltip. The following style properties are supported: color, cursor, fontFamily, fontSize, fontStyle, fontWeight, textDecoration.
tooltipValueStyle	Partial<CSSStyleDeclaration>	<optional>	{}	The CSS style object defining the style of the values in the tooltip. The following style properties are supported: color, cursor, fontFamily, fontSize, fontStyle, fontWeight, textDecoration.

TooltipContext<K, D, I extends Array<ojChart.Item<any, null>>|Array<number>|null>

Properties:

Name	Type	Description
close	number	The close value of the hovered stock chart item.
color	string	The color of the hovered item.
componentElement	Element	The chart element. Deprecated: Since Description 16.0.0 The componentElement property is deprecated. This shouldn't be needed, as the component template with access to this context is unique to the component.
data	ojChart.Item<K, Array<oj.ojChart.Item<any, null>> | Array<number> | null> | number | null oj.ojChart.Item.<K, I> | Array<number> | null> | number | null	The data object of the hovered item. For nested items, it will be an array containing the parent item data and nested item data.
group	string | Array.<string>	The ids or an array of ids of the group(s) the hovered item belongs to. For hierarchical groups, it will be an array of outermost to innermost group ids.
groupData	Array.<oj.ojChart.Group> | null	An array of data for the group the hovered item belongs to. For hierarchical groups, it will be an array of outermost to innermost group data related to the hovered item.
high	number	The high value of the data item present in range bar/area, stock candlestick, or box plot item.
id	any	The id of the hovered item.
itemData	D	The row data object for the hovered item. This will only be set if a DataProvider is being used.
label	string	The data label of the hovered item.
low	number	The low value of the data item present in range bar/area, stock candlestick, or box plot item.
open	number	The open value of the hovered stock chart item.
parentElement	Element	The tooltip element. This can be used to change the tooltip border or background color.
q1	number	The first quartile value of the hovered the box plot item.
q2	number	The second quartile (median) value of the hovered box plot item.
q3	number	The third quartile value of the hovered box plot item.
series	string	The id of the series the hovered item belongs to.
seriesData	oj.ojChart.Series.<K, I> | null	The data for the series the hovered item belongs to.
targetValue	number	The target value of the hovered funnel item.
totalValue	number	The total of all values in the chart. This will only be included for pie charts.
value	number	The value of the hovered item.
volume	number	The volume value of the hovered stock chart item.
x	number | string	The x value of the hovered item.
y	number	The y value of the hovered item.
z	number	The z value of the hovered item.

TooltipRendererContext<K, D, I extends Array<ojChart.Item<any, null>>|Array<number>|null>

Properties:

Name	Type	Description
close	number	The close value of the hovered stock chart item.
color	string	The color of the hovered item.
componentElement	Element	The chart element.
data	ojChart.Item<K, Array<oj.ojChart.Item<any, null>> | Array<number> | null> | number | null oj.ojChart.Item.<K, I> | Array<number> | null> | number | null	The data object of the hovered item. For nested items, it will be an array containing the parent item data and nested item data.
group	string | Array.<string>	The ids or an array of ids of the group(s) the hovered item belongs to. For hierarchical groups, it will be an array of outermost to innermost group ids.
groupData	Array.<oj.ojChart.Group> | null	An array of data for the group the hovered item belongs to. For hierarchical groups, it will be an array of outermost to innermost group data related to the hovered item.
high	number	The high value of the data item present in range bar/area, stock candlestick, or box plot item.
id	any	The id of the hovered item.
itemData	D	The row data object for the hovered item. This will only be set if a DataProvider is being used.
label	string	The data label of the hovered item.
low	number	The low value of the data item present in range bar/area, stock candlestick, or box plot item.
open	number	The open value of the hovered stock chart item.
parentElement	Element	The tooltip element. This can be used to change the tooltip border or background color.
q1	number	The first quartile value of the hovered the box plot item.
q2	number	The second quartile (median) value of the hovered box plot item.
q3	number	The third quartile value of the hovered box plot item.
series	string	The id of the series the hovered item belongs to.
seriesData	oj.ojChart.Series.<K, I> | null	The data for the series the hovered item belongs to.
targetValue	number	The target value of the hovered funnel item.
totalValue	number	The total of all values in the chart. This will only be included for pie charts.
value	number	The value of the hovered item.
volume	number	The volume value of the hovered stock chart item.
x	number | string	The x value of the hovered item.
y	number	The y value of the hovered item.
z	number	The z value of the hovered item.

ValueFormats

Object type specifying value formatting and tooltip behavior, whose keys generally correspond to the attribute names on the data items.

Properties:

Name	Type	Argument	Description
close	oj.ojChart.NumericValueFormat	<optional>	Specifies the value formatting and tooltip behavior for the close values of a stock chart.
group	oj.ojChart.GroupValueFormat	<optional>	Specifies tooltip behavior for the groups.
high	oj.ojChart.NumericValueFormat	<optional>	Specifies the value formatting and tooltip behavior for the high values.
label	oj.ojChart.LabelValueFormat	<optional>	Specifies the value formatting for the data item labels.
low	oj.ojChart.NumericValueFormat	<optional>	Specifies the value formatting and tooltip behavior for the low values.
open	oj.ojChart.NumericValueFormat	<optional>	Specifies the value formatting and tooltip behavior for the open values of a stock chart.
q1	oj.ojChart.NumericValueFormat	<optional>	Specifies the value formatting and tooltip behavior for the q1 values of a box plot.
q2	oj.ojChart.NumericValueFormat	<optional>	Specifies the value formatting and tooltip behavior for the q2 values of a box plot.
q3	oj.ojChart.NumericValueFormat	<optional>	Specifies the value formatting and tooltip behavior for the q3 values of a box plot.
series	oj.ojChart.SeriesValueFormat	<optional>	Specifies tooltip behavior for the series.
targetValue	oj.ojChart.NumericValueFormat	<optional>	Specifies the value formatting and tooltip behavior for the target values of a funnel chart.
value	oj.ojChart.NumericValueFormat	<optional>	Specifies the value formatting and tooltip behavior for the values.
volume	oj.ojChart.NumericValueFormat	<optional>	Specifies the value formatting and tooltip behavior for the volume values of a stock chart.
x	oj.ojChart.CategoricalValueFormat	<optional>	Specifies the value formatting and tooltip behavior for the x values.
y	oj.ojChart.NumericValueFormat	<optional>	Specifies the value formatting and tooltip behavior for the y values.
y2	oj.ojChart.NumericValueFormat	<optional>	Specifies the value formatting and tooltip behavior for the y2 values.
z	oj.ojChart.NumericValueFormat	<optional>	Specifies the value formatting and tooltip behavior for the z values.

XAxis<T extends number|string = number|string>

Object type that defines the x-axis.

Properties:

Name	Type	Argument	Default	Description
axisLine	oj.ojChart.AxisLine	<optional>		An object defining properties for the axis line.
baselineScaling	"min" | "zero"	<optional>	"zero"	Defines whether the axis baseline starts at the minimum value of the data or at zero. Only applies to numerical data axes.
dataMax	number	<optional>	null	Normally the chart code must go through the data to calculate the max value, which is in turn used to generate the axis max. If the max value is already known then the max value calculation can be avoided by setting dataMax, which improves performance.
dataMin	number	<optional>	null	The minimum data value corresponding to an axis. If specified, the automatic axis extent calculation will use this value. Only applies to numerical axes.
majorTick	oj.ojChart.MajorTick	<optional>		An object defining properties for the major tick marks.
max	T	<optional>	null	The maximum value of the axis. Defaults to null for automatic calculation based on the data. For categorical axes, the value represents the group index. For example, 0 is the position of the first group, and 1.5 is the position half way between the second and the third group.
maxSize	string	<optional>	null	Defines the maximum size of the axis in pixels (e.g. '50px') or percent (e.g. '15%').
min	T	<optional>	null	The minimum value of the axis. Defaults to null for automatic calculation based on the data. For categorical axes, the value represents the group index. For example, 0 is the position of the first group, and 1.5 is the position half way between the second and the third group.
minStep	number	<optional>	null	The minimum increment between major tick marks. This is typically used to prevent fractional axis values for discrete measures. Only applies to numerical axes.
minorStep	number	<optional>	null	The increment between minor tick marks. Defaults to null for automatic calculation based on the data. Only applies to numerical axes. For log axis, the step is a multiplier, so for example, if the minorStep is 2, the minor tick marks will be rendered at 1, 2, 4, 8, and so on.
minorTick	oj.ojChart.MinorTick	<optional>		An object defining properties for the minor tick marks.
referenceObjects	Array.<oj.ojChart.XReferenceObject.<T>>	<optional>	[]	The array of reference objects associated with the axis.
rendered	"off" | "on"	<optional>	"on"	Defines whether the axis is rendered.
scale	"log" | "linear"	<optional>	"linear"	Defines the axis scale. Only applies to numerical axes.
size	string	<optional>	null	Defines the size of the axis in pixels (e.g. '50px') or percent (e.g. '15%').
step	number	<optional>	null	The increment between major tick marks. Defaults to null for automatic calculation based on the data. Only applies to time and numerical axes. For log axis, the step is a multiplier, so for example, if the step is 2, the major tick marks will be rendered at 1, 2, 4, 8, and so on.
tickLabel	oj.ojChart.XTickLabel.<T>	<optional>		An object defining the properties of the tick labels.
title	string	<optional>	null	The axis title. Does not apply to polar charts.
titleStyle	Partial<CSSStyleDeclaration>	<optional>	{}	The CSS style object defining the style of the axis title. The CSS white-space property can be defined with value "nowrap" to disable default text wrapping of the title. The following style properties are supported: color, cursor, fontFamily, fontSize, fontStyle, fontWeight, textDecoration.
viewportEndGroup	T	<optional>	null	Specifies the end group of the current viewport. Only applies to charts with group or time axis. If not specified, the default end group is the last group in the data set. The application should set either the viewportMax or viewportEndGroup and not both at the same time. If both viewportEndGroup and viewportMax are specified, viewportMax takes precedence.
viewportMax	T	<optional>	null	Specifies the maximum x coordinate of the current viewport for zoom and scroll. For group axis, the group index will be treated as the axis coordinate. If both viewportEndGroup and viewportMax are specified, then viewportMax takes precedence. If not specified, this value will be the axis max.
viewportMin	T	<optional>	null	Specifies the minimum x coordinate of the current viewport for zoom and scroll. For group axis, the group index will be treated as the axis coordinate. If both viewportStartGroup and viewportMin are specified, then viewportMin takes precedence. If not specified, this value will be the axis min.
viewportStartGroup	T	<optional>	null	Specifies the start group of the current viewport. Only applies to charts with group or time axis. If not specified, the default start group is the first group in the data set. The application should set either the viewportMin or viewportStartGroup and not both at the same time. If both viewportStartGroup and viewportMin are specified, viewportMin takes precedence.

XReferenceObject<T extends number|string = number|string>

Object type that defines a reference object associated with the x-axis.

Properties:

Name	Type	Argument	Default	Description
categories	Array.<string>	<optional>	null	An optional array of category strings corresponding to this reference object. This allows highlighting and filtering of a reference object through interactions with legend sections. If not defined, the reference object id is used.
color	string	<optional>	null	The color of the reference object.
displayInLegend	"on" | "off"	<optional>	"off"	Defines whether the reference object should be shown in the legend.
high	T	<optional>	null	The high value of an area reference object. For categorical axes, the value represents the group id(string) or group index(number). For example, when using group indices, 0 is the position of the first group, and 1.5 is the position half way between the second and the third group. See type for more details.
id	string	<optional>	null	The id of the reference object.
lineStyle	oj.ojChart.LineStyle	<optional>	"solid"	The line style of the line reference object. Does not apply to area reference objects.
lineWidth	number	<optional>	null	The width of the line reference object. Does not apply to area reference objects.
location	"front" | "back"	<optional>	"back"	The location of the reference object relative to the data items.
low	T	<optional>	null	The low value of an area reference object. For categorical axes, the value represents the group id(string) or group index(number). For example, when using group indices, 0 is the position of the first group, and 1.5 is the position half way between the second and the third group. See type for more details.
shortDesc	string	<optional>	null	The description of this object. This is used for accessibility and also for customizing the tooltip text.
svgClassName	string	<optional>	null	The CSS style class to apply to the reference object. The style class and inline style will override any other styling specified through the properties. For tooltips and hover interactivity, it's recommended to also pass a representative color to the reference object color attribute.
svgStyle	Partial<CSSStyleDeclaration>	<optional>	null	The CSS inline style to apply to the reference object. The style class and inline style will override any other styling specified through the properties. For tooltips and hover interactivity, it's recommended to also pass a representative color to the reference object color attribute. Only SVG CSS style properties are supported.
text	string	<optional>	null	The text displayed in the legend for the reference object.
type	"area" | "line"	<optional>	"line"	The type of reference object being shown. If the value is set to "area", use the low and high properties of the reference object. Otherwise, use the value property.
value	T	<optional>	null	The value of a line reference object. This property defines a constant value across the entire reference object. For categorical axes, the value represents the group id(string) or group index(number). For example, when using group indices, 0 is the position of the first group, and 1.5 is the position half way between the second and the third group. See type for more details.

XTickLabel<T extends number|string = number|string>

Object type that defines a tick label for x-axis.

Properties:

Name	Type	Argument	Default	Description
converter	?(Array.<Converter<T>> | Converter<T>)	<optional>	null	The converter (an instance that duck types oj.Converter) used to format the labels. When using a time axis, this attribute also takes an array of two converters, which apply respectively to the first and second label levels. When using a converter, scaling should be set to none, as the formatted result may not be compatible with the scaling suffixes.
rendered	"off" | "on"	<optional>	"on"	Defines whether the tick labels are rendered.
rotation	"none" | "auto"	<optional>	"auto"	Defines whether the chart will automatically rotate the labels by 90 degrees in order to fit more labels on the axis. The rotation will only be applied to categorical labels for a horizontal axis.
scaling	"none" | "thousand" | "million" | "billion" | "trillion" | "quadrillion" | "auto"	<optional>	"auto"	The scaling behavior of the labels. When using a converter, scaling should be set to none, as the formatted result may not be compatible with the scaling suffixes.
style	Partial<CSSStyleDeclaration>	<optional>	{}	The CSS style object defining the style of the labels. The CSS white-space property can be defined with value "nowrap" to disable default text wrapping of categorical labels. The following style properties are supported: color, cursor, fontFamily, fontSize, fontStyle, fontWeight, textDecoration.

Y2Axis

Object type that defines the y2-axis.

Properties:

Name	Type	Argument	Default	Description
alignTickMarks	"off" | "on"	<optional>	"on"	Defines whether the tick marks of the y1 and y2 axes are aligned. Not supported for logarithmic axes.
axisLine	oj.ojChart.AxisLine	<optional>		An object defining properties for the axis line.
baselineScaling	"min" | "zero"	<optional>	"zero"	Defines whether the axis baseline starts at the minimum value of the data or at zero. Only applies to numerical data axes.
dataMax	number	<optional>	null	Normally the chart code must go through the data to calculate the max value, which is in turn used to generate the axis max. If the max value is already known then the max value calculation can be avoided by setting dataMax, which improves performance.
dataMin	number	<optional>	null	The minimum data value corresponding to an axis. If specified, the automatic axis extent calculation will use this value. Only applies to numerical axes.
majorTick	oj.ojChart.MajorTick	<optional>		An object defining properties for the major tick marks.
max	number	<optional>	null	The maximum value of the axis. Defaults to null for automatic calculation based on the data.
maxSize	string	<optional>	null	Defines the maximum size of the axis in pixels (e.g. '50px') or percent (e.g. '15%').
min	number	<optional>	null	The minimum value of the axis. Defaults to null for automatic calculation based on the data.
minStep	number	<optional>	null	The minimum increment between major tick marks. This is typically used to prevent fractional axis values for discrete measures. Only applies to numerical axes.
minorStep	number	<optional>	null	The increment between minor tick marks. Defaults to null for automatic calculation based on the data. Only applies to numerical axes. For log axis, the step is a multiplier, so for example, if the minorStep is 2, the minor tick marks will be rendered at 1, 2, 4, 8, and so on.
minorTick	oj.ojChart.MinorTick	<optional>		An object defining properties for the minor tick marks.
position	"start" | "end" | "top" | "bottom" | "auto"	<optional>	"auto"	The position of the axis relative to its content. For vertical charts, only start and end apply. For horizontal charts, only top and bottom apply.
referenceObjects	Array.<oj.ojChart.YReferenceObject>	<optional>	[]	The array of reference objects associated with the axis.
rendered	"off" | "on"	<optional>	"on"	Defines whether the axis is rendered.
scale	"log" | "linear"	<optional>	"linear"	Defines the axis scale. Only applies to numerical axes.
size	string	<optional>	null	Defines the size of the axis in pixels (e.g. '50px') or percent (e.g. '15%').
step	number	<optional>	null	The increment between major tick marks. Defaults to null for automatic calculation based on the data. Only applies to time and numerical axes. For log axis, the step is a multiplier, so for example, if the step is 2, the major tick marks will be rendered at 1, 2, 4, 8, and so on.
tickLabel	oj.ojChart.YTickLabel	<optional>		An object defining the properties of the tick labels.
title	string	<optional>	null	The axis title. Does not apply to polar charts.
titleStyle	Partial<CSSStyleDeclaration>	<optional>	{}	The CSS style object defining the style of the axis title. The CSS white-space property can be defined with value "nowrap" to disable default text wrapping of the title. The following style properties are supported: color, cursor, fontFamily, fontSize, fontStyle, fontWeight, textDecoration.

YAxis

Object type that defines the y-axis.

Properties:

Name	Type	Argument	Default	Description
axisLine	oj.ojChart.AxisLine	<optional>		An object defining properties for the axis line.
baselineScaling	"min" | "zero"	<optional>	"zero"	Defines whether the axis baseline starts at the minimum value of the data or at zero. Only applies to numerical data axes.
dataMax	number	<optional>	null	Normally the chart code must go through the data to calculate the max value, which is in turn used to generate the axis max. If the max value is already known then the max value calculation can be avoided by setting dataMax, which improves performance.
dataMin	number	<optional>	null	The minimum data value corresponding to an axis. If specified, the automatic axis extent calculation will use this value. Only applies to numerical axes.
majorTick	oj.ojChart.MajorTick	<optional>		An object defining properties for the major tick marks.
max	number	<optional>	null	The maximum value of the axis. Defaults to null for automatic calculation based on the data.
maxSize	string	<optional>	null	Defines the maximum size of the axis in pixels (e.g. '50px') or percent (e.g. '15%').
min	number	<optional>	null	The minimum value of the axis. Defaults to null for automatic calculation based on the data.
minStep	number	<optional>	null	The minimum increment between major tick marks. This is typically used to prevent fractional axis values for discrete measures. Only applies to numerical axes.
minorStep	number	<optional>	null	The increment between minor tick marks. Defaults to null for automatic calculation based on the data. Only applies to numerical axes. For log axis, the step is a multiplier, so for example, if the minorStep is 2, the minor tick marks will be rendered at 1, 2, 4, 8, and so on.
minorTick	oj.ojChart.MinorTick	<optional>		An object defining properties for the minor tick marks.
position	"start" | "end" | "top" | "bottom" | "auto"	<optional>	"auto"	The position of the axis relative to its content. For vertical charts, only start and end apply. For horizontal charts, only top and bottom apply.
referenceObjects	Array.<oj.ojChart.YReferenceObject>	<optional>	[]	The array of reference objects associated with the axis.
rendered	"off" | "on"	<optional>	"on"	Defines whether the axis is rendered.
scale	"log" | "linear"	<optional>	"linear"	Defines the axis scale. Only applies to numerical axes.
size	string	<optional>	null	Defines the size of the axis in pixels (e.g. '50px') or percent (e.g. '15%').
step	number	<optional>	null	The increment between major tick marks. Defaults to null for automatic calculation based on the data. Only applies to time and numerical axes. For log axis, the step is a multiplier, so for example, if the step is 2, the major tick marks will be rendered at 1, 2, 4, 8, and so on.
tickLabel	oj.ojChart.YTickLabel	<optional>		An object defining the properties of the tick labels.
title	string	<optional>	null	The axis title. Does not apply to polar charts.
titleStyle	Partial<CSSStyleDeclaration>	<optional>	{}	The CSS style object defining the style of the axis title. The CSS white-space property can be defined with value "nowrap" to disable default text wrapping of the title. The following style properties are supported: color, cursor, fontFamily, fontSize, fontStyle, fontWeight, textDecoration.
viewportMax	number	<optional>	null	Specifies the maximum y coordinate of the current viewport for zoom and scroll. Only applies to bubble and scatter charts. If not specified, this value will be the axis max.
viewportMin	number	<optional>	null	Specifies the minimum y coordinate of the current viewport for zoom and scroll. Only applies to bubble and scatter charts. If not specified, this value will be the axis min.

YReferenceObject

Object type that defines a reference object associated with the y-axis.

Properties:

Name	Type	Argument	Default	Description
categories	Array.<string>	<optional>	null	An optional array of category strings corresponding to this reference object. This allows highlighting and filtering of a reference object through interactions with legend sections. If not defined, the reference object id is used.
color	string	<optional>	null	The color of the reference object.
displayInLegend	"on" | "off"	<optional>	"off"	Defines whether the reference object should be shown in the legend.
high	number	<optional>	null	The high value of an area reference object. This property defines a constant value across the entire reference area and is ignored if the items property is specified. See type for more details.
id	string	<optional>	null	The id of the reference object.
items	Array.<oj.ojChart.ReferenceObjectItem>	<optional>	null	An array of values or an array of objects with the following properties that define the data for a varying reference object. Only supported for y1 and y2 axes for all chart types.
lineStyle	oj.ojChart.LineStyle	<optional>	"solid"	The line style of the line reference object. Does not apply to area reference objects.
lineType	oj.ojChart.LineType	<optional>	"straight"	The line type of the varying reference object. "centeredStepped" and "centeredSegmented" are not supported for polar, scatter, and bubble charts. See items for more details about varying reference objects.
lineWidth	number	<optional>	null	The width of the line reference object. Does not apply to area reference objects.
location	"front" | "back"	<optional>	"back"	The location of the reference object relative to the data items.
low	number	<optional>	null	The low value of an area reference object. This property defines a constant value across the entire reference area and is ignored if the items property is specified. See type for more details.
shortDesc	string	<optional>	null	The description of this object. This is used for accessibility and also for customizing the tooltip text.
svgClassName	string	<optional>	null	The CSS style class to apply to the reference object. The style class and inline style will override any other styling specified through the properties. For tooltips and hover interactivity, it's recommended to also pass a representative color to the reference object color attribute.
svgStyle	Partial<CSSStyleDeclaration>	<optional>	null	The CSS inline style to apply to the reference object. The style class and inline style will override any other styling specified through the properties. For tooltips and hover interactivity, it's recommended to also pass a representative color to the reference object color attribute. Only SVG CSS style properties are supported.
text	string	<optional>	null	The text displayed in the legend for the reference object.
type	"area" | "line"	<optional>	"line"	The type of reference object being shown. If the value is set to "area", use the low and high properties of the reference object. Otherwise, use the value property.
value	number	<optional>	null	The value of a line reference object. This property defines a constant value across the entire reference object and is ignored if the items property is specified. See type for more details.

YTickLabel

Object type that defines a tick label for y-axis.

Properties:

Name	Type	Argument	Default	Description
converter	?(Converter<number>)	<optional>	null	The converter (an instance that duck types oj.Converter) used to format the labels. When using a time axis, this attribute also takes an array of two converters, which apply respectively to the first and second label levels. When using a converter, scaling should be set to none, as the formatted result may not be compatible with the scaling suffixes.
position	"inside" | "outside"	<optional>	"outside"	Defines the position of the tick labels relative to the plot area. Inside position is not supported for scatter and bubble charts.
rendered	"off" | "on"	<optional>	"on"	Defines whether the tick labels are rendered.
scaling	"none" | "thousand" | "million" | "billion" | "trillion" | "quadrillion" | "auto"	<optional>	"auto"	The scaling behavior of the labels. When using a converter, scaling should be set to none, as the formatted result may not be compatible with the scaling suffixes.
style	Partial<CSSStyleDeclaration>	<optional>	{}	The CSS style object defining the style of the labels. The CSS white-space property can be defined with value "nowrap" to disable default text wrapping of categorical labels. The following style properties are supported: color, cursor, fontFamily, fontSize, fontStyle, fontWeight, textDecoration.