Javascript Chart.js的自动高度

我使用Chart.js正确地遵循了文档，并且我的条形图看起来太大，直到我单击inspect element，然后图表似乎会调整大小并捕捉到正确的位置

在我的canvas元素上没有内联样式，一旦我转到Inspect元素，下面的样式将发挥作用。我不确定图表从何处或如何获得这些内联样式

canvas{
 width: 100% !important;
 max-width: 800px;
 height: auto !important;}

试一试

---

或者，为什么要将

宽度设置为100%，而不将
高度设置为100%
？在您的屏幕视频中，它位于另一个
div
的内部，因此我也会尝试播放w/the
height
。最后，我不想使用全局
canvas
CSS选择器，而应该使用
canvas#barChart
，因为否则它将应用于所有画布，而不仅仅是
chartjs
画布。
maintainationAspectratio:false-试试看this@crc442不，当我检查元素时，仍然只能捕捉到正确的大小。你能粘贴一些相关的代码部分吗？我认为图表可能是在元素实际可见之前初始化的，一旦元素可见，你需要在窗口上触发一个调整大小事件，或者触发图表的重新渲染器。。
var barChart = new Chart(ctx, {
  type: 'bar',
  responsive: true,
  maintainAspectRatio: false,
  data: {
    ...
  },
  options: {
    animation: {
      onComplete: function (animation) {
        this.options.animation.onComplete = null; // disable after the first render
        animation.chartInstance.resize()
      }
    }
  }
});