diff --git a/src/components/statistics/StatisticsSearch.js b/src/components/statistics/StatisticsSearch.js index b1496dd..0059d54 100644 --- a/src/components/statistics/StatisticsSearch.js +++ b/src/components/statistics/StatisticsSearch.js @@ -112,7 +112,8 @@ export default function StatisticsSearch({ label(tooltipItem, data) { const label = data.datasets[0].labels[tooltipItem.index] || '', value = data.datasets[0].data[tooltipItem.index]; - const output = ` ${label} : ${value} %`; + + const output = ` ${label} : ${value} 건`; return output; } }, @@ -153,6 +154,25 @@ export default function StatisticsSearch({ ] }; + const handlerPlugins = chartData => { + return { + afterDraw: function (chart) { + if (chartData.datasets[0].data.length <= 0) { + let ctx = chart.chart.ctx; + let width = chart.chart.width; + let height = chart.chart.height; + + chart.clear(); + ctx.save(); + ctx.textAlign = 'center'; + ctx.textBaseline = 'middle'; + ctx.fillText('표시할 데이터가 없습니다.', width / 2, height / 2); + ctx.restore(); + } + } + }; + }; + return ( <>
@@ -319,26 +339,7 @@ export default function StatisticsSearch({ data={totalData} options={barOptions} height={400} - plugins={{ - afterDraw: function (chart) { - if (totalData.datasets[0].data.length <= 0) { - let ctx = chart.chart.ctx; - let width = chart.chart.width; - let height = chart.chart.height; - - chart.clear(); - ctx.save(); - ctx.textAlign = 'center'; - ctx.textBaseline = 'middle'; - ctx.fillText( - '표시할 데이터가 없습니다.', - width / 2, - height / 2 - ); - ctx.restore(); - } - } - }} + plugins={handlerPlugins(totalData)} />
@@ -357,6 +358,7 @@ export default function StatisticsSearch({ data={topData} options={doughnutOptions} height={275} + plugins={handlerPlugins(topData)} /> {/*