Google圖表-Y軸刻度

Question

我在Web應用程序中使用“ 材料”柱形圖 。

我已經跟進了

和代碼在下面，

google.charts.load('current', {'packages':['bar']});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
   var data = google.visualization.arrayToDataTable([
              ['Structure', 'Estimated', 'Actual'],
              ['hours', 6, 8],
              ['hours2', 20, 18],                              
            ]);

            var options = {
              chart: {
                title: 'Structures by Hours',
                subtitle: 'Estimated vs Actual',
              }
            };

            var chart = new google.charts.Bar(document.getElementById('columnchart_hours'));

            chart.draw(data, options);

我想做兩件事/需要您的幫助 （在紅色圓圈處的圖像）。

1. 將Y軸命名為小時
2. 並以2個小時乘2個小時來設置相同的軸刻度，以使Y軸/小時軸變為2、4、6、8、10等。

提前致謝，

Answer 1

需要為vAxis設置配置選項 。

    vAxis: {
        title: 'Hours',
        ticks: [0, 2, 4, 6, 8, 10, 12, 14, 16, 18, 20]
    }

1. 使用title作為軸標簽。
2. 提供一個數組來ticks的軸的刻度線。

但是，對於材料圖，似乎沒有ticks 。
請注意，選項也必須轉換。
google.charts.Bar.convertOptions

該示例同時顯示了核心圖和材料圖...

 google.load('visualization', '1', { packages: ['corechart', 'bar'], callback: drawBarChart }); function drawBarChart() { var data = google.visualization.arrayToDataTable([ ['Structure', 'Estimated', 'Actual'], ['hours', 6, 8], ['hours2', 20, 18], ]); var options = { chart: { title: 'Structures by Hours', subtitle: 'Estimated vs Actual', }, vAxis: { title: 'Hours', ticks: [0, 2, 4, 6, 8, 10, 12, 14, 16, 18, 20] } }; var chart = new google.visualization.ColumnChart(document.getElementById('columnchart_hours')); chart.draw(data, options); var chart2 = new google.charts.Bar(document.getElementById('columnchart_hours2')); chart2.draw(data, google.charts.Bar.convertOptions(options)); } 

 <script src="https://www.google.com/jsapi"></script> <div id="columnchart_hours"></div> <div id="columnchart_hours2"></div>