From 3934935caa916f5ad1dfcf0829b84913389443cd Mon Sep 17 00:00:00 2001 From: Evert Timberg Date: Thu, 1 Jul 2021 14:15:06 -0400 Subject: [PATCH] Enable pointStyle for doughnut, pie, and polar area charts (#9341) * Enable pointStyle for doughnut, pie, and polar area charts * Fix whitespace --- src/controllers/controller.doughnut.js | 3 ++ src/controllers/controller.polarArea.js | 3 ++ .../legend-doughnut-point-style.json | 29 ++++++++++++++++++ .../legend-doughnut-point-style.png | Bin 0 -> 9488 bytes test/specs/global.defaults.tests.js | 18 +++++++---- 5 files changed, 47 insertions(+), 6 deletions(-) create mode 100644 test/fixtures/plugin.legend/legend-doughnut-point-style.json create mode 100644 test/fixtures/plugin.legend/legend-doughnut-point-style.png diff --git a/src/controllers/controller.doughnut.js b/src/controllers/controller.doughnut.js index 0d4d135f248..20929bbe1f6 100644 --- a/src/controllers/controller.doughnut.js +++ b/src/controllers/controller.doughnut.js @@ -364,6 +364,8 @@ DoughnutController.overrides = { generateLabels(chart) { const data = chart.data; if (data.labels.length && data.datasets.length) { + const {labels: {pointStyle}} = chart.legend.options; + return data.labels.map((label, i) => { const meta = chart.getDatasetMeta(0); const style = meta.controller.getStyle(i); @@ -373,6 +375,7 @@ DoughnutController.overrides = { fillStyle: style.backgroundColor, strokeStyle: style.borderColor, lineWidth: style.borderWidth, + pointStyle: pointStyle, hidden: !chart.getDataVisibility(i), // Extra data used for toggling the correct item diff --git a/src/controllers/controller.polarArea.js b/src/controllers/controller.polarArea.js index 0c6fa0c99bd..8a9a1b91e2d 100644 --- a/src/controllers/controller.polarArea.js +++ b/src/controllers/controller.polarArea.js @@ -155,6 +155,8 @@ PolarAreaController.overrides = { generateLabels(chart) { const data = chart.data; if (data.labels.length && data.datasets.length) { + const {labels: {pointStyle}} = chart.legend.options; + return data.labels.map((label, i) => { const meta = chart.getDatasetMeta(0); const style = meta.controller.getStyle(i); @@ -164,6 +166,7 @@ PolarAreaController.overrides = { fillStyle: style.backgroundColor, strokeStyle: style.borderColor, lineWidth: style.borderWidth, + pointStyle: pointStyle, hidden: !chart.getDataVisibility(i), // Extra data used for toggling the correct item diff --git a/test/fixtures/plugin.legend/legend-doughnut-point-style.json b/test/fixtures/plugin.legend/legend-doughnut-point-style.json new file mode 100644 index 00000000000..6e644a39efd --- /dev/null +++ b/test/fixtures/plugin.legend/legend-doughnut-point-style.json @@ -0,0 +1,29 @@ +{ + "config": { + "type": "doughnut", + "data": { + "labels": [""], + "datasets": [{ + "data": [10], + "backgroundColor": "#00ff00", + "borderWidth": 0 + }] + }, + "options": { + "plugins": { + "legend": { + "labels": { + "pointStyle": "triangle", + "usePointStyle": true + } + } + } + } + }, + "options": { + "canvas": { + "height": 256, + "width": 512 + } + } +} diff --git a/test/fixtures/plugin.legend/legend-doughnut-point-style.png b/test/fixtures/plugin.legend/legend-doughnut-point-style.png new file mode 100644 index 0000000000000000000000000000000000000000..b0b216b0b250007a2457bbf8a119586e371e8c50 GIT binary patch literal 9488 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 YBb(83xAN~f@TL>Q%-Gtf)({u>Kf2;y!2kdN literal 0 HcmV?d00001 diff --git a/test/specs/global.defaults.tests.js b/test/specs/global.defaults.tests.js index b7fa9c8a276..31b763b7eab 100644 --- a/test/specs/global.defaults.tests.js +++ b/test/specs/global.defaults.tests.js @@ -103,7 +103,8 @@ describe('Default Configs', function() { index: 0, strokeStyle: '#000', textAlign: undefined, - lineWidth: 2 + lineWidth: 2, + pointStyle: undefined }, { text: 'label2', fillStyle: 'green', @@ -111,7 +112,8 @@ describe('Default Configs', function() { index: 1, strokeStyle: '#000', textAlign: undefined, - lineWidth: 2 + lineWidth: 2, + pointStyle: undefined }, { text: 'label3', fillStyle: 'blue', @@ -119,7 +121,8 @@ describe('Default Configs', function() { index: 2, strokeStyle: '#000', textAlign: undefined, - lineWidth: 2 + lineWidth: 2, + pointStyle: undefined }]; expect(chart.legend.legendItems).toEqual(expected); }); @@ -197,7 +200,8 @@ describe('Default Configs', function() { index: 0, strokeStyle: '#000', textAlign: undefined, - lineWidth: 2 + lineWidth: 2, + pointStyle: undefined }, { text: 'label2', fillStyle: 'green', @@ -205,7 +209,8 @@ describe('Default Configs', function() { index: 1, strokeStyle: '#000', textAlign: undefined, - lineWidth: 2 + lineWidth: 2, + pointStyle: undefined }, { text: 'label3', fillStyle: 'blue', @@ -213,7 +218,8 @@ describe('Default Configs', function() { index: 2, strokeStyle: '#000', textAlign: undefined, - lineWidth: 2 + lineWidth: 2, + pointStyle: undefined }]; expect(chart.legend.legendItems).toEqual(expected); });