blackchalkv0.3.0
Components

Stacked Bar Chart

SketchStackedBarChart — a hand-drawn stacked bar chart with sketched axes.

SketchStackedBarChart plots labelled bars made up of stacked rough.js segments with sketched axes. It's fluid — it fills the width of its container, so wrap it to size it.

Default

import { SketchStackedBarChart } from "blackchalk";<SketchStackedBarChartdata={[  { label: "Q1", segments: [12, 8, 5] },  { label: "Q2", segments: [18, 10, 6] },  { label: "Q3", segments: [9, 14, 7] },  { label: "Q4", segments: [22, 11, 9] },]}height={250}/>

Props

PropTypeDefault
data{ label: string; segments: number[] }[]
heightnumber250

See it in the Storybook playground, or read the source.

On this page