diff --git a/src/controllers/controller.bar.js b/src/controllers/controller.bar.js index d7daa6e8430..43c406acaa2 100644 --- a/src/controllers/controller.bar.js +++ b/src/controllers/controller.bar.js @@ -290,7 +290,7 @@ export default class BarController extends DatasetController { }; if (includeOptions) { - properties.options = sharedOptions || me.resolveDataElementOptions(i, mode); + properties.options = sharedOptions || me.resolveDataElementOptions(i, bars[i].active ? 'active' : mode); } me.updateElement(bars[i], i, properties, mode); } diff --git a/src/controllers/controller.bubble.js b/src/controllers/controller.bubble.js index 115012a142d..55873dafe75 100644 --- a/src/controllers/controller.bubble.js +++ b/src/controllers/controller.bubble.js @@ -86,7 +86,7 @@ export default class BubbleController extends DatasetController { properties.skip = isNaN(iPixel) || isNaN(vPixel); if (includeOptions) { - properties.options = me.resolveDataElementOptions(i, mode); + properties.options = me.resolveDataElementOptions(i, point.active ? 'active' : mode); if (reset) { properties.options.radius = 0; diff --git a/src/controllers/controller.doughnut.js b/src/controllers/controller.doughnut.js index bf472317c07..0d4d135f248 100644 --- a/src/controllers/controller.doughnut.js +++ b/src/controllers/controller.doughnut.js @@ -186,7 +186,7 @@ export default class DoughnutController extends DatasetController { innerRadius }; if (includeOptions) { - properties.options = sharedOptions || me.resolveDataElementOptions(i, mode); + properties.options = sharedOptions || me.resolveDataElementOptions(i, arc.active ? 'active' : mode); } startAngle += circumference; diff --git a/src/controllers/controller.line.js b/src/controllers/controller.line.js index 3fca6a738cc..ab3c5051556 100644 --- a/src/controllers/controller.line.js +++ b/src/controllers/controller.line.js @@ -71,7 +71,7 @@ export default class LineController extends DatasetController { properties.parsed = parsed; if (includeOptions) { - properties.options = sharedOptions || me.resolveDataElementOptions(i, mode); + properties.options = sharedOptions || me.resolveDataElementOptions(i, point.active ? 'active' : mode); } if (!directUpdate) { diff --git a/src/controllers/controller.polarArea.js b/src/controllers/controller.polarArea.js index 243bcc6c129..0c6fa0c99bd 100644 --- a/src/controllers/controller.polarArea.js +++ b/src/controllers/controller.polarArea.js @@ -91,7 +91,7 @@ export default class PolarAreaController extends DatasetController { outerRadius, startAngle, endAngle, - options: me.resolveDataElementOptions(i, mode) + options: me.resolveDataElementOptions(i, arc.active ? 'active' : mode) }; me.updateElement(arc, i, properties, mode); diff --git a/src/controllers/controller.radar.js b/src/controllers/controller.radar.js index e38c0778376..e8f037c5184 100644 --- a/src/controllers/controller.radar.js +++ b/src/controllers/controller.radar.js @@ -53,7 +53,7 @@ export default class RadarController extends DatasetController { for (let i = start; i < start + count; i++) { const point = points[i]; - const options = me.resolveDataElementOptions(i, mode); + const options = me.resolveDataElementOptions(i, point.active ? 'active' : mode); const pointPosition = scale.getPointPositionForValue(i, dataset.data[i]); const x = reset ? scale.xCenter : pointPosition.x; diff --git a/test/fixtures/controller.doughnut/doughnut-set-active-elements.js b/test/fixtures/controller.doughnut/doughnut-set-active-elements.js new file mode 100644 index 00000000000..7a9a778a92f --- /dev/null +++ b/test/fixtures/controller.doughnut/doughnut-set-active-elements.js @@ -0,0 +1,27 @@ +module.exports = { + description: 'https://github.com/chartjs/Chart.js/issues/9248', + config: { + type: 'doughnut', + data: { + datasets: [ + { + data: [34, 33, 17, 16], + backgroundColor: ['#D92323', '#E45757', '#ED8D8D', '#F5C4C4'] + } + ] + }, + options: { + events: [], // for easier saving of the fixture only + borderWidth: 0, + hoverBorderWidth: 4, + hoverBorderColor: 'black', + cutout: '80%', + } + }, + options: { + run(chart) { + chart.setActiveElements([{datasetIndex: 0, index: 1}]); + chart.update(); + } + } +}; diff --git a/test/fixtures/controller.doughnut/doughnut-set-active-elements.png b/test/fixtures/controller.doughnut/doughnut-set-active-elements.png new file mode 100644 index 00000000000..14b0c39c022 Binary files /dev/null and b/test/fixtures/controller.doughnut/doughnut-set-active-elements.png differ