Google AreaChart不显示垂直网格线.

Question

首先,我检查了这些:

• 如何让Google Visulization LineChart显示垂直网格线？
• Google Chart:AreaChart vAxis网格线未绘制

而且他们似乎并不是我正在寻找的东西,所以希望这不是一个重复的问题.

我在将网格线添加到Google AreaChart垂直轴时遇到问题.我用过:

 vAxis: {
        minValue: 0,
        gridlines: {
            color: '#f3f3f3',
            count: 5
        }
    }

但它似乎没有工作,当我更改vAxis计数的值:它添加行到hAxis :(

见:http://jsfiddle.net/j29Pt/2/

谁能解决这个问题？

提前致谢 :)

Answer 1

您需要将x轴更改为连续数据类型(数字,日期,日期时间,时间)以获取垂直线.该hAxis.gridlines.count选项控制您获得的垂直网格线数量. vAxis.gridlines.count控制您获得的水平线数量.

在您的示例中,您可以将DataTable更改为:

var data = google.visualization.arrayToDataTable([
    ['Year', 'Sales', ],
    [2004, 1000],
    [2005, 1170],
    [2006, 660],
    [2007, 1030]
]);

以及你对此的选择:

var options = {
    title: '',
    hAxis: {
        title: 'Year',
        titleTextStyle: {
            color: '#333'
        },
        gridlines: {
            color: '#f3f3f3',
            count: 4
        },
        format: '####'
    },
    vAxis: {
        minValue: 0,
        gridlines: {
            color: '#f3f3f3',
            count: 5
        }
    }
};

参见示例:http://jsfiddle.net/asgallant/j29Pt/3/