Chart.js 无法在模态中更新图表

Question

我有一个模态图表，可以通过动画（css 变换）进行缩放。尽管图表设置为

responsive : true

，并且一旦模态达到其最终宽度和高度就调用

resize()

，chart.js 不会更新画布的宽度和高度。

如果我此时在控制台中记录图表，我会看到

mychart.canvas.outerHTML : "<canvas class=\"chart\" height=\"0\" style=\"display: block;\">
mychart.width : 0
mychart.height: 0

在页面上，我使用的画布确实具有符合 CSS 的适当尺寸

.graph{
    display: inline-flex;
    flex-direction: column;
    flex-grow: 1;
    margin-bottom: 0px;
    position: relative;
}
.graph > canvas {    
    display: block;
    width: 100% !important;
    height: 100% !important;
    background-color: #222;
}

如果我检查页面，我会看到我的画布通过 CSS 是 100% 100%。

我尝试了

update

、

render

、

resize

甚至通过

width 

和

height 

到

resize

，它不会渲染。

这些都没有效果（计算w和h）

 mychart.canvas.width = w;
 mychart.canvas.height = h;  
 mychart.chartArea.height = h;
 mychart.chartArea.width = w;
 mychart.canvas.parentNode.style.height = w+'px';
 mychart.canvas.parentNode.style.width = h+'px';
 mychart.resize(w, h);    
 mychart.update();     

如果我采用完全相同的代码/html 并且不在模态中使用它，那么它就可以工作。

我用的是最新的4.3.0版本