TypeScript Types

OrbCharts is written in TypeScript, and its main types are all exported from @orbcharts/core. This page lists them grouped by purpose, with links to the relevant detail pages.

import type { RawData, Encoding, EventData } from '@orbcharts/core'

Data input

The raw data you provide to a chart. For the full format, see Data formats overview.

type RawData = RawDataColumn[] | RawDataColumn[][]

RawDataColumn[] is a single dataset; RawDataColumn[][] is multi-dataset (2D).

The fields of RawDataColumn:

Field	Type	Description
`id`	`string`	Unique identifier
`name`	`string`	Display name
`source`	`string`	Source node (for graphs)
`target`	`string`	Target node (for graphs)
`parent`	`string`	Parent node (for trees)
`data`	`any`	Attached custom data
`value`	`number \| null`	Numeric value
`x` / `y` / `z`	`number \| null`	Multivariate coordinate values
`dataset`	—	Dataset grouping (renamable via Encoding)
`series`	—	Series grouping (renamable via Encoding)
`category`	—	Category grouping (renamable via Encoding)

Tip: The first six fields (id, name, source, target, parent, data) are fixed; dataset, series, category, and the like can be mapped to other field names via Encoding.

Configuration types

Type	Description	See
`PartialChartOptions`	Options for creating a chart (`size`, `theme`, `data`, `encoding`, `plugins`)	OrbCharts Class
`SizeConfig`	Size and resize settings	OrbCharts Class
`Encoding`	Field mapping, sorting, aggregation	Encoding
`Theme`	Colors, light/dark mode, font size	Theme
`Colors`	The palette for a single light/dark mode	Theme
`ColorType`	The type Layer params use to point at a Theme color	Theme
`PluginEntity`	The type of a Plugin instance	Plugin API
`DeepPartial<T>`	A deeply optional version of a type, used for `updateXxx` patches	—

Data models

The data nodes the chart produces after transforming RawData. The modelType marks which model a datum belongs to:

type ModelType = 'series' | 'grid' | 'multivariate' | 'graph' | 'tree'

Every model node extends ModelDatumBase:

interface ModelDatumBase {
  id:        string
  index:     number
  modelType: ModelType
  name:      string
  data:      any
  value:     number | null
  color:     string
}

Each model adds fields on top of ModelDatumBase:

Type	Additional fields
`ModelDatumSeries`	`series`, `seriesIndex`, `category`, `categoryIndex`
`ModelDatumGrid`	`series`, `seriesIndex`, `category`, `categoryIndex`
`ModelDatumMultivariate`	The above + `multivariate: Array<{ index, name, value }>`
`ModelDatumGraphNode`	`series`, `seriesIndex`, `category`, `categoryIndex`
`ModelDatumGraphEdge`	The above + `source`, `sourceIndex`, `target`, `targetIndex`
`ModelDatumTree`	`parent: string \| null`, `parentIndex: number \| null`, `depth`, `seq`, `children: ModelDatumTree[]`, `series`…

Event types

Type	Description	See
`EventType`	A string union of event kinds	Events
`EventData<T>`	The data object carried by an event	Events

ChartContext

The type of chart.context, which gathers the chart's RxJS streams and root nodes:

Category	Members
Data streams	`encoding$`, `seriesData$`, `gridData$`, `multivariateData$`, `graphData$`, `treeData$`
Config streams	`plugins$`, `theme$`, `size$`
Event streams	`event$`, `eventTrigger$`
Root nodes	`root`, `svg`, `canvas`

The streams are RxJS Observables or Subjects. For event usage, see Events.

OrbCharts Class — PartialChartOptions, SizeConfig, ChartContext
Encoding — Encoding and RawData field mapping
Events — EventType, EventData
Theme — Theme, Colors, ColorType
Data formats overview — the full RawData format