FunnelChart
A funnel chart component for visualizing conversion rates, sales pipelines, and progressive data reduction across stages.
Install Dependencies
npx quickcode-ui add FunnelChartExamples
Basic
Basic Funnel Chart
With Labels
Funnel Chart with Labels
Custom Labels
Funnel Chart with Custom Labels
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 |
FunnelChart
| Prop | Type | Default | Description |
|---|---|---|---|
margin | object | — | Chart margins |
className | string | — | Additional CSS classes |
ChartTooltipContent
| Prop | Type | Default | Description |
|---|---|---|---|
hideLabel | boolean | false | Hide the tooltip label |
nameKey | string | 'name' | Key for stage name |
valueKey | string | 'value' | Key for value |
className | string | — | Additional CSS classes |
Last updated on