如何在Google图表中创建自定义hAxis标签？

Question

我使用Google Charts作为简单的区域图表。我有很多要画的点，我想设置它们之间的间隔。目前有一个列表1,2,3,4,5,6,7等

我想显示所有的点，但定制hAxis标签，如：0 5 10 15 20等

的代码是：

<script type="text/javascript"> 
    google.load("visualization", "1", {packages:["corechart"]}); 
    google.setOnLoadCallback(drawChart); 
    function drawChart() { 

     var data = google.visualization.arrayToDataTable([ 
      ['Day', 'Visit', 'Applic.'], 
      ['1', 19, 1], 
      ['2', 100, 9], 
      ['3', 103, 18], 
      ['4', 42, 8], 
      ['5', 34, 2], 
      ['6', 63, 9], 
      ['7', 35, 7], 
      ['8', 427, 51], 
      ['9', 314, 38], 
      ['10', 71, 4], 
      ['11', 27, 0], 
      ['12', 25, 0], 
      ['13', 78, 0], 
      ['14', 54, 0], 
      ['15', 60, 0], 
      ['16', 47, 0], 
      ['17', 29, 0], 
      ['18', 16, 0], 
      ['19', 10, 0], 
      ['20', 26, 0], 
      ['21', 200, 0], 
      ['22', 255, 0], 
      ['23', 160, 0], 
      ['24', 30, 0], 
      ['25', 35, 0], 
      ['26', 9, 0], 
     ]); 

     var options = { 
      vAxis: {minValue: 0}, 

      hAxis: { 
       title: 'Days',    
      },       
      pointSize: 8, 
      colors: ['#9EC653', '#475825'], 
      chartArea: { 
       left: 40, 
       top: 40, 
       width: 600, 
       height: 250 
      }, 
      legend: {position: 'top', textStyle: {fontSize: 14}, alignment: 'center'}, 
      backgroundColor: '#f7f6f4',    
     }; 

     var chart = new google.visualization.AreaChart(document.getElementById('visits')); 
     chart.draw(data, options); 
    } 
</script> 

，其结果是：

水平标签代表所有的点，我需要所有的人，但笑机翼特定的水平标签。我如何设置特定的时间间隔？

感谢

Answer 1

这将是容易得多，如果你输入轴值作为数字而不是字符串来实现：

var data = google.visualization.arrayToDataTable([ 
    ['Day', 'Visit', 'Applic.'], 
    [1, 19, 1], 
    [2, 100, 9], 
    [3, 103, 18], 
    [4, 42, 8], 
    [5, 34, 2], 
    [6, 63, 9], 
    [7, 35, 7], 
    [8, 427, 51], 
    [9, 314, 38], 
    [10, 71, 4], 
    [11, 27, 0], 
    [12, 25, 0], 
    [13, 78, 0], 
    [14, 54, 0], 
    [15, 60, 0], 
    [16, 47, 0], 
    [17, 29, 0], 
    [18, 16, 0], 
    [19, 10, 0], 
    [20, 26, 0], 
    [21, 200, 0], 
    [22, 255, 0], 
    [23, 160, 0], 
    [24, 30, 0], 
    [25, 35, 0], 
    [26, 9, 0] 
]); 

然后，您可以指定hAxis.ticks选项告诉图表其值应为标记在轴上：

hAxis: { 
    title: 'Days', 
    ticks: [0, 5, 10, 15, 25] 
}