如果值很小,则不显示列 - Google Column Chart

时间:2016-08-03 14:09:42

标签: graph charts google-visualization

我的值如下所示,谷歌列图表:

var data = google.visualization.arrayToDataTable([
 ['Year', 'Austria'],
 ['2003',  4000],
 ['2004',  1538156],
 ['2005',  1576579],
 ['2006',  1600652],
 ['2007',  19681137],
 ['2008',  1901067]
]);

我的图表显示如下图所示:

enter image description here

我需要在图表中正确显示4000个值。

2 个答案:

答案 0 :(得分:1)

使用сonfiguration选项/path/to/cssFile.css

答案 1 :(得分:1)

问题是2003年的专栏与其他专栏相比是

当vAxis从零开始时,轴线和列的高度相同 所以该列不显示

您可以使用getColumnRange来设置vAxis.viewWindow

这将显示条子(列),而不是轴线

请参阅以下工作代码段...

google.charts.load('current', {
  callback: function () {
    var data = google.visualization.arrayToDataTable([
      ['Year', 'Austria'],
      ['2003',  4000],
      ['2004',  1538156],
      ['2005',  1576579],
      ['2006',  1600652],
      ['2007',  19681137],
      ['2008',  1901067]
    ]);

    var columnRange = data.getColumnRange(1);

    var options = {
      hAxis: {
        title: 'Cups',
      },
      height: 600,
      title: 'Yearly Coffee Consumption by Country',
      vAxis: {
        title: 'Year',
        viewWindow: {
          min: columnRange.min
        }
      }
    };

    var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
    chart.draw(data, options);
  },
  packages: ['corechart']
});
<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart_div"></div>