From: Jacco van den Berg Date: Fri, 18 Nov 2022 18:14:47 +0000 (+0100) Subject: Pointstyle false (#10886) X-Git-Tag: v4.1.0~21 X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=9a9ff6fdbdbebb40e05bf48cada0d6711141c62f;p=thirdparty%2FChart.js.git Pointstyle false (#10886) * fix-#10755 * none to false * str to bool * str to bool * 10/10 * fix test Co-authored-by: puneetkathar1 Co-authored-by: Puneet Kathar <73285338+puneetkathar1@users.noreply.github.com> --- diff --git a/docs/configuration/elements.md b/docs/configuration/elements.md index e37a12e27..4b2a08f94 100644 --- a/docs/configuration/elements.md +++ b/docs/configuration/elements.md @@ -47,6 +47,7 @@ When a string is provided, the following values are supported: - `'rectRot'` - `'star'` - `'triangle'` +- `false` If the value is an image or a canvas element, that image or canvas element is drawn on the canvas using [drawImage](https://developer.mozilla.org/en/docs/Web/API/CanvasRenderingContext2D/drawImage). diff --git a/docs/samples/line/point-styling.md b/docs/samples/line/point-styling.md index 22f63b3f1..714cd052b 100644 --- a/docs/samples/line/point-styling.md +++ b/docs/samples/line/point-styling.md @@ -92,6 +92,15 @@ const actions = [ }); chart.update(); } + }, + { + name: 'pointStyle: false', + handler: (chart) => { + chart.data.datasets.forEach(dataset => { + dataset.pointStyle = false; + }); + chart.update(); + } } ]; // diff --git a/src/helpers/helpers.canvas.js b/src/helpers/helpers.canvas.js index 40ada9bbb..ce3bf2c1f 100644 --- a/src/helpers/helpers.canvas.js +++ b/src/helpers/helpers.canvas.js @@ -256,6 +256,9 @@ export function drawPointLegend(ctx, options, x, y, w) { ctx.moveTo(x, y); ctx.lineTo(x + Math.cos(rad) * (w ? w / 2 : radius), y + Math.sin(rad) * radius); break; + case false: + ctx.closePath(); + break; } ctx.fill(); diff --git a/test/fixtures/controller.line/pointStyle/indexable.js b/test/fixtures/controller.line/pointStyle/indexable.js index 852115c9a..93a04a6f4 100644 --- a/test/fixtures/controller.line/pointStyle/indexable.js +++ b/test/fixtures/controller.line/pointStyle/indexable.js @@ -2,11 +2,11 @@ module.exports = { config: { type: 'line', data: { - labels: [0, 1, 2, 3, 4, 5], + labels: [0, 1, 2, 3, 4, 5, 6], datasets: [ { // option in dataset - data: [0, 5, 10, null, -10, -5], + data: [0, 5, 10, null, -10, -5, 0], pointBackgroundColor: '#ff0000', pointBorderColor: '#ff0000', pointStyle: [ @@ -16,11 +16,12 @@ module.exports = { 'dash', 'line', 'rect', + false ] }, { // option in element (fallback) - data: [4, -5, -10, null, 10, 5], + data: [4, -5, -10, null, 10, 5, -4], } ] }, diff --git a/test/fixtures/controller.line/pointStyle/indexable.png b/test/fixtures/controller.line/pointStyle/indexable.png index 184aaf56c..6a6dc0021 100644 Binary files a/test/fixtures/controller.line/pointStyle/indexable.png and b/test/fixtures/controller.line/pointStyle/indexable.png differ diff --git a/test/fixtures/controller.radar/pointStyle/indexable.js b/test/fixtures/controller.radar/pointStyle/indexable.js index 65afe0be2..48101e997 100644 --- a/test/fixtures/controller.radar/pointStyle/indexable.js +++ b/test/fixtures/controller.radar/pointStyle/indexable.js @@ -2,11 +2,11 @@ module.exports = { config: { type: 'radar', data: { - labels: [0, 1, 2, 3, 4, 5], + labels: [0, 1, 2, 3, 4, 5, 6], datasets: [ { // option in dataset - data: [0, 5, 10, null, -10, -5], + data: [0, 5, 10, null, -10, -5, 0], pointBackgroundColor: '#ff0000', pointBorderColor: '#ff0000', pointStyle: [ @@ -16,11 +16,12 @@ module.exports = { 'dash', 'line', 'rect', + false ] }, { // option in element (fallback) - data: [4, -5, -10, null, 10, 5], + data: [4, -5, -10, null, 10, 5, -4], } ] }, diff --git a/test/fixtures/controller.radar/pointStyle/indexable.png b/test/fixtures/controller.radar/pointStyle/indexable.png index c8e040214..7c3a7460f 100644 Binary files a/test/fixtures/controller.radar/pointStyle/indexable.png and b/test/fixtures/controller.radar/pointStyle/indexable.png differ diff --git a/test/fixtures/element.point/rotation.js b/test/fixtures/element.point/rotation.js index 6d2265e1e..e5fffba12 100644 --- a/test/fixtures/element.point/rotation.js +++ b/test/fixtures/element.point/rotation.js @@ -1,10 +1,10 @@ var gradient; -var datasets = ['circle', 'cross', 'crossRot', 'dash', 'line', 'rect', 'rectRounded', 'rectRot', 'star', 'triangle'].map(function(style, y) { +var datasets = ['circle', 'cross', 'crossRot', 'dash', 'line', 'rect', 'rectRounded', 'rectRot', 'star', 'triangle', false].map(function(style, y) { return { pointStyle: style, data: Array.apply(null, Array(17)).map(function(v, x) { - return {x: x, y: 10 - y}; + return {x: x, y: 11 - y}; }) }; }); diff --git a/test/fixtures/element.point/rotation.png b/test/fixtures/element.point/rotation.png index 579c712ec..11424fffb 100644 Binary files a/test/fixtures/element.point/rotation.png and b/test/fixtures/element.point/rotation.png differ diff --git a/test/fixtures/plugin.tooltip/point-style.js b/test/fixtures/plugin.tooltip/point-style.js index 255e4f153..f8a071671 100644 --- a/test/fixtures/plugin.tooltip/point-style.js +++ b/test/fixtures/plugin.tooltip/point-style.js @@ -1,4 +1,4 @@ -const pointStyles = ['circle', 'cross', 'crossRot', 'dash', 'line', 'rect', 'rectRounded', 'rectRot', 'star', 'triangle']; +const pointStyles = ['circle', 'cross', 'crossRot', 'dash', 'line', 'rect', 'rectRounded', 'rectRot', 'star', 'triangle', false]; function newDataset(pointStyle, i) { return { diff --git a/test/fixtures/plugin.tooltip/point-style.png b/test/fixtures/plugin.tooltip/point-style.png index 39b0fad1b..e11b8cc53 100644 Binary files a/test/fixtures/plugin.tooltip/point-style.png and b/test/fixtures/plugin.tooltip/point-style.png differ diff --git a/types/index.d.ts b/types/index.d.ts index 671f3e27f..986b1cfec 100644 --- a/types/index.d.ts +++ b/types/index.d.ts @@ -1823,6 +1823,7 @@ export type PointStyle = | 'rectRot' | 'star' | 'triangle' + | false | HTMLImageElement | HTMLCanvasElement;