This plugin draws an linear trendline in your Chart. It has been tested with Chart.js version 4.3.0.
Load Chart.js first, then the plugin which will automatically register itself with Chart.js
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/chart.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/chartjs-plugin-trendline"></script>
Install & import the plugin via npm:
npm i chart.js chartjs-plugin-trendline
import ChartJS from 'chart.js';
import chartTrendline from 'chartjs-plugin-trendline';
ChartJS.plugins.register(chartTrendline);
To configure the trendline plugin you simply add a new config options to your dataset in your chart config.
{
trendlineLinear: {
colorMin: "red",
colorMax: "green",
lineStyle: "dotted|solid",
width: 2,
projection: true|false (optional)
}
}
- bar
- line
Pull requests and issues are always welcome. For bugs and feature requests, please create an issue.
chartjs-plugin-trendline.js is available under the MIT license.