javascript - Highcharts:堆叠条形图内部的条形图

标签 javascript highcharts bar-chart

我想创建一个图表,在堆叠条形图内有一个条形图,如下图所示。 Chart

我设法将列放在列内,但是我无法让它在栏中工作。如何将条形图放入堆叠条形图内?

My code - JsFiddle

var chart = new Highcharts.Chart({
    chart: {
        renderTo:'container',
    },
    title: {
        text: 'Test %'
    },
    xAxis: {
        categories: ['2014', '2013', '2012', '2011']
    },
    yAxis: {
        opposite: true,
        labels: {
            format: '{value}%',
        },
    },
    plotOptions: {
        series: {
            stacking: 'normal'
        },
        column: {
            stacking: 'percent'
        }
    },
    legend: {
        enabled: false
    },
    series: [{
        name: 'red',
        type: 'bar',
        data: [70, 70, 70, 70],
        color: 'rgba(253, 155, 155, 1)',
        pointPadding: 0.1,
        pointPlacement: -0.2,
        stack: 'bar'
    }, {
        name: 'yellow',
        type: 'bar',
        data: [5, 5, 5, 5],
        color: 'rgba(255, 255, 153, 1)',
        pointPadding: 0.1,
        pointPlacement: -0.2,
        stack: 'bar'
    }, {
        name: 'green',
        type: 'bar',
        data: [25, 25, 25, 25],
        color: 'rgba(204, 255, 153, 1)',
        pointPadding: 0.1,
        pointPlacement: -0.2,
        stack: 'bar'
    }, {
        name: 'Value',
        type: 'bar',
        data: [35, 30, 25, 20],
        color: 'rgba(126,86,134,.9)',
        pointPadding: 0.35,
        pointPlacement: -0.2,
        dataLabels: {
            enabled: true,
            format: '{y}%'
        },
    }]
});

感谢任何帮助。

最佳答案

您可以将分组设置为 false,这样所有堆栈将彼此重叠 - 彼此重叠。

示例:http://jsfiddle.net/zs6juetp/2/

plotOptions: {
    series: {
        grouping: false
        ...

API 引用:plotOptions.bar.grouping

关于javascript - Highcharts:堆叠条形图内部的条形图,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32326337/

相关文章:

javascript - 当输入框位于模式内时,HTML ajax 标签不显示

使用 HTML 类目标的 Javascript 事件 - 1 Me - 0

css - Highcharts stylemode 和 colorByPoint

javascript - 在下载之前捕获 Highcharts 客户端导出响应

javascript - HighCharts:饼图切片需要背景图片

graph - SAS 条形图测量不同变量的百分比(一个变量在 y 轴上测量,另一个通过条内的阴影显示)

date - d3 堆叠到分组条形图日期轴

javascript - slider 和灯箱 - Javascript 冲突

javascript - 如何从 Tr 重复的输入文本中获取值?

r - R中带有误差线的分组条形图