Auto

Multi-Renderer

SVG by default. Canvas at 10k+ points. WebGL at 100k+. Zero configuration required.

Automatic switching

Chart.ts monitors your dataset size and automatically selects the best renderer. Under 10,000 data points: SVG for perfect quality and accessibility. Over 10,000: Canvas for smooth 60fps performance. Over 100,000: WebGL for GPU-accelerated rendering. Same API. Same props. Same output.

Manual override

Need Canvas for a small dataset? Set renderer="canvas" on any chart. Prefer SVG for large datasets where you need CSS styling? Set renderer="svg". The auto-switch is a default, not a constraint.

Feature parity

Tooltips, animations, click handlers, and accessibility features work across all three renderers. The Canvas and WebGL renderers synthesize DOM events and ARIA attributes to match SVG behavior.

Related