2015-10-29 252 views
1

我想將此常規條形圖轉換爲堆積柱形圖。我一直玩JSfiddle一段時間,只是無法得到它。堆積條形圖 - >堆積柱形圖

我假設我的問題很小,但我無法識別它。任何幫助,將不勝感激。謝謝!

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


google.load('visualization', '1', {packages: ['corechart', 'bar']}); 
google.setOnLoadCallback(drawBasic); 

function drawBasic() { 

var data = google.visualization.arrayToDataTable([ 
     ['Method', 'Box Office', 'Call Center', 'Group Sales', 'Subscription', 
     'Web', { role: 'annotation' } ], 
['Day 0', 960, 146, 0, 0, 406, ''], 
['Day 1', 690, 191, 25, 4, 457, ''], 
['Day 2', 189, 191, 35, 4, 443, ''], 
['Day 3', 185, 138, 14, 3, 443, ''], 
['Day 4', 130, 135, 21, 3, 416, ''], 
['Day 5', 181, 216, 22, 9, 659, ''], 
    */ 

     ]); 

     var options = { 
     width: '100%', 
     height: 500, 
     legend: { position: 'top', maxLines: 3 }, 
     bar: { groupWidth: '75%' }, 
     isStacked: 'percent' 
     }; 

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

     chart.draw(data, options); 
    } 

回答

0

這是您的圖表的工作版本。

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

function drawChart() { 
    var data =google.visualization.arrayToDataTable([ 
     ['Method', 'Box Office', 'Call Center', 'Group Sales', 'Subscription', 
     'Web', { role: 'annotation' } ], 
['Day 0', 960, 146, 0, 0, 406, ''], 
['Day 1', 690, 191, 25, 4, 457, ''], 
['Day 2', 189, 191, 35, 4, 443, ''], 
['Day 3', 185, 138, 14, 3, 443, ''], 
['Day 4', 130, 135, 21, 3, 416, ''], 
['Day 5', 181, 216, 22, 9, 659, ''] 
     ]); 
    var options = { 
     width: 600, 
     height: 400, 
     isStacked: true, 
     legend: { position: 'top', maxLines: 3 }, 

     seriesType: "bars", 
     }; 

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

     chart.draw(data, options); 
} 

http://jsfiddle.net/n53tqsnw/

您在調用與google.visualization.BarChart圖表應該是google.visualization犯錯誤。 ComboChart

希望這會幫助你。

+0

感謝您回答我的問題 - 它的工作原理! –