Funnel Chart
A funnel chart is a graphical representation used to visualize how data moves through a process. In a funnel chart, the dependent variable’s value diminishes in the subsequent stages of the process. It can be used to demonstrate the flow of users through a business or sales process.
Simple Example
Event Triggers
Funnel chart supports on_click, on_mouse_enter, on_mouse_leave and on_mouse_move event triggers, allows you to interact with the funnel chart and perform specific actions based on user interactions.
Dynamic Data
Here is an example of a funnel chart with a State. Here we have defined a function randomize_data, which randomly changes the data when the graph is clicked on using on_click=FunnelState.randomize_data.
ExpandCollapse
Changing the Chart Animation
The is_animation_active prop can be used to turn off the animation, but defaults to True. animation_begin sets the delay before animation starts, animation_duration determines how long the animation lasts, and animation_easing defines the speed curve of the animation for smooth transitions.
API Reference
rx.recharts.FunnelChart
A Funnel chart component in Recharts.
Props
| Prop | Type | Description |
|---|---|---|
width | Union[int, str] | The width of chart container. String or Integer. |
height | Union[int, str] | The height of chart container. |
layout | str | The layout of bars in the chart. |
margin | Dict[str, Any] | The sizes of whitespace around the chart. |
stroke | Union[str, Color] | The stroke color of each bar. String | Object. |
Valid Children
LegendGraphingTooltipFunnelDefsEvent Triggers
See the full list of default event triggersrx.recharts.Funnel
A Funnel component in Recharts.
Props
| Prop | Type | Description |
|---|---|---|
data | Sequence | The source data, in which each element is an object. |
data_key | Union[int, str] | The key or getter of a group of data which should be unique in a FunnelChart. |
name_key | str | The key of each sector's name. |
legend_type | "circle""cross""diamond""line""plainline""rect""square""star""triangle""wye""none" | The type of icon in legend. If set to 'none', no legend item will be rendered. |
is_animation_active | bool | If set false, animation of line will be disabled. |
animation_begin | int | Specifies when the animation should begin, the unit of this option is ms. |
animation_duration | int | Specifies the duration of animation, the unit of this option is ms. |
animation_easing | "ease""ease-in""ease-out""ease-in-out""linear" | The type of easing function. 'ease' | 'ease-in' | 'ease-out' | 'ease-in-out' | 'linear'. Default "ease". |
stroke | Union[str, Color] | Stroke color. |
trapezoids | Sequence | The coordinates of all the trapezoids in the funnel, usually calculated internally. |
Valid Children
LabelListCell