ComposedChart
A versatile chart component that combines multiple chart types (Bar, Line, Area) in a single visualization for complex data analysis.
Install Dependencies
npx quickcode-ui add ComposedChartExamples
Bar + Line
Bar + Line Chart
Area + Bar
Area + Bar Chart
Bar + Multiple Lines
Bar + Multiple Lines
Props
ChartContainer
| Prop | Type | Default | Description |
|---|---|---|---|
config | ChartConfig | — | Configuration object defining chart colors and labels |
children | ReactNode | — | Chart components to render |
className | string | — | Additional CSS classes |
ComposedChart
| Prop | Type | Default | Description |
|---|---|---|---|
data | any[] | — | Array of data objects to visualize |
margin | object | — | Chart margins configuration |
className | string | — | Additional CSS classes |
ChartTooltipContent
| Prop | Type | Default | Description |
|---|---|---|---|
indicator | 'line' | 'dot' | 'dashed' | 'dot' | Visual indicator style |
hideLabel | boolean | false | Hide the tooltip label |
hideIndicator | boolean | false | Hide the visual indicator |
className | string | — | Additional CSS classes |
Last updated on