谷歌柱形图与平均线

时间:2015-01-20 15:56:20

标签: jquery charts

所以现在我有这个柱状图看起来很好,但问题是,这些条都是相同的颜色。

现在我知道如何解决这个问题,但接下来是我的"平均值" line只有一个点,因为它只能获得一个值。

而不是在“国家/地区”下添加,我可以更改“国家/地区”。进入所有国家名称。但是平均值只有一个值:26.89 ......

有没有办法保持平均线条,同时条形图有不同的颜色?

function drawVisualization() {
  // Some raw data (not necessarily accurate)
  var data = google.visualization.arrayToDataTable([
    ['Countries', 'Country Average', 'Average from all countries'],
    ['Ghana',  24.9,      26.896875],
    ['Nigeria',  25.3,      26.896875],
    ['Belgium',  25.5,       26.896875],
    ['Switzerland',  25.6,      26.896875],
    ['South-Korea',  25.7,      26.896875],
    ['Australia',  25.8,      26.896875],
    ['Germany',  25.9,      26.896875],
    ['Netherlands',  26,      26.896875],
    ['England',  26.1,      26.896875],
    ['Cameroon',  26.2,      26.896875],
    ['Algeria',  26.2,      26.896875],
    ['Bosnia & Herzegovina',  26.2,      26.896875],
    ['France',  26.6,      26.896875],
    ['Croatia',  26.7,      26.896875],
    ['Mexico',  26.8,      26.896875],
    ['Japan',  26.8,      26.896875],
    ['Costa Rica',  26.9,      26.896875],
    ['Ecuador',  27.1,      26.896875],
    ['USA',  27.3,      26.896875],
    ['Italy',  27.3,      26.896875],
    ['Ivory Coast',  27.4,      26.896875],
    ['Colombia',  27.4,      26.896875],
    ['Russia',  27.4,      26.896875],
    ['Chile',  27.6,      26.896875],
    ['Brasil',  27.8,      26.896875],
    ['Spain',  27.8,      26.896875],
    ['Iran',  28,      26.896875],
    ['Greece',  28.1,      26.896875],
    ['Honduras',  28.1,      26.896875],
    ['Uruguay',  28.1,      26.896875],
    ['Portugal',  28.2,      26.896875],
    ['Argentina',  28.5,      26.896875],
  ]);

  var options = {
    title : 'Age Average Round of Group Stage',
    vAxis: {title: "Age Average (starting at 22)" ,minValue: 22, maxValue: 29.0},
    hAxis: {title: "Countries"},
    seriesType: "bars",
    backgroundColor: { fill: "none" },
    colors: ['#009b3a', '#ff9700'],
    series: {1: {type: "line"}}
  };

  var chart = new google.visualization.ComboChart(document.getElementById('curve_chart'));
  chart.draw(data, options);
}

0 个答案:

没有答案