Ng2-charts: Small pie chart size problem

[snarum]

I don't know if this is a general chart.js or an angular2 problem, but I am having problems making the size of a pie chart right. When i set the width of the canvas to 300px, the height is automatically set to 150px, leaving lots of free space on the sides. Overriding the canvas height makes everything looks warped.

When I add legends this is even a bigger problem, making the pie chart tiny, with very wide row of lables. Any idea if this is a bug, or if I am doing something wrong?

The chart.js v1.3 didn't have these issues, but legends were rendered quite differently there.

[valorkin]

update to latest ng2-charts and chart.js 2
it could be a bug in chart.js or simply unexpected behavior
please check docs of chart.js itself

[snarum]

I'm using ng2-charts 1.1.0 and chart.js 2.1.3. that should be latest?

[valorkin]

yes it is https://github.com/valor-software/ng2-charts/blob/development/package.json#L53

[snarum]

I've done some more testing, and if I add the pie chart using regular javascript, and not using ng2-charts, the scaling is much better, though not quite perfect. The width/height properties of the canvas is quite a mystery to me. From what I have experienced I would guess that there is a related bug in ng2-charts.

[isthar13]

Still having the same problem. A lot of free space surrounds the pie chart and legends are so big that chart doesn't fit in the canvas.

[valorkin]

Seems I will have to make it a directive
not component
than you will have access to canvas

[valorkin]

please try v1.4

[valorkin]

Now you have access to canvas, so you can style it

[paviad]

Closing for inactivity - if issue persists, feel free to comment with a working example which demonstrates the issue.