From: Jukka Kurkela <jukka.kurkela@gmail.com>
Date: Fri, 21 Feb 2020 23:58:14 +0000 (+0200)
Subject: Fill between datasets (#7139)
X-Git-Tag: v3.0.0-alpha~27
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=9bd34ecf2811d2080b7a14d056e814a72e93703f;p=thirdparty%2FChart.js.git

Fill between datasets (#7139)
---

diff --git a/src/plugins/plugin.filler.js b/src/plugins/plugin.filler.js
index 4843c9c3f..b296ac8c4 100644
--- a/src/plugins/plugin.filler.js
+++ b/src/plugins/plugin.filler.js
@@ -435,7 +435,6 @@ export default {
 	beforeDatasetsDraw(chart) {
 		const metasets = chart._getSortedVisibleDatasetMetas();
 		const area = chart.chartArea;
-		const ctx = chart.ctx;
 		let i, meta;
 
 		for (i = metasets.length - 1; i >= 0; --i) {
@@ -445,23 +444,26 @@ export default {
 				meta.line.updateControlPoints(area);
 			}
 		}
+	},
 
-		for (i = metasets.length - 1; i >= 0; --i) {
-			meta = metasets[i].$filler;
+	beforeDatasetDraw(chart, args) {
+		const area = chart.chartArea;
+		const ctx = chart.ctx;
+		const meta = args.meta.$filler;
 
-			if (!meta || meta.fill === false) {
-				continue;
-			}
-			const {line, target, scale} = meta;
-			const lineOpts = line.options;
-			const fillOption = lineOpts.fill;
-			const color = lineOpts.backgroundColor || defaults.color;
-			const {above = color, below = color} = fillOption || {};
-			if (target && line.points.length) {
-				clipArea(ctx, area);
-				doFill(ctx, {line, target, above, below, area, scale});
-				unclipArea(ctx);
-			}
+		if (!meta || meta.fill === false) {
+			return;
+		}
+
+		const {line, target, scale} = meta;
+		const lineOpts = line.options;
+		const fillOption = lineOpts.fill;
+		const color = lineOpts.backgroundColor || defaults.color;
+		const {above = color, below = color} = fillOption || {};
+		if (target && line.points.length) {
+			clipArea(ctx, area);
+			doFill(ctx, {line, target, above, below, area, scale});
+			unclipArea(ctx);
 		}
 	}
 };
diff --git a/test/fixtures/plugin.filler/fill-line-dataset-border.png b/test/fixtures/plugin.filler/fill-line-dataset-border.png
index 01afc9f35..ba3aef582 100644
Binary files a/test/fixtures/plugin.filler/fill-line-dataset-border.png and b/test/fixtures/plugin.filler/fill-line-dataset-border.png differ
diff --git a/test/fixtures/plugin.filler/fill-line-dataset-stepped.png b/test/fixtures/plugin.filler/fill-line-dataset-stepped.png
index e6dc9e7d9..072fc76bf 100644
Binary files a/test/fixtures/plugin.filler/fill-line-dataset-stepped.png and b/test/fixtures/plugin.filler/fill-line-dataset-stepped.png differ
diff --git a/test/fixtures/plugin.filler/fill-radar-dataset-border.png b/test/fixtures/plugin.filler/fill-radar-dataset-border.png
index ee53eccaa..32243c2bb 100644
Binary files a/test/fixtures/plugin.filler/fill-radar-dataset-border.png and b/test/fixtures/plugin.filler/fill-radar-dataset-border.png differ
diff --git a/test/fixtures/plugin.filler/fill-radar-dataset-order.js b/test/fixtures/plugin.filler/fill-radar-dataset-order.js
new file mode 100644
index 000000000..882be8113
--- /dev/null
+++ b/test/fixtures/plugin.filler/fill-radar-dataset-order.js
@@ -0,0 +1,28 @@
+module.exports = {
+	config: {
+		type: 'radar',
+		data: {
+			labels: ['English', 'Maths', 'Physics', 'Chemistry', 'Biology', 'History'],
+			datasets: [
+				{
+					order: 1,
+					borderColor: '#D50000',
+					backgroundColor: 'rgba(245, 205, 121,0.5)',
+					data: [65, 75, 70, 80, 60, 80]
+				},
+				{
+					order: 0,
+					backgroundColor: 'rgba(0, 168, 255,1)',
+					data: [54, 65, 60, 70, 70, 75]
+				}
+			]
+		},
+		options: {
+			legend: false,
+			title: false,
+			scale: {
+				display: false
+			}
+		}
+	}
+};
diff --git a/test/fixtures/plugin.filler/fill-radar-dataset-order.png b/test/fixtures/plugin.filler/fill-radar-dataset-order.png
new file mode 100644
index 000000000..a52b47071
Binary files /dev/null and b/test/fixtures/plugin.filler/fill-radar-dataset-order.png differ