如何在不重新传递数据的情况下重绘Google可视化图表？

Question

我试图在窗口大小改变等事件上调整谷歌可视化柱形图。

唯一似乎能够实现这一点的方法是使用.draw方法并再次传递图表数据。由于数据没有更改，只是窗口的大小更改了，因此这似乎是一个愚蠢的解决方案。

尝试调用不带数据参数的draw会导致错误未定义数据表。

是否有没有重复创建步骤的方法可以更新图表？

- ficuscr

Answer 1

建议使用ChartWrapper类，您可以使用该包装器创建任何图表，创建时分配数据和选项，而且draw方法不需要参数。请注意保留HTML标签。

var wrapper = new google.visualization.ChartWrapper({
  chartType: 'BarChart',
  dataTable: data,
  options: chartOptions,
  containerId: 'chart_div'
});
wrapper.draw();

确保在加载时包含'controls'包...

google.charts.load('current', {packages:['controls', 'corechart']}).then(function () {...

- WhiteHat

---

谢谢。我能够使用Wrapper（包装器）和 setDataTable 以及 setOption（用于宽度和高度更改）拼凑出一些东西，这样现在我可以调整大小而不用担心数据，但仍然可以在需要时更新底层数据。同时实现这两个功能非常困难。 - ficuscr

不确定我是否理解大小问题，但您应该能够使图表对容器大小响应而无需更改大小选项，请查看这个答案。 - WhiteHat

类似的方法尝试了一些，但运气不太好。图表是在可以调整大小的“grid-stack”项中呈现的。到目前为止，明确表达已经很有效了。我将浏览一下您在该类别中的其他答案。再次感谢。 - ficuscr