在谷歌折线图中设置两个坐标轴的间隔

Question

我正在使用谷歌折线图（材质），并且想要以固定间隔（增量为1）指定Y轴和X轴。参照该图，我希望我的Y轴值为1,2,3。我无法弄清楚为图表设置什么选项。欣赏任何帮助 - 由于

Answer 1

我觉得材料LineCharts还不支持蜱。在上的jsfiddle this例如

chart.draw(data, google.charts.Line.convertOptions(options)); 

像：

var options = { 
    vAxis: { 
     viewWindow: { 
       max: 5 
      }, 
    ... 

，并呼吁convertOptions：vAxis并与变化值最大尝试 - 但你可以尝试选择插入。

Answer 2

首先，在Material Charts仍处于测试和材料图表还不支持很多由 corecharts支持的选项。

关于明确设置ticks选项，看起来好像它是而不是支持。如果你想在材料样式（至少在字体和颜色）与corecharts，你可以补充一点：

option: { theme: 'material' } 

例

google.load('visualization', '1.1', {packages: ['corechart']}); 
 
    google.setOnLoadCallback(drawChart); 
 

 
    function drawChart() { 
 

 
     var data = new google.visualization.DataTable(); 
 
     data.addColumn('number', 'Day'); 
 
     data.addColumn('number', 'Guardians of the Galaxy'); 
 

 
     data.addRows([ 
 
     [1, 7.8], 
 
     [2, 3.9], 
 
     [3, 2.4], 
 
     [4, 1.7], 
 
     [5, 1.9], 
 
     [6, 8.8], 
 
     [7, 7.6], 
 
     [8, 2.3], 
 
     [9, 6.9], 
 
     [10, 2.8], 
 
     [11, 5.3], 
 
     [12, 6.6], 
 
     [13, 4.8], 
 
     [14, 4.2] 
 
     ]); 
 

 
     var options = { 
 
     title: 'Box Office Earnings in First Two Weeks of Opening', 
 
     width: 900, 
 
     height: 500, 
 
     vAxis: { 
 
       viewWindow: { 
 
        min: 0, 
 
        max: 10 
 
       }, 
 
       ticks: [0,1,2,3,4,5,6,7,8,9,10] 
 
     }, 
 
     hAxis: { 
 
       viewWindow: { 
 
        min: 1, 
 
        max: 14 
 
       }, 
 
       ticks: [1,2,3,4,5,6,7,8,9,10,11,12,13,14] 
 
     }, 
 
     theme: 'material' 
 
     }; 
 

 
     var chart = new google.visualization.LineChart(document.getElementById('linechart_material')); 
 
     chart.draw(data, options); 
 
    }

<script type="text/javascript" src="https://www.google.com/jsapi"></script> 
 
<div id="linechart_material"></div>