Javascript Chart.js-响应能力无法正确处理设备方向更改

我已经在我的项目中实现了

Chart.js

，但在移动设备上更改方向时遇到了问题。

如果屏幕从

portait

模式更改为

scape

所有内容都按预期调整大小，
但是当将表格

横向

更改为

纵向

时，图表没有调整大小。。。它保持横向模式的宽度

我正在寻找一种不使用jQuery mobile的方法

---

如果有人知道如何处理这种（错误的）行为，我真的很高兴知道该怎么做。

在jQuery mobile中监听方向更改事件，并触发窗口大小调整（如果您有jQuery，这可以像

$（window）一样简单。

trigger（'resize'）；

或者，您可以复制在方向更改处理程序中调整窗口大小时执行的代码

function () {
    // Basic debounce of resize function so it doesn't hurt performance when resizing browser.
    var timeout;
    return function () {
        clearTimeout(timeout);
        timeout = setTimeout(function () {
            Chart.helpers.each(Chart.instances, function (instance) {
                // If the responsive flag is set in the chart instance config
                // Cascade the resize event down to the chart.
                if (instance.options.responsive) {
                    instance.resize(instance.render, true);
                }
            });
        }, 50);
    };
};

---

这主要是Chart.js库代码的复制粘贴，只是我用

Chart.helpers替换了每个。每个
我在不同方向的移动小工具上都有类似的问题。这是使用CSS样式解决的。例如：

@media (orientation:portrait) {
 .chart-container {
   min-height: 40vh;
 }
}

@media (orientation:landscape) {
 .chart-container {
   min-height: 90vh;
 }
}

THX，非常感谢……今天我终于找到时间来测试你剪下的图片，它非常棒（这非常完美，因为我想避免使用jquery mobile）css解决的问题：
canvas{width:100%！important；}
带图表选项：
选项：{resposive:true，maintaintAspectratio:false}