javascript - 谷歌条形图条形颜色没有改变

Question

我使用谷歌条形图将一组问题表示为不同类别，例如打开、关闭、正在进行等，我获取不同类别的计数并将其存储到 HashMap 中，然后从 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' 仅受 经典 图表支持...

经典 --> google.visualization.BarChart 和 ColumnChart --> 包:['corechart']

Material --> google.charts.Bar --> 包:['bar']

请参阅以下工作片段...

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>