谷歌条形图条形颜色不变

Question

我正在使用谷歌条形图将一组问题表示为不同类别，例如打开、关闭、进行中等，我正在获取不同类别的计数并将其存储到哈希图中，然后检索数据从 hashmap 并使用下面的代码将其显示在条形图中。

下面编辑的是我正在使用的代码。我已经将它包含在一个jsp页面中

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

      function drawBarChart() {
        var data = google.visualization.arrayToDataTable([
           ['Status', 'No. of Issues', { role: 'style' }], 
          <%for(String SC:StatusCount.keySet()){
            %>
            ['<%=SC.toString()%>',<%=StatusCount.get(SC.toString())%>, 'blue'],
            <%  
            }
            %>
            <%for(String EC:EscCount.keySet()){
                %>
                ['<%=EC.toString()%>',<%=EscCount.get(EC.toString())%>, 'red' ],
                <%  
            }
            %>
        ]);

        var options = {
          chart: {
            title: 'Performance',
          },
          is3D: true,
          titleTextStyle: {
              fontName: 'Arial',
              fontSize: 20
          },

          'width':550,
          'height':400,
          backgroundColor: 'transparent',
          bars: 'vertical' // Required for Material Bar Charts.
        };

        var barchart = new google.charts.Bar(document.getElementById('barchart_material'));

        barchart.draw(data, google.charts.Bar.convertOptions(options));
      }

StatusCount 用于状态计数，EscCount 用于升级次数。我想更改升级栏的颜色。但是当我指定颜色时，它并没有改变。使用与谷歌本身相同的东西来改变颜色。 请帮忙。提前致谢

Answer 1

Column Roles，包括'style'，只支持Classic图表...

经典 --> google.visualization.BarChart & ColumnChart --> packages: ['corechart']

材质 --> google.charts.Bar --> packages: ['bar']

请参阅以下工作 sn-p...

google.charts.load('current', {
  callback: drawChart,
  packages: ['corechart']
});

function drawChart() {
  var data = google.visualization.arrayToDataTable([
    ['Status', 'No. of Issues', { role: 'style' }],
    ['Closed',14, 'blue'],
    ['On Hold',8, 'blue'],
    ['In Progress',20, 'blue'],
    ['Open',24, 'blue'],
    ['Escalations',4, 'red'],
  ]);

  var chart = new google.visualization.BarChart(
    document.getElementById('chart_div')
  );
  chart.draw(data, {
    theme: 'material'
  });
}

<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart_div"></div>