javascript - 谷歌图表 : vary colors based on names in linechart

Question

从这个http://jsfiddle.net/QHJA6/161/ fiddle 我试着根据不同的名字显示不同的颜色

'FOO' blue 
'BAR' yellow
'BAZ' green
...

并且值可能因他们而异...... 所以回家我的数据看起来是

[1,'FOO', 5]
[2,'BAR', 10]
[3,'BAZ', 7]
....
....

因此颜色将遵循第一个值，但要绘制的值将不同...

Answer 1

那个 jsfiddle 示例已过时，因为可视化 API 现在允许使用“样式”列 Angular 色为各个列指定颜色，这要简单得多。给定一个包含 3 列(x 值、类别、y 值)的 DataTable，您可以创建值到颜色的映射并使用 DataView 设置列颜色:

var colorMap = {
    FOO: '#0000ff',
    BAR: '#00ff00',
    BAZ: '#ffff00'
};

var view = new google.visualization.DataView(data);
view.setColumns([0, 2, {
    type: 'string',
    role: 'style',
    calc: function (dt, row) {
        return colorMap[dt.getValue(row, 1)];
    }
}]);

参见工作示例:http://jsfiddle.net/asgallant/aPh8Z/