Logo for jsDocs.io

react-chartjs-2

  • Version 5.3.1
  • Published
  • 55.1 kB
  • No dependencies
  • MIT license

Install

npm i react-chartjs-2
yarn add react-chartjs-2
pnpm add react-chartjs-2

Overview

React components for Chart.js

Index

Variables

Functions

Interfaces

Variables

variable Bar

const Bar: TypedChartComponent<'bar'>;

    variable Bubble

    const Bubble: TypedChartComponent<'bubble'>;

      variable Chart

      const Chart: BaseChartComponent;

        variable Doughnut

        const Doughnut: TypedChartComponent<'doughnut'>;

          variable Line

          const Line: TypedChartComponent<'line'>;

            variable Pie

            const Pie: TypedChartComponent<'pie'>;

              variable PolarArea

              const PolarArea: TypedChartComponent<'polarArea'>;

                variable Radar

                const Radar: TypedChartComponent<'radar'>;

                  variable Scatter

                  const Scatter: TypedChartComponent<'scatter'>;

                    Functions

                    function getDatasetAtEvent

                    getDatasetAtEvent: (
                        chart: Chart,
                        event: MouseEvent<HTMLCanvasElement>
                    ) => import('chart.js').InteractionItem[];

                    • Get dataset from mouse click event

                      Parameter chart

                      Chart.js instance

                      Parameter event

                      Mouse click event

                      Returns

                      Dataset

                    function getElementAtEvent

                    getElementAtEvent: (
                        chart: Chart,
                        event: MouseEvent<HTMLCanvasElement>
                    ) => import('chart.js').InteractionItem[];

                    • Get single dataset element from mouse click event

                      Parameter chart

                      Chart.js instance

                      Parameter event

                      Mouse click event

                      Returns

                      Dataset

                    function getElementsAtEvent

                    getElementsAtEvent: (
                        chart: Chart,
                        event: MouseEvent<HTMLCanvasElement>
                    ) => import('chart.js').InteractionItem[];

                    • Get all dataset elements from mouse click event

                      Parameter chart

                      Chart.js instance

                      Parameter event

                      Mouse click event

                      Returns

                      Dataset

                    Interfaces

                    interface ChartProps

                    interface ChartProps<
                        TType extends ChartType = ChartType,
                        TData = DefaultDataPoint<TType>,
                        TLabel = unknown
                    > extends CanvasHTMLAttributes<HTMLCanvasElement> {}

                      property data

                      data: ChartData<TType, TData, TLabel>;

                      • The data object that is passed into the Chart.js chart

                        See Also

                        • https://www.chartjs.org/docs/latest/getting-started/

                      property datasetIdKey

                      datasetIdKey?: string;

                      • Key name to identificate dataset 'label'

                      property fallbackContent

                      fallbackContent?: ReactNode;

                      • A fallback for when the canvas cannot be rendered. Can be used for accessible chart descriptions

                        See Also

                        • https://www.chartjs.org/docs/latest/general/accessibility.html null Replace with children prop.

                      property options

                      options?: ChartOptions<TType>;

                      • The options object that is passed into the Chart.js chart

                        See Also

                        • https://www.chartjs.org/docs/latest/general/options.html {}

                      property plugins

                      plugins?: Plugin<TType>[];

                      • The plugins array that is passed into the Chart.js chart

                        See Also

                        • https://www.chartjs.org/docs/latest/developers/plugins.html []

                      property redraw

                      redraw?: boolean;

                      • Teardown and redraw chart on every update false

                      property type

                      type: TType;

                      • Chart.js chart type

                      property updateMode

                      updateMode?: UpdateMode;

                      • A mode string to indicate transition configuration should be used.

                        See Also

                        • https://www.chartjs.org/docs/latest/developers/api.html#update-mode

                      Package Files (5)

                      Dependencies (0)

                      No dependencies.

                      Dev Dependencies (0)

                      No dev dependencies.

                      Peer Dependencies (2)

                      Badge

                      To add a badge like this onejsDocs.io badgeto your package's README, use the codes available below.

                      You may also use Shields.io to create a custom badge linking to https://www.jsdocs.io/package/react-chartjs-2.

                      • Markdown
                        [![jsDocs.io](https://img.shields.io/badge/jsDocs.io-reference-blue)](https://www.jsdocs.io/package/react-chartjs-2)
                      • HTML
                        <a href="https://www.jsdocs.io/package/react-chartjs-2"><img src="https://img.shields.io/badge/jsDocs.io-reference-blue" alt="jsDocs.io"></a>