Google Visualization - 列图表间隔问题（重复间隔）

Question

我使用以下代码生成上述Google图表：

var data = google.visualization.arrayToDataTable([
['Date', 'Tickets'],
['11/05/15',1],
['10/05/15',0],
['09/05/15',0],
['08/05/15',0],
['07/05/15',0],
['06/05/15',0],
['05/05/15',0],
['04/05/15',0],
]);

var columnChartOptions = {
title: "",
legend: { position: 'none' },
width: '100%',
height: '100%',
colors: ["#27ae60", "#2980b9", "#e67e22", "#e74c3c", "#e74c3c"],
chartArea: { left: '8%', top: '8%', width: "85%", height: "70%" },

vAxis: {
minValue: 1,
format:'#'
},

new google.visualization.ColumnChart(document.getElementById('ticket-history-graph')).
draw(data,columnChartOptions);

然而，它产生以下错误的间隔计数：

我需要对vAxis定义进行哪些更改才能更正此问题？我尝试过不同的最小值和最大值无济于事。我还必须补充一点，当使用更高的数字时，这不是一个问题，它只有较低的数量。

Answer 1

你的问题是format:'#'，这就是为什么你得到两个零和三个（因为你舍入到零小数，并且图形试图呈现值[0,0.25,0.5,0.75， 1]舍入为[0,0,1,1,1]，因此重复它们。）

我的建议是您查看属性vAxis.gridlines.count documentation。

我做了一个小提琴，我检查图中的maxValue是1还是2，如果是，我将网格线指定为2或3的计数，如果它不是1或2，它使用谷歌自己的自动生成。 检查并查看您是否遵循了我的工作方式：jsfiddle
请记住尝试将某些值更改为更高/更低，以查看其工作原理。

//Get all distinct ticketsales, sorted ascending by default, so you have to get the last value to get the highest one.
    var maxValue = data.getDistinctValues(1)[data.getDistinctValues(1).length - 1]

    // Specify gridCount to null, so if it doesn't enter any of the if's below, it will still be null
    var gridCount = null

    //check if the highest value is 1 or 2 else leave gridCount to null
    if (maxValue == 1) {
        gridCount = 2
    }
    if (maxValue == 2) {
        gridCount = 3
    }

以及columnChartOptions的添加：

 vAxis: {
            gridlines: {
                //specify the amount of gridlines to var gridCount, if it's still specified as null, it will use googles automatic generation.
                count: gridCount
            },