Rebar UI

1.0

synthetic

BarChart

One bar per category, for a plain comparison of values.

Weekly throughputTasks completed per week, 3 Aug to 19 Oct, with a trendline
09182736143 Aug1910 Aug1617 Aug2224 Aug2031 Aug257 Sep2314 Sep2821 Sep2528 Sep315 Oct2912 Oct3319 Oct
Tasks completed per week
Few bars
01020304031Maya36Jonas18Priya24Leo
Hours this week
No title
01020304031Maya36Jonas18Priya

In context

Team pageHours logged this week, per person
This week

109 hours across four people.

01020304031Maya36Jonas18Priya24Leo
Hours logged

Props

PropTypeRequiredDefault
barsBarChartBar[]Yes—
titlestring | undefinedNo—
ariaLabelstring | undefinedNo—
heightnumber | undefinedNo340
trendlineboolean | undefinedNo—
bionicboolean | undefinedNo—
bionicOptionsBionicOptions | undefinedNo—

Trendline

trendline fits a dashed least-squares line across the bars, with bar index as x. Use it only when the bars are an ordered sequence such as weeks.

data-rebar-* attributes

data-rebar-component="bar-chart" on the root <figure>; data-rebar-part="title" on the caption and "trendline" on a fitted line.

Migrating to Ant Design

Not codemod-covered. AntD ships no charts; reimplement against the charting library the target project uses (for example @ant-design/charts).