2016-10-02 145 views
1

除了我想为水平条形图(条形是水平的而不是垂直的)之外,我想要做与this question中描述的相同的事情。我将图像从这里复制的问题:将垂直线添加到堆叠的水平条形图

enter image description here

我想有类似这样与垂直线堆叠水平条形图。

ComboCharts似乎不支持水平条形图,所以我希望可能有另一种方式。

回答

1

使用orientation: 'vertical'使柱形图成为条形图

看到下面的工作片段将旋转轴...

google.charts.load('current', { 
 
    callback: function() { 
 
    var container = document.getElementById('chart_div'); 
 
    var chart = new google.visualization.ComboChart(container); 
 

 
    var data = google.visualization.arrayToDataTable([ 
 
     ['Genre', 'Fantasy & Sci Fi', 'Romance', 'Mystery/Crime', 'General', 'Western', 'Literature', 'Minimum', 'Maximum'], 
 
     ['2010', 10, 24, 20, 32, 18, 5, 90, 140], 
 
     ['2020', 16, 22, 23, 30, 16, 9, 90, 140], 
 
     ['2030', 28, 19, 29, 30, 12, 13, 90, 140] 
 
    ]); 
 

 
    var options = { 
 
     bar: { 
 
     groupWidth: '75%' 
 
     }, 
 
     height: 400, 
 
     isStacked: true, 
 
     legend: { 
 
     position: 'bottom' 
 
     }, 
 
     orientation: 'vertical', 
 
     series: { 
 
     6: { 
 
      color: '#000000', 
 
      type: 'line' 
 
     }, 
 
     7: { 
 
      color: '#000000', 
 
      type: 'line' 
 
     } 
 
     }, 
 
     seriesType: 'bars', 
 
     width: 600, 
 
    }; 
 

 
    chart.draw(data, options); 
 
    }, 
 
    packages: ['corechart'] 
 
});
<script src="https://www.gstatic.com/charts/loader.js"></script> 
 
<div id="chart_div"></div>

+0

谢谢,我可以结合,与在链接问题中回答以获得全宽线。 –

相关问题