如何在谷歌图表中显示水平和垂直网格线

Question

  google.setOnLoadCallback(drawChart);

  function drawChart() {
      var data = google.visualization.arrayToDataTable([
          ['Year', 'Sales', 'Expenses'],
          ['2004', 1000, 400],
          ['2005', 1170, 460],
          ['2006', 660, 1120],
          ['2007', 1030, 540]
      ]);

      var options = {
          title: 'Company Performance',
      };

      var chart = new google.visualization.LineChart(document.getElementById('chart_div'));

      chart.draw(data, options);
  }

这段代码只显示了水平网格线，我希望还能显示垂直的线。

- SuRu

Answer 1

请查看这些文档中的vAxis.gridlines和hAxis.gridlines。 vAxis.gridlines是一个对象，具有配置垂直轴上网格线的属性。要指定此对象的属性，可以使用对象字面量表示法，如下所示：

 {color: '#333', count: 4}

您可以在垂直网格线选项中使用以下内容：

vAxis.gridlines: {color: '#333', count: 4}

编辑： 请查看以下示例：
http://jsfiddle.net/rdesai/R4DGp/2/
http://jsfiddle.net/8eCSW/1/

希望这可以帮到你。 :)

- Rahul Desai

---

请您添加一个完整的示例。 - SuRu

@DeveloperSuRu 这个回答对您也许有帮助：https://dev59.com/qGzXa4cB1Zd3GeqPYuTv#14274651 - Rahul Desai

如果我们使用LineChart而不是CoreChart，则不会显示垂直网格线。 - SuRu

@DeveloperSuRu，我们到底在哪里使用corechart呢？你能否创建一个fiddle来展示你的图表，这样我可以更好地帮助你？ - Rahul Desai

这是代码链接：http://jsfiddle.net/qsaehvje/3/ 请帮我为这个图表绘制垂直线。 - SuRu