Chart.js条形图溢出其包含元素

Question

chart.js之

padding已经应用到容器时,我无法将这个愚蠢的图表留在容器中.如果responsive选项设置为无关紧要true.

我设定的也无所谓box-sizing.responsive如果不适合它的容器,该选项的目的是什么？

Answer 1

与大多数CSS一样,答案是使用另一个包装器!

我有同样的问题(我正在使用盒子大小)

只需在画布上放一个div!(div将继承盒子大小)

<div>
  <canvas></canvas>
</div>

祝好运

:)

Answer 2

这将解决问题

Javascript：

new Chart(ctx).Line(data, {
    responsive:true,
    maintainAspectRatio: false
});

ES6

Chart.defaults.global.responsive = true;
Chart.defaults.global.maintainAspectRatio = false;