react-chartjs-2 icon indicating copy to clipboard operation
react-chartjs-2 copied to clipboard

Is there any way to change the space taken by the legends in a chart ?

Open Saroopashree opened this issue 5 years ago • 3 comments

Pie

Saroopashree avatar May 13 '20 14:05 Saroopashree

Yes, there is, you can change the box size of it and the padding between the legends: var chartLegend = { labels: { boxWidth: 15, padding: 10, }, }; <Pie legend={chartLegend} data={chartData}></Pie>

Ahmad-AlShalabi avatar Jun 04 '20 13:06 Ahmad-AlShalabi

When changing the value for the boxWidth, only the width of the colored boxes in each of the legend items are changed. Adding padding as you have mentioned creates padding between each of the rows in the legend set.

But the desired behavior is to set a max-height property to limit the space taken by the legend section. Is there any way we can achieve this behavior @Ahmad-AlShalabi ?

Saroopashree avatar Jul 24 '20 19:07 Saroopashree

I'm facing the exact same issue. What could be the solution ?

morucci avatar Aug 26 '20 13:08 morucci