Factory for ChartXY. This chart visualizes the data using the Cartesian coordinate system. It has a multitude of methods for adding various types of Series.
This Factory can be supplied with an options object, which - along with EngineOptions - can also contain properties of ChartXYOptions-interface, which can be used for:
Specifying TickStrategies for default X or Y Axes'. This is mostly used for creating DateTime Axes.
Supplying a custom Builder for the AutoCursor of Chart. This can be used to modify the AutoCursor on a level, which can't be done during runtime. For example, changing the shape of ResultTable Background, Etc.
Example usage:
| Desired result | Usage |
|---|---|
| ChartXY with default AutoCursor and Axes | ChartXY() |
| ChartXY embedded in a DOM element | ChartXY({ containerId: 'chart_div_id' }) |
More ChartXY specific examples can be found in documentation of ChartXYOptions.
Factory for Dashboard. Dashboard allows placement of multiple Charts, sharing a common rendering engine between them. It also enables users to resize the cells with mouse/touch interaction.
Example usage:
| Desired result | Usage |
|---|---|
| Dashboard with 2 columns and 3 rows | Dashboard({ numberOfColumns: 2, numberOfRows: 3 }) |
| Dashboard embedded in a DOM element | Dashboard({ ..., containerId: 'dashboard_div_id' }) |
When creating a Dashboard the Factory MUST be supplied with an object which fulfills the DashboardOptions-interface. This object can also optionally contain properties of EngineOptions.
Factory for FunnelChart. This chart visualizes proportions and percentages between categories,
This Factory can be supplied with an options object, which - along with EngineOptions - can also contain properties of FunnelChartOptions-interface, which can be used for:
Example usage:
| Desired result | Usage |
|---|---|
| Funnel Chart with default type | Funnel() |
| Funnel Chart with specified type | Funnel({ type: FunnelChartTypes.LabelsOnSides }) |
| Funnel Chart embedded in a DOM element | Funnel({ containerId: 'chart_div_id' }) |
More FunnelChart specific examples can be found in documentation of FunnelChartOptions.
Factory for GaugeChart. Gauge charts indicate where your data point(s) falls over a particular range. This chart type is often used in executive dashboard reports to show key business indicators.
This Factory can be supplied with an options object, which - along with EngineOptions - can also contain properties of GaugeChartOptions-interface, which can be used for:
Example usage:
| Desired result | Parameter |
|---|---|
| Gauge Chart with default type | undefined or omitted |
| Gauge Chart with specified type | { type: GaugeChartTypes.Solid } |
| Gauge Chart embedded in a DOM element | { containerId: 'chart_div_id' } |
More GaugeChart specific examples can be found in documentation of GaugeChartOptions.
Factory for PieChart. This chart visualizes proportions and percentages between categories, by dividing a circle into proportional segments.
This Factory can be supplied with an options object, which - along with EngineOptions - can also contain properties of PieChartOptions-interface, which can be used for:
Example usage:
| Desired result | Usage |
|---|---|
| Pie Chart with default type | Pie() |
| Pie Chart with specified type | Pie({ type: PieChartTypes.PieChartWithLabelsOnSides }) |
| Pie Chart embedded in a DOM element | Pie({ containerId: 'chart_div_id' }) |
More PieChart specific examples can be found in documentation of PieChartOptions.
Factory for PyramidChart. This chart visualizes proportions and percentages between categories,
This Factory can be supplied with an options object, which - along with EngineOptions - can also contain properties of PyramidChartOptions-interface, which can be used for:
Example usage:
| Desired result | Usage |
|---|---|
| Pyramid Chart with default type | Pyramid() |
| Pyramid Chart with specified type | Pyramid({ type: PyramidChartTypes.LabelsOnSides }) |
| Pyramid Chart embedded in a DOM element | Pyramid({ containerId: 'chart_div_id' }) |
More PyramidChart specific examples can be found in documentation of PyramidChartOptions.
Factory for SpiderChart. This chart visualizes data in a radial form as dissected by named axes.
This Factory can be supplied with an options object, which - along with EngineOptions - can also contain properties of SpiderChartOptions-interface, which can be used for:
Example usage:
| Desired result | Usage |
|---|---|
| Spider Chart with default AutoCursor | Spider() |
| Spider Chart embedded in a DOM element | Spider({ containerId: 'chart_div_id' }) |
More SpiderChart specific examples can be found in documentation of SpiderChartOptions.
Factory for UIPanel. This component simply allows the anchoring of user-made UIElements.
Can optionally be supplied with an options object that fulfills the EngineOptions-interface. This can be used to setup the rendering environment of the Panel.
Example usage:
| Desired result | Usage |
|---|---|
| UIPanel | UIPanel() |
| UIPanel embedded in a DOM element | UIPanel({ containerId: 'panel_div_id' }) |
Interface for factories of Charting components.
Each property of this interface is a Factory for creating LCJS components. They are functions which all have one parameter (might be optional), which is used to pass options to the created component.
All components are able to handle the options defined by interface: EngineOptions, which can be used to setup the rendering environment for the component. Most importantly this is used to embed the component in a DOM element created by the user.