haxis値の間に棒グラフを配置するには

Question

棒グラフがhaxis値の間にあるグラフをこのようにしたいと思います。

http://imgur.com/C5GF7Ay

私のコードは次のとおりです。

var data3 = google.visualization.arrayToDataTable([ 
    ['Month', 'Bolivia', 'Ecuador', 'Madagascar', 'Papua New Guinea', 'Rwanda', 'Average'], 
    ['2004/05', 165,  938,   522,    998,   450,  614.6], 
    ['2005/06', 135,  1120,  599,    1268,   288,  682], 
    ['2006/07', 157,  1167,  587,    807,   397,  623], 
    ['2007/08', 139,  1110,  615,    968,   215,  609.4], 
    ['2008/09', 136,  691,   629,    1026,   366,  569.6] 
    ]); 

    var options3 = { 
     title : 'Monthly Coffee Production by Country', 
     vAxis: {title: 'Cups'}, 
     hAxis: {title: 'Month'}, 
     seriesType: 'bars', 
     series: {5: {type: 'line'}} 
    }; 

Answer 1

あなたは以下を参照してください年

を表示のみにhAxis.formatとhAxis.ticksを使用し、その後の日付

でcontinuous axisを使用して試みることができます作業のスニペット...

google.charts.load('current', { 
 
    callback: function() { 
 
    var data = google.visualization.arrayToDataTable([ 
 
     ['Date', 'Bolivia', 'Ecuador', 'Madagascar', 'Papua New Guinea', 'Rwanda', 'Average'], 
 
     [new Date(2013, 0, 1), 165, 938, 522, 998, 450, 614.0], 
 
     [new Date(2013, 1, 1), 135, 940, 542, 990, 454, 614.1], 
 
     [new Date(2013, 2, 1), 157, 942, 562, 988, 458, 614.2], 
 
     [new Date(2013, 8, 1), 139, 944, 582, 980, 462, 614.3], 
 
     [new Date(2013, 9, 1), 136, 946, 652, 968, 466, 614.4], 
 
     [new Date(2014, 10, 1), 152, 938, 522, 998, 450, 614.0], 
 
     [new Date(2014, 11, 1), 164, 940, 542, 990, 454, 614.1], 
 
     [new Date(2015, 2, 1), 166, 942, 562, 988, 458, 614.2], 
 
     [new Date(2015, 3, 1), 158, 944, 582, 980, 462, 614.3], 
 
     [new Date(2015, 4, 1), 160, 946, 652, 968, 466, 614.4], 
 
    ]); 
 

 
    var options = { 
 
     title : 'Monthly Coffee Production by Country', 
 
     vAxis: {title: 'Cups'}, 
 
     hAxis: { 
 
     title: 'Year', 
 
     format: 'yyyy', 
 
     ticks: [ 
 
      new Date(2013, 0, 1), 
 
      new Date(2014, 0, 1), 
 
      new Date(2015, 0, 1), 
 
      new Date(2016, 0, 1) 
 
     ] 
 
     }, 
 
     bar: { 
 
     width: 100 
 
     }, 
 
     seriesType: 'bars', 
 
     series: {5: {type: 'line'}} 
 
    }; 
 

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

 
    chart.draw(data, options); 
 
    }, 
 
    packages:['corechart'] 
 
});

<script src="https://www.gstatic.com/charts/loader.js"></script> 
 
<div id="chart_div"></div>