Skip to main content
196

Search Lumen

Find components, APIs, guides, and recipes.

GitHub
React Native docs
Data displayReact Native

Funnel chart

Compares ordered nonnegative conversion stages with exact measurements.

Public APILumenFunnelChartReact Native

Native example

Use Funnel chart

Preserve input order and use aligned cohorts. Applications own conversion percentages and aggregation.

View captured React Native example
Funnel chart rendered in the Expo web renderer Lumen playground
Captured exampleExpo web renderer
tsx
<LumenFunnelChart label="Activation funnel" data={[{ id: "visits", label: "Visits", value: 4800 }]} />

Reference

Public API

The primary shared and platform-specific options exposed by LumenFunnelChart.

APIValues or typeDefaultDescription
dataLumenFunnelDatum[]RequiredUnique nonempty IDs, labels, nullable nonnegative finite values, and optional tone.
labelsLocalized chart labelsEnglishFormats exact values and empty/invalid/missing states.
showDataBooleantrueProvides the visible expandable exact values.

Native behavior

Design and accessibility

When to use it

Preserve input order and use aligned cohorts. Applications own conversion percentages and aggregation.

Accessibility

Visible values and an expandable data list distinguish missing stages from zero.

Shared component

Available on other platforms

Apple / SwiftUIAndroid / Compose
React Native docsNative primitives