Props Reference
Detailed documentation for all component props and their usage.
Common Props
Props that are shared across all chart components.
| Prop | Type | Default | Description |
|---|---|---|---|
| data | ChartData[] | required | Array of data objects to display in the chart |
| width | number | 400 | Chart width in pixels |
| height | number | 300 | Chart height in pixels |
| theme | string | object | 'light' | Theme name ('light', 'dark') or custom theme object |
| className | string | '' | Additional CSS classes for the chart container |
| style | CSSProperties | Inline styles for the chart container | |
| loading | boolean | false | Show loading indicator |
| onChartReady | function | undefined | Callback when chart is ready |
Data Format
Understanding the data structure expected by chart components.
ChartData Interface
typescript
Multi-Series Data
typescript
Event Handlers
Available event handlers for chart interactions.
| Event | Type | Description |
|---|---|---|
| onClick | (params: any) => void | Fired when chart element is clicked |
| onHover | (params: any) => void | Fired when hovering over chart elements |
| onLegendClick | (params: any) => void | Fired when legend item is clicked |
| onDataZoom | (params: any) => void | Fired when data zoom changes |
Styling Props
Props for customizing chart appearance and styling.
| Prop | Type | Default | Description |
|---|---|---|---|
| colors | string[] | theme colors | Custom color palette for chart elements |
| backgroundColor | string | transparent | Chart background color |
| grid | object | default | Grid configuration object |
| legend | object | boolean | true | Legend configuration or visibility |
| tooltip | object | boolean | true | Tooltip configuration or visibility |