build69 / Components / Charts / ComboChart

ComboChart

v1.0.10Updated 20 Oct 2026

Recharts-backed combo chart mixing bars + lines on the same axes (e.g., revenue bars + margin line). Two or three series.

View source ← Back to catalog

Preview

Live · 6 stories

DefaultOpen ↗

▸Why this is recommendedchartcombomixedrecharts+2

The default, out-of-the-box ComboChart.

Recommended for+14

✓Bars + ratio overlay (revenue + margin)
✓Volume + index
✓Mixed-magnitude comparisons

Tags+6

chartcombomixedrechartsdata-vizdefault

Features+4

Bars + lines on shared axes
Two or three overlaid series
Hover tooltip + legend
i18n: numbers/axis values format per LocaleProvider locale

Not recommended for−2

✕Single-series (use BarChart / LineChart)

Install

Ask your agent, or call the MCP tool directly. The resolved bundle is written into your project.

get_registry_item({ name: "ComboChart" })

Usage

Tick variants in the left menu — each adds a tab with that variant’s real story source, the same code the preview above renders.

Props

PropTypeRequired

data

Rows of data

object[]yes

series

Per-series config (bar / line)

ComboSeries[]yes

allowDecimals

Let the LEFT value axis place fractional ticks. Defaults to false for the whole-number formats (integer, currency) so small counts do not render a rounded, repeating axis

boolean—

tickCount

How many ticks the LEFT value axis should aim for. Defaults to five, or to the number of whole steps the data spans when that is fewer

number—

yRightAllowDecimals

allowDecimals for the RIGHT value axis. Defaults from yRightFormat

boolean—

yRightTickCount

tickCount for the RIGHT value axis