Overview

OChartComponent

Directive: o-chart

Inherited inputs

• from OServiceBaseComponent:
  • attr
  • columns
  • configure-service-args
  • entity
  • keys
  • pageable
  • parent-keys
  • query-fallback-function
  • query-method
  • query-on-bind
  • query-on-init
  • query-rows
  • query-with-null-parent-keys
  • service
  • service-type
  • static-data
  • store-state

Inputs

Name	Since	Description	Default
active-entries array		Defines the chart elements that should be displayed as active or highlighted.
auto-scale boolean		Automatically sets the minimum Y axis value to the minimum value in the data instead of zero.
chart-height number		Set the height of the chart in pixels.
chart-parameters		Control properties of styling, fonts, the legend, etc.
chart-width number		Set the width of the chart in pixels.
color object|string		Modifies the color palette of the chart. Accepts an object in the format { domain: [‘#xxxx’, ‘#xxxx’, ‘#xxxx’] } or a theme name (‘vivid’, ‘natural’, ‘cool’, ‘fire’, ‘solar’, ‘air’, ‘aqua’, ‘flame’, ‘ocean’, ‘forest’, ‘horizon’, ‘neons’, ‘picnic’, ‘night’, ‘nightLights’)
color object|string		Modifies the color palette of the chart. Accepts an object in the format { domain: [‘#xxxx’, ‘#xxxx’, ‘#xxxx’] } or a theme name (‘vivid’, ‘natural’, ‘cool’, ‘fire’, ‘solar’, ‘air’, ‘aqua’, ‘flame’, ‘ocean’, ‘forest’, ‘horizon’, ‘neons’, ‘picnic’, ‘night’, ‘nightLights’)
custom-colors any		Defines custom colors to override the default color scheme for specific values or series.
data array		Defines the array of data to be displayed on the chart
gradient boolean		Enables gradient fill instead of solid colors for chart elements.
legend-position string		Allows modifying the position of the legend. Values can be ‘right’ or ‘below’.
legend-position string		Allows modifying the position of the legend. Values can be ‘right’ or ‘below’.
legend-title string		Title to be displayed on the legend.
legend-title string		Title to be displayed on the legend.
show-data-label boolean		Controls whether data labels are displayed directly on chart elements.
show-grid-lines boolean		Controls whether the grid lines are displayed on the chart.
show-grid-lines boolean		Controls whether the grid lines are displayed on the chart.
show-legend boolean		Controls whether the legend is displayed.
show-tooltip boolean		Controls whether the tooltip is displayed when hovering chart elements.
show-x-axis boolean		Controls whether the X axis is displayed.	true
show-x-axis-label boolean		Controls whether the X axis label is displayed.	true
show-y-axis boolean		Controls whether the Y axis is displayed.	true
show-y-axis-label boolean		Controls whether the Y axis label is displayed.	true
type string		Defines the type of graph to be painted (discreteBar, donutChart, line, multiBar, multiBarHorizontalChart, pie, stackedAreaChart)
x-axis string		Defines the data to be displayed on X axis
x-data-type string		Type of data displayed on X axis
x-formatting any		Defines a formatting function or configuration for X axis values.
x-label string		Label to be displayed on X axis
y-axis string		Defines the data to be displayed on Y axis
y-data-type string		Type of data displayed on Y axis
y-formatting any		Defines a formatting function or configuration for Y axis values.
y-label string		Label to be displayed on Y axis

Outputs

Name	Since	Description
onActivate		Element activation event triggered when the mouse enters an element in the chart.
onDataLoaded		Event triggered when the data is loaded
onDeactivate		Element deactivation event triggered when the mouse leaves an element in the chart.
onSelect		Click event triggered when an element in the chart is clicked.