小编kde*_*dev的帖子

我正在尝试在选项卡系统中使用 ChartsJS。呈现第一个选项卡中的第一个图表，但不呈现后续图表。

我相信这是因为选项卡有display:none，所以当图表第一次生成时，它们是在一个零维度的 div 中创建的。

这解决了问题，但打破了标签：

.vertical-nav>div.tab-content {
    display: block !important;
}

考虑到这一点，我尝试了各种方法来在选项卡打开后重新生成图表，或者display:block在生成图表之前强制执行。什么都行不通。

这是我重新生成图表的尝试：

jQuery(document).ready(function() {

    jQuery('.vertical-nav ul li span').click(function(){

        // Target the canvas within the correct tab
        var tabIndex = jQuery(this).parent().index();
        var canvasID = jQuery('.vertical-nav .tab-content:eq( ' + tabIndex + ' ) canvas').attr('id');

        theChart = charts[canvasID].chart;
        builtChart = charts[canvasID].builtChart;

        // Destroy all of the charts so that we can rebuild them
        for (var key in charts) {
            if (charts.hasOwnProperty(key)) {
                charts[key].builtChart.destroy();
            }
        }

        // get …