Size of chart isn't constrained by canvas element

[cfjedimaster]

I'm using the default chart from the docs (http://www.chartjs.org/docs/#getting-started-creating-a-chart) and I've noticed that even though my canvas has a width and height of 400, the chart takes over the entire browser, it actually goes below the fold. I feel like something this wrong must be a dumb mistake on my part (grin), so what am I missing?

[Spone]

Same problem here. The only solution I found is to constrain the width of the parent element.

[tiagoroldao]

You need to set responsive: false the Chart's options if you don't want it to resize to parent.

See here: http://www.chartjs.org/docs/#chart-configuration-common-chart-configuration

[cfjedimaster]

According to the docs: Resizes when the canvas container does.

To me, that doesn't imply "I will get bigger than then canvas". Does it imply that to you? I could be reading it wrong.

[tiagoroldao]

It references the canvas container, not the canvas itself - meaning the parent. if your container (a div holding the canvas) constrains the canvas, then it'll only expand to that parent.

To be clear, the canvas is resized by Chart.js (if responsive: true), rather than Chart.js 'responding' to the canvas stretching.

[cfjedimaster]

Ah - so if my canvas is 'naked' on the page, ie right under body.... ok. This makes sense.

Maybe the docs could make this is a bit clearer though - for slow folks like me? (And obviously I wasn't the only person to run into this.)

[tiagoroldao]

What do you mean? To make field description description clearer, or the behaviour and usage explanations more accessible?

For the former, the field description could be changed to Resizes the chart canvas when its container does.

For the latter, I don't know... Maybe adding a sample html file? This would need input from the project devs.

[cfjedimaster]

Maybe the initial sample could include a div with a set size. I'd kind of imagine most people would not want a full screen chart. Not that it wouldn't make sense sometimes of course, but in general, I'd assume a set size.

[panzarino]

Will add to my coming doc updates