UNPKG

@cubetiq/react-chart-js

Version:

Chart.js for React and TypeScript

74 lines (63 loc) 1.93 kB
# React Chart.js Component **Install** Using NPM ```shell npm install @cubetiq/react-chart-js ``` OR using Yarn ```shell yarn add @cubetiq/react-chart-js ``` ### View a [Demo](https://cubetiq.github.io/chartjs-demos) ### Line Chart Example ```typescript import React from 'react'; import { ReactChartJs } from '@cubetiq/react-chart-js'; function LineChartExample(props) { return ( <ReactChartJs chartConfig={{ type: 'line', options: { responsive: true, title: { display: true, text: 'Monthly Payments', }, tooltips: { mode: 'index', intersect: false, }, hover: { mode: 'nearest', intersect: true, }, }, data: { datasets: [ { label: 'Part-time', data: [5, 10, 30], fill: false, borderColor: '#ff6384', }, { label: 'Full-time', data: [10, 15, 45], fill: false, borderColor: '#36a2eb', }, ], labels: ['Jan', 'Feb', 'Mar'], }, }} /> ); } export default LineChartExample; ``` ### Contributors Project's repository: [React Countdown](https://git.cubetiqs.com/CUBETIQ/react-chart-js.git) - [@s.long](https://git.cubetiqs.com/s.long) - [@sombochea](https://git.cubetiqs.com/sombochea) - [@cubetiq](https://git.cubetiqs.com/CUBETIQ)