在页面加载时显示和隐藏谷歌可视化图表。

Question

我有两个谷歌折线图。我在单个函数中为它们创建了代码，并在google.setOnLoadCallback()事件上调用它。但是在第一次加载页面时我想只显示一个图表而其他图表应该调用点击按钮。另外单击我显示的按钮并隐藏其名称上的图表，但我想在第一次只显示一个图表。我也尝试显示第一张图表，但是当我点击其他图表时，它会在宽度上展开并拆除UI。所以任何帮助都将不胜感激。

Answer 1

您最初应该使用两个图表容器进行绘制，因为隐藏div中的绘图会破坏Visualization API的内部维度检测算法（这就是您的图表在隐藏时绘制错误的原因）。使用“就绪”事件处理程序在完成绘制时隐藏图表：

google.visualization.events.addListener(hiddenChart, 'ready', function () {
    document.querySelector('#hiddenChartDiv').style.display = 'none';
});

在创建图表之后但在绘制之前放置事件处理程序。