google-visualization - Google Charts - 类似于 Google Adsense 中的折线图

Question

有人有来自 Google adnsese 的 2 vAxis line Chart 的酷示例，您可以在其中添加和删除要在图表中显示的值吗？

我已经完成了 2 vAxis 图表并显示了许多值，但现在我想添加和删除其中一些并重建图表。

Answer 1

我还没有看到 AdSense 图表，但我会尽力回答。

要从图表中添加或删除数据点或线，您可以操作DataTable （或创建一个新的），然后在图表上再次调用“绘制”。

这是一个动画示例：

var data = google.visualization.arrayToDataTable([
    ['x','Domain', 'Line 1', 'Line 2'],
    ['A', 1, 1, 0.5],
    ['B', 2, 0.5, 1]
]);

// Use transition animation 
var opts = {animation: { duration: 1000, easing: 'out' }}
var chart = new google.visualization.LineChart(document.getElementById('visualization'));
chart.draw(data, opts);

// remove a data line (column)
data.removeColumn(3);
chart.draw(data, opts);

// add a new data point (row)
data.addRow(['C',4,1,0.5]);
chart.draw(data, opts);