2016-12-19 12 views
1

私の問題は、Google Charts APIを使った積み重ねられた縦棒グラフについてです。Google Charts - Stacked Column Chartのトレンドライン

私はそれからグローバルなトレンドラインを取得しようとしています。

<script type="text/javascript"> 
google.charts.load("current", {"packages":["corechart"]}); 
google.charts.setOnLoadCallback(drawVisualization); 
function drawVisualization() { 
var data = google.visualization.arrayToDataTable([['Month', 'OK', 'KO', 'Estimation'],[ '2016/08', 1990, 49, null ],[ '2016/09', 6892, 97, null ],[ '2016/10', 6018, 0, null ],[ '2016/11', 7329, 146, null ],[ '2016/12', 3059, 97, 1827 ]]); 
var options = { 
    isStacked: true, 
    seriesType: "bars", 
    legend: "none", 
    hAxis:{ textPosition: "none" }, 
    vAxis: { viewWindow: { min: 0, max: 8000 } }, 
    trendlines: { 0: {} } 
}; 
var chart = new google.visualization.ComboChart(document.getElementById("bar")); 
chart.draw(data, options); 
} 
</script> 

trendlines: { 0: {} },を追加しても結果は得られません。

リファレンスガイドには何も見つかりませんでした。多分実装されていないか、それとも間違っていますか?ドキュメントに記載されていないが

答えて

1

trendlinesのみ連続 x軸

に支持され、これは...日付、番号、等であるべきである最初の列の値を意味

文字列値はdiscrete vs continuous ...

SEを参照してください

離散につながります作業スニペット次の電子...

最初の列は

google.charts.load('current', { 
 
    callback: function() { 
 
    var data = google.visualization.arrayToDataTable([ 
 
     ['Month', 'OK', 'KO', 'Estimation'], 
 
     ['2016/08', 1990, 49, null], 
 
     ['2016/09', 6892, 97, null], 
 
     ['2016/10', 6018, 0, null], 
 
     ['2016/11', 7329, 146, null], 
 
     ['2016/12', 3059, 97, 1827] 
 
    ]); 
 

 
    var view = new google.visualization.DataView(data); 
 
    view.setColumns([{ 
 
     calc: function (dt, row) { 
 
     var dateParts = dt.getValue(row, 0).split('/'); 
 
     return new Date(parseInt(dateParts[0]), parseInt(dateParts[1]) - 1, 1); 
 
     }, 
 
     type: 'date', 
 
     label: data.getColumnLabel(0) 
 
    }, 1, 2, 3]); 
 

 
    var options = { 
 
     isStacked: true, 
 
     seriesType: 'bars', 
 
     legend: 'none', 
 
     hAxis: { 
 
     textPosition: 'none' 
 
     }, 
 
     vAxis: { 
 
     viewWindow: { 
 
      min: 0, 
 
      max: 8000 
 
     } 
 
     }, 
 
     trendlines: { 
 
     0: {} 
 
     } 
 
    }; 
 

 
    var chart = new google.visualization.ComboChart(document.getElementById('bar')); 
 
    chart.draw(view, options); 
 
    }, 
 
    packages:['corechart'] 
 
});
<script src="https://www.gstatic.com/charts/loader.js"></script> 
 
<div id="bar"></div>

... trendlinesを可能にする、 DataViewを使用して実際の日付に変換されます。