页面加载时canvasjs图表中的问题？答案

【问题标题】：issue in canvasjs chart on page load?页面加载时canvasjs图表中的问题？
【发布时间】：2018-04-13 11:34:54
【问题描述】：

我的 canvasjs 图表会立即浮动，然后在检查时回到原来的位置。可能是什么问题？

我的网站中有 2 个动态 canvasjs 图表，位于标签正文中。第一个图表显示正常，但是当我单击第二个选项卡时，其中的图表向左浮动，然后在检查后到达其原始位置。所有数据都很好只是想知道js或css的问题。

我做的 php 像这个数据都很好，并且运行良好。

<div class="charcon_n" id="chartContainer_n<?php echo $i; ?>" style="height: 350px; width: 100%;" data-point='<?php echo json_encode($data_n, JSON_NUMERIC_CHECK); ?>'></div>

【问题讨论】：

标签： css canvasjs

【解决方案1】：

每当切换选项卡时，应调用已激活选项卡中每个图表的渲染方法，以便图表可以获取其容器的实际尺寸。

$("#tabs").tabs({
create: function (event, ui) {
    //Render Charts after tabs have been created.
    $("#chartContainer1").CanvasJSChart(options1);
    $("#chartContainer2").CanvasJSChart(options2);
},
activate: function (event, ui) {
    //Updates the chart to its container size if it has changed.
    ui.newPanel.children().first().CanvasJSChart().render();
}
});

请看jQuery gallery example。

【讨论】：

谢谢。 @priyanka