負の値または0未満の値のGoogle棒グラフの色

Question

値が0より小さい場合、Googleの棒グラフの色を「赤」とするオプションを探しています。今のところ私は多くのことを試しました。しかし、何も働かない。

私もcolorFormaterをチェックし、機能colorNegativeそれはcoreChartと表でのみ動作していません。以下は私が使用しているコードです。提案してください。

google.charts.load('current', {'packages':['corechart','bar']}); 
google.charts.setOnLoadCallback(drawBasic); 

function drawBasic() { 

     var data = new google.visualization.arrayToDataTable([ 
      ['', 'Cost'], 
      ['A', 20], 
      ['B', 30 ], 
      ['C', 50 ], 
      ['D', 60], 
      ['E', 90 ], 
      ['F', 24 ], 
      ['G', 40 ], 
      ['H', 0], 
      ['I', 0], 
      ['J', -30 ], 
      ['K', -54 ], 
      ['L', -60] 
     ]); 

     var options = { 

       width: 419, 

       colors: ['#bac405','#f95602'], 
      bars: 'horizontal', 
      legend:'bottom', 

     }; 

     var chart = new google.visualization.BarChart(document.getElementById('function')); 

     chart.draw(data,options); 
    } 

Answer 1

私は私の質問に答えました。ちょうどバーにビューを追加しました。このリンクに

おかげ - http://jsfiddle.net/asgallant/QHJA6/

google.charts.load('current', {'packages':['corechart','bar']}); 
google.charts.setOnLoadCallback(drawBasic); 

function drawBasic() { 

     var data = new google.visualization.arrayToDataTable([ 
      ['', 'Cost'], 
      ['A', 20], 
      ['B', 30 ], 
      ['C', 50 ], 
      ['D', 60], 
      ['E', 90 ], 
      ['F', 24 ], 
      ['G', 40 ], 
      ['H', 0], 
      ['I', 0], 
      ['J', -30 ], 
      ['K', -54 ], 
      ['L', -60] 
     ]); 

     var view = new google.visualization.DataView(data); 
    view.setColumns([0, { 
     type: 'number', 
     label: 'Value', 
     calc: function (dt, row) { 
      return (dt.getValue(row, 1) < 0) ? dt.getValue(row, 1) : null; 
     } 
    }, { 
     type: 'number', 
     label: 'Value', 
     calc: function (dt, row) { 
      return (dt.getValue(row, 1) > 0) ? dt.getValue(row, 1) : null; 
     } 
    }]); 

     var options = { 

       width: 419, 

      colors: ['red','#bac405'], 
      bars: 'horizontal', 
      legend:'none', 
      isStacked: true 

     }; 

     var chart = new google.visualization.BarChart(document.getElementById('function')); 

     chart.draw(view,options); 

    }