@lg-charts/legend v1.0.0

Charts Legend

Installation

PNPM

pnpm add @lg-charts/legend

Yarn

yarn add @lg-charts/legend

NPM

npm install @lg-charts/legend

Example

To use the Legend, ensure your Legend instance and corresponding chart components are wrapped in a SeriesProvider instance.

import { Chart, ChartCard } from '@lg-charts/core';
import { Legend } from '@lg-charts/legend';
import { SeriesProvider } from '@lg-charts/series-provider';

const App = () => {
  const lineData = getLineData(); // use a fetch endpoint or pass down line data
  const series = lineData.map(({name}) => name);

  return (
    <SeriesProvider series={series}>
      <Legend series={series}>
      <Chart>
        {lineData.map(({ data, name }) => (
          <Line key={name} data={data} name={name} />
        ))}
      </Chart>
    </SeriesProvider>
  );
};

Properties

Legend