Open
Description
Hello,
I was just wondering if you guys implemented the afterDraw / beforeDraw functions from chart js ?
Because it doesn't seem to work with a <CChartDoughnut> on React.
I'm using these versions :
"@coreui/chartjs": "^4.0.0-rc.0",
"@coreui/coreui": "^5.0.0-rc-2",
"@coreui/react-chartjs": "^3.0.0-rc.0",
"chart.js": "^4.4.2",
and these are the options I use in the <CChartDoughnut> component
options={{
responsive: true,
interaction: {
intersect: false,
},
plugins: {
afterDraw: (chart) => {
const ctx = chart.ctx
ctx.save()
const centerX = (chart.chartArea.left + chart.chartArea.right) / 2
const centerY = (chart.chartArea.top + chart.chartArea.bottom) / 2
ctx.textAlign = 'center'
ctx.textBaseline = 'middle'
ctx.font = '16px Arial'
ctx.fillText(`${percentage.toFixed(2)}%`, centerX, centerY)
ctx.restore()
},
tooltip: {
enabled: false,
},
legend: {
display: legend,
},
title: {
display: false,
},
},
}}
Metadata
Metadata
Assignees
Labels
No labels