Quick start (React)

import { Line } from '@arshad-shah/swift-chart/react';

const sales = [
  { month: 'Jan', revenue: 420, target: 400 },
  { month: 'Feb', revenue: 510, target: 450 },
  { month: 'Mar', revenue: 480, target: 500 },
];

export function Dashboard() {
  return (
    <Line
      data={sales}
      mapping={{ x: 'month', y: ['revenue', 'target'] }}
      theme="midnight"
      area
      height={320}
    />
  );
}

The result:

Notes for React users

• All chart components are client-only. In Next.js or other SSR frameworks, ensure the chart renders only in the browser ('use client' is already set inside the package).
• To access the underlying chart instance imperatively (resize, export PNG), see React refs.
• Multi-series charts accept a string[] for mapping.y. The seriesNames option overrides the legend labels.