谷歌图表自定义颜色绑定答案

【问题标题】：Google Charts Custom Color Binding谷歌图表自定义颜色绑定
【发布时间】：2013-05-10 15:40:36
【问题描述】：

是否可以将数据绑定到 Google Charting API 中的特定颜色...

假设我有 2 个饼图，如 FIDDLE.. 我想将数据绑定到特定的颜色 -

例如 - 在所有图表中，EAT 应始终为 RED，SLEEP 应始终为 GREEN...

如果特定项目未出现在任何特定图表中，则对应于缺失值的颜色不应出现在该图表中...

我试过了

slices: [{color: 'black', {}, {}, {color: 'red'}]

还有

slices: {0: {color: 'black'}, 3: {color: 'red'}}

但无法处理缺失值....

请参阅Fiddle 以清楚了解我要达到的目标here...

【问题讨论】：

标签： jquery svg google-visualization

【解决方案1】：

设置要用于每个类别的颜色数组。您可以根据饼图中的内容填充颜色数组以用于当前绘制的饼图，循环遍历每个项目并添加相关颜色。我在你的 JSfiddle 中设置了它。我使用了通用颜色，但你可以使用任何你想要的十六进制颜色。我没有考虑类别没有关联颜色的情况，因此您需要检查是否存在问题。

colors = {'Work':'blue',
      'Eat':'red',
      'Commute':'yellow',
      'Watch TV':'green',
      'Sleep':'purple',};

function colorsArray(data){
    var array = [];
    for (var i=0;i<data.length;i++){
        array.push(colors[data[i]['c'][0]['v']]);
    }
    console.log(array)
    return array
}

你可以在这里查看小提琴：http://jsfiddle.net/Qquse/130/

【讨论】：

解决方案已停止工作...有一段时间还不错..但现在解决方案崩溃了..我相信它无法计算 data.length
JavaScript 运行时错误：无法获取未定义或空引用的属性“长度”
我不知道为什么，但谷歌创建的数据对象发生了变化，一个快速的解决方法是将颜色：colorsArray(data.D') 更改为颜色：colorsArray(data .K)。我不知道这是否会再次发生，甚至定期发生，我会看一下代码，看看它们是否是一种更好的方法，使它更灵活，这样它就不会因为谷歌可能改变的东西而中断。
这里是一个新的固定版本，基本上你会想要单独创建chartdata数组，所以你可以将它传递给google，并自己访问它作为参考，这样你就可以制作一个colors数组。 jsfiddle.net/Qquse/140