search

mykola-digtiar / chartjs-plugin-piechart-outlabels

Highly customizable Chart.js plugin that displays labels outside the pie/doughnut chart.
https://piechart-outlabels.netlify.com/sample/
MIT License
51 stars 38 forks source link

Where does zoomOutPercentage option come from? #9

Closed json2d closed 4 years ago

json2d commented 5 years ago

So in this example code: https://piechart-outlabels.netlify.com/quickstart

there's an option called zoomOutPercentage.

But I can't find any references to this option in chartjs docs. Where is it from? Is it from another plugin?

I have some issues with getting the entire piechart to fit in the canvas, and it seems this option is suppose to help.

json2d commented 5 years ago

Ok so zoomOutPercentage belongs to this plugin. I was confused by the scoping of it in the options object.

ref: https://github.com/Neckster/chartjs-plugin-piechart-outlabels/blob/dbd276fd81b1ef1e2e90b266bf0db294ebb463c2/src/outlabeledCharts.js#L23

SUVOLewis commented 5 years ago

@json2d Could you please elaborate on this? I'm currently experiencing the same issue as you. I can get the pie charts to render with the labels, but I can't seem to get the zoom to work to allow everything to fit.

image

As you can see, I've tried to add "zoomOutPercentage" into various areas within the chart options. Unfortunately, I see no difference.

Also, what chart type were you using? Just a normal 'pie' chart or the provided 'outlabeledPie'?

SUVOLewis commented 5 years ago

Just a heads up, for anyone that sees this in the future:

You MUST use the 'outlabeledPie' or other plugin-provided outlabeled chart types in order to use the 'zoomOutPercentage' key value.

If you're using ng2-charts, you may run across the 'unsupported chart type' error. To fix this, simply amend your ng2-charts.js file in your node_modules like so:

image