显示包含给定数据部分的Google柱形图

Question

所以我使用Google堆叠的“柱形图”，给出了数据：

[
['red','green','blue'],
['one', '1','2','3'],
['two', '1','2','3']
['three', '1','2','3']
['four', '1','2','3']
['five', '1','2','3']
]

因此，方案是在图表上仅显示两个，三个，四个，然后每当用户点击左< / strong> / 右侧箭头，数据将向左或向右移动。 例如，当用户点击左箭头时，图表将显示一个，两个，三个

我们是否可以通过Google Chart实现这一目标？

Answer 1

我通过在maxRows中添加一些变量并在drawChart函数之外添加一个额外函数来实现这一目的。

我的两个左/右按钮看起来像这样：

<input onClick="redrawChart(-1)" type="button" value="<- Left" />
<input onClick="redrawChart(1)" type="button" value="Right ->" />

我将变量定义为maxRow，然后在函数完成时返回dataTable中有多少行，例如

chart.draw()
return numberOfRows;

我的redrawChart函数看起来像这样：

function redrawChart(a) {
    for (i = 0; i < showRows.length; i++) {
        showRows[i] += a
    }
.
.
error checking
.
.
    drawChart(showRows)
}

查看this fiddle并告诉我您的想法。