谷歌图表错误?轴不是从0开始

时间:2012-05-21 17:49:42

标签: google-visualization

以下示例来自Google,使用Google Charts创建ColumnChart

function drawVisualization() {
  // Create and populate the data table.
  var data = google.visualization.arrayToDataTable([
    ['Year', 'Austria', 'Belgium', 'Czech Republic', 'Finland', 'France', 'Germany'],
    ['2003', 1336060, 3817614, 974066, 1104797, 6651824, 15727003],
    ['2004', 1538156, 3968305, 928875, 1151983, 5940129, 17356071],
    ['2005', 1576579, 4063225, 1063414, 1156441, 5714009, 16716049],
    ['2006', 1600652, 4604684, 940478, 1167979, 6190532, 18542843],
    ['2007', 1968113, 4013653, 1037079, 1207029, 6420270, 19564053],
    ['2008', 1901067, 6792087, 1037327, 1284795, 6240921, 19830493]
  ]);

  // Create and draw the visualization.
  new google.visualization.ColumnChart(document.getElementById('visualization')).
  draw(data, {
    title: "Yearly Coffee Consumption by Country",
    width: 600,
    height: 400,
    hAxis: {
      title: "Year"
    }
  });
}

哪种方法很完美,但是,我每列只需要一个值,所以我将其更改为:

function drawVisualization() {
  // Create and populate the data table.
  var data = google.visualization.arrayToDataTable([
    ['Month', 'How many'],
    ['07', 193],
    ['08', 114],
    ['09', 158]
  ]);

  // Create and draw the visualization.
  new google.visualization.ColumnChart(document.getElementById('visualization')).
  draw(data, {
    title: "Yearly Coffee Consumption by Country",
    width: 600,
    height: 400,
    hAxis: {
      title: "Year"
    }
  });
}

现在垂直轴不是从0开始,而是接近最低值,在这种情况下是114 - 这是一个错误吗?我仍然希望它从0开始显示,因为它很快就会像这样令人困惑

有什么想法吗?

3 个答案:

答案 0 :(得分:45)

绘制图表时,您需要将另一个参数作为选项的一部分传递。

vAxis: {minValue: 0}

这会迫使纵轴从0开始,你可以在这里看到其他可能的选项:https://google-developers.appspot.com/chart/interactive/docs/gallery/columnchart#Configuration_Options

答案 1 :(得分:21)

如果您在图表vAxis: {minValue: 0}上没有数据,则无法提供帮助。因此,您可以使用配置选项viewWindow

var options = { 
    vAxis: { 
        viewWindow: {
            min:0
        }
    }
};
var chart = new google.visualization.ComboChart(document.getElementById('chart_div'));
chart.draw(dataTable, options);

答案 2 :(得分:0)

对于仍在寻找使轴从0开始的方式的任何人,您都可以尝试此选项。

vAxes: {
  0: {baseline: 0},
},

请注意,我使用vAxes而不是vAxis。我不知道为什么,但这可以解决问题。

我在这里得到答案:https://groups.google.com/forum/#!topic/google-visualization-api/vRNJUk9aZUI