From: stockiNail <stocki.nail@gmail.com>
Date: Tue, 26 Jul 2022 12:28:15 +0000 (+0200)
Subject: Enable borderDash option in the grid as scriptable (#10519)
X-Git-Tag: v3.9.0~13
X-Git-Url: http://git.ipfire.org/gitweb/gitweb.cgi?a=commitdiff_plain;h=144a6c0c2795befe24ab2e33d55aa4d90fc101cc;p=thirdparty%2FChart.js.git

Enable borderDash option in the grid as scriptable (#10519)
---

diff --git a/docs/axes/styling.md b/docs/axes/styling.md
index f74d258e2..9af53d3b2 100644
--- a/docs/axes/styling.md
+++ b/docs/axes/styling.md
@@ -10,7 +10,7 @@ Namespace: `options.scales[scaleId].grid`, it defines options for the grid lines
 | ---- | ---- | :-------------------------------: | :-----------------------------: | ------- | -----------
 | `borderColor` | [`Color`](../general/colors.md) | | | `Chart.defaults.borderColor` | The color of the border line.
 | `borderWidth` | `number` | | | `1` | The width of the border line.
-| `borderDash` | `number[]` | | | `[]` | Length and spacing of dashes on grid lines. See [MDN](https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/setLineDash).
+| `borderDash` | `number[]` | Yes | | `[]` | Length and spacing of dashes on grid lines. See [MDN](https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/setLineDash).
 | `borderDashOffset` | `number` | Yes | | `0.0` | Offset for line dashes. See [MDN](https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/lineDashOffset).
 | `circular` | `boolean` | | | `false` | If true, gridlines are circular (on radar chart only).
 | `color` | [`Color`](../general/colors.md)  | Yes | Yes | `Chart.defaults.borderColor` | The color of the grid lines. If specified as an array, the first color applies to the first grid line, the second to the second grid line, and so on.
diff --git a/src/core/core.scale.js b/src/core/core.scale.js
index e349a51fb..dcc2bc75f 100644
--- a/src/core/core.scale.js
+++ b/src/core/core.scale.js
@@ -1085,7 +1085,7 @@ export default class Scale extends Element {
 
       const lineWidth = optsAtIndex.lineWidth;
       const lineColor = optsAtIndex.color;
-      const borderDash = grid.borderDash || [];
+      const borderDash = optsAtIndex.borderDash || [];
       const borderDashOffset = optsAtIndex.borderDashOffset;
 
       const tickWidth = optsAtIndex.tickWidth;
diff --git a/test/fixtures/core.scale/grid/scriptable-borderDash.js b/test/fixtures/core.scale/grid/scriptable-borderDash.js
new file mode 100644
index 000000000..8fabb498c
--- /dev/null
+++ b/test/fixtures/core.scale/grid/scriptable-borderDash.js
@@ -0,0 +1,35 @@
+module.exports = {
+  config: {
+    type: 'scatter',
+    options: {
+      scales: {
+        x: {
+          position: {y: 0},
+          min: -10,
+          max: 10,
+          grid: {
+            borderDash: (ctx) => ctx.index % 2 === 0 ? [6, 3] : [],
+            color: 'lightGray',
+            lineWidth: 3,
+          },
+          ticks: {
+            display: false
+          },
+        },
+        y: {
+          position: {x: 0},
+          min: -10,
+          max: 10,
+          grid: {
+            borderDash: (ctx) => ctx.index % 2 === 0 ? [6, 3] : [],
+            color: 'lightGray',
+            lineWidth: 3,
+          },
+          ticks: {
+            display: false
+          },
+        }
+      }
+    }
+  }
+};
diff --git a/test/fixtures/core.scale/grid/scriptable-borderDash.png b/test/fixtures/core.scale/grid/scriptable-borderDash.png
new file mode 100644
index 000000000..365545e9a
Binary files /dev/null and b/test/fixtures/core.scale/grid/scriptable-borderDash.png differ
diff --git a/types/index.esm.d.ts b/types/index.esm.d.ts
index d576bbcef..8fd5a41f6 100644
--- a/types/index.esm.d.ts
+++ b/types/index.esm.d.ts
@@ -2857,7 +2857,7 @@ export interface GridLineOptions {
   /**
    * @default []
    */
-  borderDash: number[];
+  borderDash: Scriptable<number[], ScriptableScaleContext>;
   /**
    * @default 0
    */