chartist.js：第一个选项卡中的图形大小太小

Question

我有一个页面，其中有两个不同的选项卡布局，其中包含chart.js图形。这个工作示例可以在这里找到Codepen 我面临的问题（您可以在上面提到的笔中注意到）是第一个选项卡上的图形与其他图形相比非常小，尽管具有相同的图形选项值。我曾试图在chart.js之github issue提到的解决方案，它要求我们更新标签click这样的图表：

$(".tab").find(".ct-chart").each(function(i, e) { 
    e.__chartist__.update(); 
}); 

但只有固定的图表的整体问题，在所有选项卡不显示/尺寸太小。我试图更新文件加载图表，但这一直无济于事。

仅供参考：我有更多的图表（线图）在同一页面中的一个标签结构显示正常。

Answer 1

display:flex导致图表出现问题，只有第一个图表选项卡包含活动类，该活动类具有导致此问题的此属性。这真的是必要的，我们可以评论这个CSS属性，问题就解决了。让我知道如果这个属性是需要的，那么我们需要调整flexbox为全宽！

.tab.active { 
    display:block; 
    //display: flex; 
    //flex-wrap: wrap; 
} 

Codepen Demo