Ranking Bars (classic)
Leaderboards with animated widths.
<HorizontalBarChart />1 variant
Live — the real React Native component rendered with react-native-web. Tap, drag and scrub it.
Installation
terminal
npx expo install expo-charts react-native-svgUsage
Import the component and pass your data. Width defaults to the parent, so it adapts to phones, tablets and rotation.
HorizontalBarChart.tsx
<HorizontalBarChart data={[{ label: "India", value: 8200 }]} />Props
| Prop | Type | Default |
|---|---|---|
| data Rows. | ChartPoint[] | — |
| sort Sort descending. | boolean | true |
Did you like the content?