javascript - 颜色变化 - Google 柱形图 Material

Question

我正在尝试在我的网站中使用谷歌图表“columnchart_material”。图表显示正常，但我无法更改条形的颜色。我希望第一个条形为特定颜色，第二个条形为另一种颜色。

这是我的代码。我希望你能帮我找出问题所在。感谢您的帮助。

<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript">
  google.charts.load('current', {'packages':['bar']});
  google.charts.setOnLoadCallback(drawChart);
  function drawChart() {
    var data = google.visualization.arrayToDataTable([
      ['', 'Ville', {role: 'style'}, 'Departement', {role: 'style'} ],
      ['Taxe d\'habitation',22, 'color: #A63950', 24, 'color: #39A68F', ],
      ['Taxe foncière sur le bati',24,  'color: #A63950', 21,  'color: #39A68F',],
      ['Taxe foncière non-bati', 36,  'color: #A63950', 18, 'color: #39A68F',]
    ]);

    var options = {
      chart: {
        title: 'Taxes communales',
      }

    };




    var chart = new google.charts.Bar(document.getElementById('columnchart_material'));

    chart.draw(data, options);
  }
</script>
<div id="columnchart_material"></div>

Answer 1

我没有发现您的代码有任何问题，只需确保您已正确加载模块即可，

 var chart = new google.charts.Bar(document.getElementById('columnchart_material'));  
        chart.draw(data, google.charts.Bar.convertOptions(options));
      }

DEMO