← Back to Home

Are we Recharts yet?

Progress toward a drop-in replacement for Recharts. Same composable API, Canvas rendering for performance.

Overall compatibility

70%
27 full2 partial11 missing40 total
ComponentRechartsQurveStatusNotes
LineChartLineChartLineChart✓ DoneWrapper; compose Line, XAxis, YAxis
BarChartBarChartBarChart✓ DoneWrapper; compose Bar, XAxis, YAxis
AreaChartAreaChartAreaChart✓ DoneWrapper; compose Area, XAxis, YAxis
ComposedChartComposedChartChart✓ DoneSingle Chart; mix Line, Bar, Area, Scatter
PieChartPieChartChart + Pie✓ DoneChart with Pie child
ScatterChartScatterChartChart✓ DoneUse Chart; compose Scatter, XAxis, YAxis
RadarChartRadarChart— Missing
RadialBarChartRadialBarChart— Missing
FunnelChartFunnelChart— Missing
TreemapTreemap— Missing
SankeyChartSankeyChart— Missing
ResponsiveContainerResponsiveContainerResponsiveContainer✓ Done
LegendLegendLegend✓ Done
TooltipTooltipTooltip✓ Done
CellCellCell✓ DoneChild of Bar/Pie; fill, stroke per segment
LabelLabelPie label~ PartialPie label prop; no general Label component
LabelListLabelList~ PartialPie has label/labelFormatter
CustomizedCustomizedCustomized✓ Donedraw prop; custom canvas rendering
AreaAreaArea✓ Done
BarBarBar✓ Done
LineLineLine✓ Done
ScatterScatterScatter✓ Done
XAxisXAxisXAxis✓ Done
YAxisYAxisYAxis✓ Done
ZAxisZAxis— Missing
BrushBrushBrush✓ Done
CartesianGridCartesianGridCartesianGrid✓ Done
ReferenceLineReferenceLineReferenceLine✓ Donex or y, stroke, strokeDasharray
ReferenceDotReferenceDotReferenceDot✓ Donex, y, r, fill, stroke
ReferenceAreaReferenceAreaReferenceArea✓ Donex1/x2 or y1/y2, fill, fillOpacity
ErrorBarErrorBarErrorBar✓ DonedataKey, errorKey, direction x/y
PiePiePie✓ Done
RadarRadar— Missing
RadialBarRadialBar— Missing
PolarGridPolarGrid— Missing
PolarAngleAxisPolarAngleAxis— Missing
PolarRadiusAxisPolarRadiusAxis— Missing
SectorSector✓ DoneInternal to Pie; canvas drawing
CurveCurve✓ DoneInternal to Line; drawLinePath in core
DotDot✓ DoneLine dot/activeDot; drawLineDots

Migration notes

  • Chart vs LineChart/BarChart: Qurve uses a single Chart. Replace LineChart with Chart and keep the same children.
  • dataKey: Same prop name. Works with string or function.
  • stroke, fill, strokeWidth: Same props on Line, Bar, Area, Scatter.
  • margin: Chart accepts margin object.
  • Animation: Recharts animates by default. Qurve has no built-in animation (Canvas redraws directly).
  • ReferenceLine/ReferenceDot/ReferenceArea: Implemented.
  • Tooltip content: Use content prop (element or function) for custom tooltip UI.
  • CSS variables: Set --qurve-chart-bg, --qurve-grid-stroke, --qurve-axis-stroke, --qurve-font-family on a parent to theme.
  • ErrorBar: Use as sibling of Line/Bar/Area. Data: { x, y, errorY: 2 } or errorY: [1, 3] for asymmetric.
  • Customized: draw={(props) => { ctx, margin, ... }} for custom canvas rendering.