]> git.ipfire.org Git - thirdparty/Chart.js.git/commitdiff
Enable borderDash option in the grid as scriptable (#10519)
authorstockiNail <stocki.nail@gmail.com>
Tue, 26 Jul 2022 12:28:15 +0000 (14:28 +0200)
committerGitHub <noreply@github.com>
Tue, 26 Jul 2022 12:28:15 +0000 (08:28 -0400)
docs/axes/styling.md
src/core/core.scale.js
test/fixtures/core.scale/grid/scriptable-borderDash.js [new file with mode: 0644]
test/fixtures/core.scale/grid/scriptable-borderDash.png [new file with mode: 0644]
types/index.esm.d.ts

index f74d258e2d4129a98ea6dc7c40d4ecd435b0fe01..9af53d3b21125231567339cfebc17cedaf02a161 100644 (file)
@@ -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.
index e349a51fb8adf583491b324d6cd6ccb58ea97194..dcc2bc75fcff0c2c63965d20f32685ef785f4b7b 100644 (file)
@@ -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 (file)
index 0000000..8fabb49
--- /dev/null
@@ -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 (file)
index 0000000..365545e
Binary files /dev/null and b/test/fixtures/core.scale/grid/scriptable-borderDash.png differ
index d576bbcef45a25e696025677fa8974009ab11d70..8fd5a41f6359d94fbceefe49e34087128a4672a9 100644 (file)
@@ -2857,7 +2857,7 @@ export interface GridLineOptions {
   /**
    * @default []
    */
-  borderDash: number[];
+  borderDash: Scriptable<number[], ScriptableScaleContext>;
   /**
    * @default 0
    */