chart.renderer

Configuration Structure

chart: {
  renderer: 'svg' | 'canvas' | 'auto',
  rendererThreshold: number,
  layers: { ... },
    series: 'svg' | 'canvas' | 'auto',
    grid: 'svg',
    annotations: 'svg',
    dataLabels: 'svg',
}

The renderer options control the Strata hybrid backend. Below a point threshold the output is identical SVG; above it, only the series layer is drawn to a <canvas> while axes, grid, tooltips, annotations, and exports stay SVG. Canvas needs the renderer feature: import 'apexcharts/features/renderer-canvas'. See the Canvas renderer guide for the full picture. It is part of the chart configuration.

renderer

Default: 'svg'

The series-layer backend. Available options:

  • svg (default) always renders SVG.
  • canvas always uses the canvas series layer.
  • auto uses SVG until the point count crosses rendererThreshold, then switches to canvas.

canvas and auto require import 'apexcharts/features/renderer-canvas'; without it the chart stays on SVG. Canvas is live for line, area, bar, column, scatter, and candlestick. When a chart uses a canvas-unsupported feature (pattern or image fills, color-matrix state filters), it falls back to SVG automatically. Call chart.getActiveRenderer() to read what is actually in use.

rendererThreshold

Default: 8000

With renderer: 'auto', the total-point count above which the series layer switches to canvas.

layers

Per-layer rendering overrides. Only the series layer is canvas-capable; grid, annotations, and dataLabels stay SVG so crosshairs, annotations, exports, and label crispness are unaffected.

series

chart.layers.series

Backend for the series layer: svg, canvas, or auto. Defaults to following renderer.