Javascript Highcharts-从顶部定位柱形图

我有一个Highcharts柱形图，试图用一个柱来显示某件事情的完成，并沿着x轴在相邻的柱中下降

以下是JSFIDLE：

蓝色列是原始值，而每个蓝色列之间的橙色列是衰减（与前一列的差异）。现在，我通过堆叠两列（stack:'drop-off'）并使底部透明，完成了类似于黑客的设置

有没有更干净的解决办法？我能不能简单地从顶部定位橙色列

---

谢谢

您可以随时将您的下车系列设置为

columnrange

类型

     series: [
        {
            data: [300, 150, 85, 75, 35],
            pointWidth: 60,
            dataLabels: {
                enabled: true,
                rotation: 90,
                color: 'white',
                align: 'right',
                inside: true,
                x:-10,
                style: {
                    fontSize: '25px',
                }
            }
        },
        {
            type: 'columnrange',
            data: [[0.5,150,300],[1.5,85,150],[2.5,75,85],[3.5,35,75]],
            color: '#ff8546',
            pointWidth: 20,
            groupPadding: -0.2
        }
    ]

请参阅更新小提琴

     series: [
        {
            data: [300, 150, 85, 75, 35],
            pointWidth: 60,
            dataLabels: {
                enabled: true,
                rotation: 90,
                color: 'white',
                align: 'right',
                inside: true,
                x:-10,
                style: {
                    fontSize: '25px',
                }
            }
        },
        {
            type: 'columnrange',
            data: [[0.5,150,300],[1.5,85,150],[2.5,75,85],[3.5,35,75]],
            color: '#ff8546',
            pointWidth: 20,
            groupPadding: -0.2
        }
    ]