如何更改条形图颜色(谷歌图表可视化)



我在更改此列图表颜色时遇到问题。现在它显示的是默认的蓝色,而不是青色。

现场直播:http://leighmckenzie.com/ballet-analysis/#when

  google.load("visualization", "1.1", {packages:["bar"]});
  google.setOnLoadCallback(drawStuff);
  function drawStuff() {
    var data = new google.visualization.arrayToDataTable([
      ['Day of the Week', 'Number of Orders'],
      ["Monday", 5458],
      ["Tuesday", 4006],
      ["Wednesday", 3686],
      ["Thursday", 3675],
      ["Friday", 4006],
      ["Saturday", 3379],
      ["Sunday", 3395],
    ]);
    var options = {
      series: { 0: {color: '#00ada2'} },
      width: 300,
      height: 380,
      legend: { position: 'none' },
      bar: { groupWidth: "80%" }
    };
    var chart = new google.charts.Bar(document.getElementById('orders-during-week'));
    // Convert the Classic options to Material options.
    chart.draw(data, google.charts.Bar.convertOptions(options));
  };

您可以指定与系列数组匹配的颜色数组。

google.load("visualization", "1.1", {packages:["bar"]});

google.setOnLoadCallback(drawStuff);
  function drawStuff() {
    var data = new google.visualization.arrayToDataTable([
      ['Day of the Week', 'Number of Orders'],
      ["Monday", 5458],
      ["Tuesday", 4006],
      ["Wednesday", 3686],
      ["Thursday", 3675],
      ["Friday", 4006],
      ["Saturday", 3379],
      ["Sunday", 3395],
    ]);
    var options = {
      width: 300,
      height: 380,
      legend: { position: 'none' },
      bar: { groupWidth: "80%" },
      colors: ['#00ada2']
    };
    var chart = new google.charts.Bar(document.getElementById('chart'));
    // Convert the Classic options to Material options.
    chart.draw(data, google.charts.Bar.convertOptions(options));
  };

最新更新