From f24d64e80b0a051311ec581978fb1aeab4564c3a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andreas=20M=C3=BCller?= Date: Wed, 5 May 2021 11:36:06 +0200 Subject: [PATCH 1/3] =?UTF-8?q?=F0=9F=92=9A=20make=20last=20segment=20of?= =?UTF-8?q?=20line=20charts=20dashed?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/charts/LineChart.vue | 10 ++++++---- 1 file changed, 6 insertions(+), 4 deletions(-) diff --git a/src/charts/LineChart.vue b/src/charts/LineChart.vue index 8b03927..23d0af0 100644 --- a/src/charts/LineChart.vue +++ b/src/charts/LineChart.vue @@ -51,16 +51,17 @@ export default { processedDatasets () { let datasets = this.datasets datasets.map(d => { + // gradient for background d.backgroundColor = context => { const chart = context.chart; const { ctx, chartArea } = chart; if (!chartArea) return null; return transparentGradientLine(ctx, chartArea, d.borderColor); }; - // TODO: activate if https://github.com/chartjs/Chart.js/issues/9022 is fixed - // d.segment = { - // borderDash: ctx => ctx.p0.parsed.x == d.data.length-2 ? [10, 5] : undefined - // }; + // dashed line for last segment + d.segment = { + borderDash: ctx => ctx.p0.parsed.x == d.data.length-2 ? [10, 5] : undefined + }; }) return datasets } @@ -92,6 +93,7 @@ export default { scales: { x: { display: this.abscissa, + alignToPixels: true, stacked: false, grid: { display: false, From da9d277bb39d867f96750e5f3256b5c849cbf18c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andreas=20M=C3=BCller?= Date: Wed, 5 May 2021 12:54:13 +0200 Subject: [PATCH 2/3] =?UTF-8?q?=F0=9F=92=9A=20paint=20solid=20lines=20for?= =?UTF-8?q?=20filtered=20data?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/Stats.vue | 7 +++++++ src/charts/LineChart.vue | 6 +++++- 2 files changed, 12 insertions(+), 1 deletion(-) diff --git a/src/Stats.vue b/src/Stats.vue index 9f45f00..053754f 100644 --- a/src/Stats.vue +++ b/src/Stats.vue @@ -333,6 +333,7 @@ :labels="yearsChartData.labels" :ordinate="preferences.ordinate" :abscissa="true" + :unfinished="active.period.end == null" /> ctx.p0.parsed.x == d.data.length-2 ? [10, 5] : undefined + borderDash: ctx => this.unfinished && ctx.p0.parsed.x == d.data.length-2 ? [10, 5] : undefined }; }) return datasets From 9d95f55ba1d31692b7951d22aee173d0c3d4787c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andreas=20M=C3=BCller?= Date: Fri, 7 May 2021 17:06:00 +0200 Subject: [PATCH 3/3] =?UTF-8?q?=F0=9F=91=95=20remove=20unnecessary=20const?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/charts/BarChart.vue | 3 +-- src/charts/LineChart.vue | 3 +-- 2 files changed, 2 insertions(+), 4 deletions(-) diff --git a/src/charts/BarChart.vue b/src/charts/BarChart.vue index c461fbe..37044f8 100644 --- a/src/charts/BarChart.vue +++ b/src/charts/BarChart.vue @@ -36,8 +36,7 @@ export default { let datasets = this.datasets datasets.map(d => { d.backgroundColor = context => { - const chart = context.chart; - const { ctx, chartArea } = chart; + const { ctx, chartArea } = context.chart; if (!chartArea) return null; return transparentGradientBar(ctx, chartArea, d.borderColor, this.horizontal); } diff --git a/src/charts/LineChart.vue b/src/charts/LineChart.vue index 29fcf12..cb6f600 100644 --- a/src/charts/LineChart.vue +++ b/src/charts/LineChart.vue @@ -57,8 +57,7 @@ export default { datasets.map(d => { // gradient for background d.backgroundColor = context => { - const chart = context.chart; - const { ctx, chartArea } = chart; + const { ctx, chartArea } = context.chart; if (!chartArea) return null; return transparentGradientLine(ctx, chartArea, d.borderColor); };