2017-08-27 59 views
0

對不起。我只會說很少的英語。如何呈現從專欄到柱和餅的高圖(每個分類)

Fiddle

HTML:

<script src="https://code.highcharts.com/highcharts.js"></script> 
<script src="https://code.highcharts.com/modules/exporting.js"></script> 

<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div> 

的Javascript:

Highcharts.chart('container', { 

    chart: { 
     type: 'column' 
    }, 

    title: { 
     text: 'Total Work' 
    }, 

    xAxis: { 
     categories: ['2013', '2014', '2015', '2016', '2017'] 
    }, 

    yAxis: { 
     allowDecimals: false, 
     min: 0, 
     title: { 
      text: 'Number of fruits' 
     } 
    }, 

    tooltip: { 
     formatter: function() { 
      return '<b>' + this.x + '</b><br/>' + 
       this.series.name + ': ' + this.y + '<br/>' + 
       'Total: ' + this.point.stackTotal; 
     } 
    }, 

    plotOptions: { 
     column: { 
      stacking: 'normal' 
     } 
    }, 

    series: [{ 
     name: 'B1', 
     data: [5, 3, 4, 7, 2], 
     stack: 'male' 
    }, { 
     name: 'B2', 
     data: [3, 4, 4, 2, 5], 
     stack: 'male' 
    }, { 
     name: 'B3', 
     data: [2, 5, 6, 2, 1], 
     stack: 'female' 
    }, { 
     name: 'B4', 
     data: [3, 0, 4, 4, 3], 
     stack: 'gay' 
    }] 
}); 

我想B1,B2列和轉換B3,B4每個產品類別餡餅。

喜歡這幅畫: enter image description here

感謝所有方向

回答