New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Pie/Dougnut radius #3923
Comments
Which version are you using? If it's 2.5 you could use the layout padding options to force the chart to use a smaller canvas size |
I'am using version 2.5, and tried the layout padding options. This only works partial since the pie gets smaller, but also the legend above the pie. It's the same effect as using a width on the canvas itself. |
There aren't any options for just the pie itself. I think your plugin would work if you used |
I tried the beforeDraw also. I even get real values for outerRadius in the beforeUpdate, and my code changes the value to a smaller outerRadius, but no visual effect. |
Hey, did you find a solution ? I find the pie way to big... |
No, sorry, just went with the flow and still waiting for an updated version with radius support. |
By default, Doughnut Or Pie will take the maximum dimension of canvas (width or height which is smaller) and set it to OuterRadius property. So with a little custom ChartJS will take the property in Options tag, I edited Chartjs.min.js which I attached in this comment. Download and embed into your project. Just add outerRadius to Options: like this:
|
Hey Phong993, Thank you for your effort to fix the radius problem with pies graphs. Is it possible to contribute your fix/work to the project so it will become a part of the main ChartJS fork? |
Adds a new option, `radiusPercentage` that shrinks the outside radius of doughnut / pie charts. A percentage is used to enable more flexibility during responsive conditions.
I try to scale the Pie because it's radius is now maximized to the size of the canvas. I want a smaller Pie.
So I use this code the extend the chart:
Chart.pluginService.register({
beforeDraw: function (chart) {
if (chart.options.radius != undefined) {
chart.chart.outerRadius *= chart.options.radius;
chart.chart.radiusLength *= chart.options.radius;
}
}
});
But is has no visual effect on the size of the pie. I can see however that the outerRadius has valid values, and I can change these values, but nothing happens.
Is this a bug, or are the outerRadius and radiusLengt fixed?
The text was updated successfully, but these errors were encountered: