2017-09-01 64 views
-1

我将使用高图来准备堆积柱状图报告。问题是我的数据类型是不同的。堆积组高图中的柱状图示例

Please, view image example

你能帮助我建立像图像的图表。请

+0

我张贴的答案,它应该为你工作。如果它适合你,那么接受它。 – TechnoCrat

+0

看看这个演示:http://jsfiddle.net/gup3mund/。希望能帮助到你。 –

+0

d_Paul,你的演示对我有用,谢谢你的帮助。真的你是一个很大的帮助 – osantander

回答

0

您可以通过正确处理数据部分,使用Highchart中的堆叠组来实现此目的。

在这里,我试图建立你所需要的相同的图表。您可以处理图例和其他图表。

这应该对你有所帮助。我还创建了小提琴演示,您可以使用下面的链接访问。

小提琴演示:http://jsfiddle.net/t4u8b8co/1/

Highcharts.chart('container', { 
 

 
    chart: { 
 
    type: 'column' 
 
    }, 
 

 
    title: { 
 
    text: '' 
 
    }, 
 
    
 
    legend: { 
 
    enabled: false 
 
    }, 
 

 
    xAxis: { 
 
    categories: [ 
 
     ['19603', '19666'], '19603', '19603' 
 
    ] 
 
    }, 
 

 
    yAxis: { 
 
    title: { 
 
     text: 'Good or Bad' 
 
    } 
 
    }, 
 

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

 
    series: [{ 
 
    name: 'Jane', 
 
    data: [244, 23, 4], 
 
    stack: '19603' 
 
    }, { 
 
    name: 'John', 
 
    data: [306, 522, 546], 
 
    stack: '19603' 
 
    }, { 
 
    name: 'Jane', 
 
    data: [376], 
 
    stack: 'female' 
 
    }, { 
 
    name: 'Janet', 
 
    data: [174], 
 
    stack: 'female' 
 
    }] 
 
});
<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>

+0

非常感谢你TechnoCrat,你的演示给我工作。 – osantander

+0

@osantander如果它适合你,然后接受并投票表决它。 – TechnoCrat