From bc1da5f7977d75e99d5c469511f51006c800d215 Mon Sep 17 00:00:00 2001 From: Bryce Christensen Date: Fri, 13 Sep 2024 15:50:47 +1000 Subject: [PATCH 1/2] Line Styles added / edited : Dotted, Dashed, DashDot, Solid --- src/chartjs-plugin-trendline.js | 19 +++++++++++++++---- 1 file changed, 15 insertions(+), 4 deletions(-) diff --git a/src/chartjs-plugin-trendline.js b/src/chartjs-plugin-trendline.js index 3bff7ce..cae1cc7 100644 --- a/src/chartjs-plugin-trendline.js +++ b/src/chartjs-plugin-trendline.js @@ -145,10 +145,21 @@ const addFitter = (datasetMeta, ctx, dataset, xScale, yScale) => { ctx.lineWidth = lineWidth; - if (lineStyle === 'dotted') { - ctx.setLineDash([2, 3]); // Dotted - } else { - ctx.setLineDash([]); // Solid + // line styles + switch (lineStyle) { + case 'dotted': + ctx.setLineDash([2, 2]); // Dotted + break; + case 'dashed': + ctx.setLineDash([8, 3]); // Dashed + break; + case 'dashdot': + ctx.setLineDash([8, 3, 2, 3]); // Dash-dot + break; + case 'solid': + default: + ctx.setLineDash([]); // Solid + break; } ctx.beginPath(); From 702d8b6b56383aeb6a25091def7bcc0673c7381b Mon Sep 17 00:00:00 2001 From: Bryce Christensen Date: Fri, 13 Sep 2024 15:51:52 +1000 Subject: [PATCH 2/2] Updated example code in Readme with new Line Style options --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 6a5d2d6..765fa5d 100644 --- a/README.md +++ b/README.md @@ -36,7 +36,7 @@ To configure the trendline plugin you simply add a new config options to your da trendlineLinear: { colorMin: "red", colorMax: "green", - lineStyle: "dotted|solid", + lineStyle: "dotted|solid|dashed|dashdot", width: 2, xAxisKey: "time" (optional), yAxisKey: "usage" (optional),