Google visualization Google表格图表：如何根据列值更改行背景颜色

我正在使用谷歌表格图表以表格的形式显示一些数据。根据行上的状态值，我必须更改行的背景颜色。所以我必须动态地显示多种颜色。我查阅了表格文档，也在网上搜索过。但找不到提供的此类功能。请帮助。

这里有一些选项供您选择

使用

在数据中添加您自己的

html

，方法是提供

v:

value

f:

格式化值
和

allowtml:true

在

'ready'

事件中自己修改表

请参阅以下使用所有三个选项的示例

google.charts.load（'current'{
回调：函数（）{
var data=new google.visualization.DataTable（）；
data.addColumn（'string'，'Department'）；
data.addColumn（“数字”、“收入”）；
data.addRows([
[Shoes'，10700]，
[‘体育’，-15400]，
[Toys'，12500]，
[‘电子学’，-2100]，
[“食物”，22600]，
[“第1100条]，
[
//添加您自己的html
{v:'Web'，f:'Web'}，
{v:9999，f:'9999'}
]
]);
var container=document.getElementById（'table_div'）；
var table=新的google.visualization.table（容器）；
google.visualization.events.addListener（表'ready'，函数（）{
对于（var i=0；i

将HTML DOM与数据对象混合时，行索引可能不同步，并编辑错误的行。在我的例子中，我使用了
dashboard（）
和
bind（）
和
ChartWrapper（）
来使用
StringFilter
，因此我避免了
addListener（）
在呈现之前更改HTML DOM和修改数据对象：

for (var i = 0; i < data.getNumberOfRows(); i++) {
  if (data.getValue(i, 1) === 1100) {
    // change entire row
    data.setRowProperty(i, 'style', 'background-color:magenta;');
    // or change columns 0 & 1
    data.setProperty(i, 0, 'style', 'background-color:magenta;');
    data.setProperty(i, 1, 'style', 'background-color:magenta;');
  }
}

for（var i=0；i
感谢您的支持answer@user2928913--请用投票按钮附近的复选标记将答案标记为已接受，好吗？这将允许我将其他人标记为此副本…有关更多选项，请参阅此答案-->