@junipero/react-d3-plugin NPM

Installation

yarn add @junipero/react junipero/react-d3-plugin d3

Usage

import { Chart, Curve } from '@junipero/react-d3-plugin';
import * as d3 from 'd3';

export default () => (
  <Chart
    axis={[{
      type: d3.axisBottom,
      scale: d3.scaleTime,
      data: [new Date(2023, 0, 1), new Date(2023, 0, 2), new Date(2023, 0, 3)],
    }, {
      type: d3.axisLeft,
      scale: d3.scaleLinear,
      data: [10, 20, 30],
      grid: true,
    }]}
  >
    <Curve
      type="area"
      xAxisIndex={0}
      yAxisIndex={1}
    />
  </Chart>
);

Don't forget to add our default theme to your app using @junipero/theme, or create your own theme.