Chart.defaults.cutOutPie = Chart.helpers.clone(Chart.defaults.pie);
Chart.controllers.cutOutPie = Chart.controllers.pie.extend({
updateElement: function(arc, index, reset) {
Chart.controllers.pie.prototype.updateElement.call(this, arc, index, reset);
var displacement = this.getDataset().displacements[index]||0;
var model = arc._model;
var angle = model.startAngle + model.circumference/2;
model.x += Math.cos(angle) * displacement;
model.y += Math.sin(angle) * displacement;
}
});
new Chart('chart', {
type: 'cutOutPie',
data: {
labels: ['a', 'b', 'c', 'd', 'e', 'f'],
datasets: [{
data: [1, 7, 2, 8, 3, 9],
backgroundColor: ['red', 'orange', 'green', 'gold', 'pink', 'blue'],
displacements: [0, 0, 40, 0, 0, 16],
}],
},
});
<script src="//cdnjs.cloudflare.com/ajax/libs/Chart.js/2.5.0/Chart.min.js"></script>
<canvas id="chart" width="400" height="300"></canvas>
