title: Customizing Bar Chart using ng-google-chart
body: <p>I am using <a href="https://github.com/bouil/angular-google-chart" rel="nofollow">Angular google chart</a> (ng-google-chart) for drawing the graph.
  I drew the Bar graph using the sample provided in <a href="http://bouil.github.io/angular-google-chart/#/generic/ColumnChart" rel="nofollow">http://bouil.github.io/angular-google-chart/#/generic/ColumnChart</a>.</p>
  
  <p>I am able the draw the Bar Chart.
  But I would like to dynamically add the  colors to the Bar based on the values.
  I am not able to achieve this using <a href="https://github.com/bouil/angular-google-chart" rel="nofollow">https://github.com/bouil/angular-google-chart</a>.</p>
  
  <p>Below is my code sample :</p>
  
  <pre><code>$scope.arrVal2 = [22,31,90,50,80,25,15];
  $scope.chartObj1 = [];
  $scope.chartObj2 = [];
  
  $scope.createChartObj = function()
  {
  
      for(var m=0; m &lt; $scope.arrVal2.length; m++)
      {
          console.log('val of m ----- '+m);
          $scope.chartObj2.push({c:[{v:m+1},{v:$scope.arrVal2[m]}
              ]})
      }
  
  }
  
  $scope.chartObject2.data = {"cols": [
    {id: "day", label: "Day", type: "string"},
    {id: "events", label: "Event", type: "number"}
    ], "rows": $scope.chartObj2
  };
  
  
  $scope.chartObject2.type = 'ColumnChart';
  $scope.chartObject2.options = {
    'title': 'PREVIOUS 7 WEEKS',
    'titleTextStyle': {color: '#FFFFFF', fontSize: 13,bold: false},
    'backgroundColor': '#555555',
    legend: 'none',
    series: {
      0: { color: '#e2431e' },
      1: { color: '#e7711b' },
      2: { color: '#f1ca3a' },
      3: { color: '#6f9654' },
      4: { color: '#1c91c0' },
      5: { color: '#43459d' },
      6: { color: '#43459d' }
    },
    colors: ['#6EAF19', '#E2B400', '#DF0000','#DF0000','#DF0000','#DF0000','#DF0000'],
    is3D:true,
    animation:{
        duration: 3000,
        easing: 'out',
      },
      hAxis: { 
              gridlines: {color: 'transparent'},
              textPosition: 'none'
      },
      vAxis:{
          minValue:0,
          maxValue:100,
          baselineColor: 'none',
          gridlineColor: 'none',
          gridlines: {color: 'transparent'},
          textPosition: 'none'
   }
  }
  </code></pre>
  
  <p>Have tried adding using Series, tried adding colors: ['black','blue','white','blue','blue','blue','blue'] in options :( Only the first color in the series is getting applied.</p>
  
  <p>Can any one please help me in this.</p>
  
  <p>Thanks IN ADVANCE:)</p>