Google柱形圖：如何更改負值的列的顏色

Question

我正在嘗試創建柱形圖，並且希望列的值爲負值時爲紅色。這是我的功能：

function drawChartFlows(data, title, id) { 

if (googleAPILoaded != true) 
    return; 

var array = new google.visualization.DataTable(); 
array.addColumn('number', 'months'); 
array.addColumn('number', 'flows'); 
var flows = dataToArray(data); 
var series = []; 
for (var it = 0; it < flows.length; it++) { 
    var flow = Number(flows[it]); 
    if (flow <= 0) { 
     series[it] = 'red'; 
     array.addRow([it, (flow*(-1))]); 
    } else { 
     series[it] = 'blue'; 
     array.addRow([it, flow]); 
    } 
} 
var options = { 
     title: 'Cash flows for '+title, 
     width: 1400, 
     height: 800, 
     legend: { position: 'none' }, 
     chart: { subtitle: 'monthly flows' }, 
     axes: { 
      x: { 
       0: { side: 'top', label: 'Cash flows'} 
      } 
     }, 
     bar: { groupWidth: "50%" }, 
     colors: series 
}; 

var chart = new google.visualization.ColumnChart($(id)[0]); 
chart.draw(array, options); 
} 

列顯示正確，但它們都是藍色的。我注意到所有列的顏色取決於系列[0]中的顏色。如果系列[0]爲「藍色」，則無論我在系列[]的其他插槽中放置什麼顏色，所有列都是藍色。

我做錯了什麼？ 提前謝謝！

Answer 1

使用樣式Column Role

array.addColumn('number', 'months'); 
array.addColumn('number', 'flows'); 
array.addColumn({role: 'style', type: 'string'}); 

然後...

if (flow <= 0) { 
    array.addRow([it, (flow*(-1)), 'color: red;']); 
} else { 
    array.addRow([it, flow, 'color: blue;']); 
}