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 00000000000..b0b216b0b25 Binary files /dev/null and b/test/fixtures/plugin.legend/legend-doughnut-point-style.png differ 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); });