From: Jukka Kurkela <jukka.kurkela@gmail.com>
Date: Sat, 24 Apr 2021 19:27:52 +0000 (+0300)
Subject: Add drawTime: beforeDraw option to filler (#8973)
X-Git-Tag: v3.2.0~1
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=eaa3a68cea5e643356e629bcd71d96bd7ea418e9;p=thirdparty%2FChart.js.git

Add drawTime: beforeDraw option to filler (#8973)
---

diff --git a/docs/charts/area.md b/docs/charts/area.md
index f37515e49..39e7f2221 100644
--- a/docs/charts/area.md
+++ b/docs/charts/area.md
@@ -68,7 +68,7 @@ Namespace: `options.plugins.filler`
 
 | Option | Type | Default | Description |
 | :--- | :--- | :--- | :--- |
-| `drawTime` | `string` | `beforeDatasetDraw` | Filler draw time. Supported values: `'beforeDatasetDraw'`, `'beforeDatasetsDraw'`
+| `drawTime` | `string` | `beforeDatasetDraw` | Filler draw time. Supported values: `'beforeDraw'`, `'beforeDatasetDraw'`, `'beforeDatasetsDraw'`
 | [`propagate`](#propagate) | `boolean` | `true` | Fill propagation when target is hidden.
 
 ### propagate
diff --git a/docs/samples/area/line-drawtime.md b/docs/samples/area/line-drawtime.md
index 1c45fcb0c..564ebc348 100644
--- a/docs/samples/area/line-drawtime.md
+++ b/docs/samples/area/line-drawtime.md
@@ -26,7 +26,7 @@ const data = {
       label: 'Dataset 1',
       data: generateData(),
       borderColor: Utils.CHART_COLORS.red,
-      backgroundColor: Utils.transparentize(Utils.CHART_COLORS.red),
+      backgroundColor: Utils.CHART_COLORS.red,
       fill: true
     },
     {
@@ -58,6 +58,13 @@ const actions = [
       chart.update();
     }
   },
+  {
+    name: 'drawTime: beforeDraw',
+    handler: (chart) => {
+      chart.options.plugins.filler.drawTime = 'beforeDraw';
+      chart.update();
+    }
+  },
   {
     name: 'Randomize',
     handler(chart) {
diff --git a/src/plugins/plugin.filler.js b/src/plugins/plugin.filler.js
index 1bd851da4..36467b33f 100644
--- a/src/plugins/plugin.filler.js
+++ b/src/plugins/plugin.filler.js
@@ -565,19 +565,32 @@ export default {
     }
   },
 
-  beforeDatasetsDraw(chart, _args, options) {
+  beforeDraw(chart, _args, options) {
+    const draw = options.drawTime === 'beforeDraw';
     const metasets = chart.getSortedVisibleDatasetMetas();
     const area = chart.chartArea;
-
     for (let i = metasets.length - 1; i >= 0; --i) {
       const source = metasets[i].$filler;
+      if (!source) {
+        continue;
+      }
 
-      if (source) {
-        source.line.updateControlPoints(area);
+      source.line.updateControlPoints(area);
+      if (draw) {
+        drawfill(chart.ctx, source, area);
+      }
+    }
+  },
 
-        if (options.drawTime === 'beforeDatasetsDraw') {
-          drawfill(chart.ctx, source, area);
-        }
+  beforeDatasetsDraw(chart, _args, options) {
+    if (options.drawTime !== 'beforeDatasetsDraw') {
+      return;
+    }
+    const metasets = chart.getSortedVisibleDatasetMetas();
+    for (let i = metasets.length - 1; i >= 0; --i) {
+      const source = metasets[i].$filler;
+      if (source) {
+        drawfill(chart.ctx, source, chart.chartArea);
       }
     }
   },
diff --git a/test/fixtures/plugin.filler/radar/beforeDraw.js b/test/fixtures/plugin.filler/radar/beforeDraw.js
new file mode 100644
index 000000000..956c6a0a2
--- /dev/null
+++ b/test/fixtures/plugin.filler/radar/beforeDraw.js
@@ -0,0 +1,47 @@
+module.exports = {
+  config: {
+    type: 'radar',
+    data: {
+      labels: ['Red', 'Blue', 'Yellow', 'Green', 'Purple', 'Orange'],
+      datasets: [{
+        label: '# of Votes',
+        data: [9, 7, 3, 5, 2, 3],
+        fill: 'origin',
+        borderColor: 'red',
+        backgroundColor: 'green',
+        pointRadius: 12,
+        pointBackgroundColor: 'red'
+      }]
+    },
+    options: {
+      layout: {
+        padding: 20
+      },
+      plugins: {
+        legend: false,
+        filler: {
+          drawTime: 'beforeDraw'
+        }
+      },
+      scales: {
+        r: {
+          angleLines: {
+            color: 'rgba(0,0,0,0.5)',
+            lineWidth: 2
+          },
+          grid: {
+            color: 'rgba(0,0,0,0.5)',
+            lineWidth: 2
+          },
+          pointLabels: {
+            display: false
+          },
+          ticks: {
+            beginAtZero: true,
+            display: false
+          },
+        }
+      }
+    }
+  }
+};
diff --git a/test/fixtures/plugin.filler/radar/beforeDraw.png b/test/fixtures/plugin.filler/radar/beforeDraw.png
new file mode 100644
index 000000000..886a204d1
Binary files /dev/null and b/test/fixtures/plugin.filler/radar/beforeDraw.png differ