如何在我的高图中添加另一个系列答案

【问题标题】：How to add another series into my highchart如何在我的高图中添加另一个系列
【发布时间】：2014-10-13 21:48:48
【问题描述】：

我有一个如下图所示的 Tornado 图表：此图表的基线为 29.5，它是 fiddle is here。

series:[{
    name: 'Low',
    grouping:false,
    type:'bar',        
    data:[
        {y:12.15-baseValue, label:10},
        {y:15.45-baseValue, label:1},
        {y:31.25-baseValue, label:2},
        {y:12.15-baseValue, color:'#99CCFF', label: ""},
    ],
    labels:[10,5,1,2,]
},{
    name: 'High',
    grouping:false,
    type:'bar',
            data:[
            {y:46.86-baseValue, label:30},
            {y:42.28-baseValue, label:3},
            {y:27.77-baseValue, label:4},
            {y:46.86-baseValue, color:'#99CCFF', label:""},
           ],
    labels:[30,10,3,4,]
},
{
    name: 'Median',
    type: 'scatter',
    data: [
            null,
            null,
            null,
            27-baseValue
           ],
    marker: {
        lineWidth: 2,
        lineColor: Highcharts.getOptions().colors[3],
        fillColor: 'white'
    }
}]

我正在尝试添加第二个 Tornado 的阴影图，其中基线可能不同。例如，在如下所示的样机中再考虑四个向右移动的条形：

我一直坚持这一点，因为阴影条仅显示相对于第一个图表的 baseValue (29.5)，而不是相对于第二个图表的 baseValue (39.5)。因此，如果我尝试将它们添加到现有系列中，它们只有在值方向相同时才会起作用（因为 value-baseValue 与原始数据具有相同的符号）。

为了说明，假设阴影图有以下数据：

年收入：25、39.5、55
年数：33、39.5、48
年费：35、39.5、48
组合不确定度：23,43,55

如何将其添加到上面小提琴中的代码中并使其看起来像样机？这是一个不起作用的modified fiddle。

series:[{
    name: 'Low',
    grouping:false,
    type:'bar',        
    data:[
        {y:12.15-baseValue, label:10},
        {y:25-baseValue, label:50},
        {y:15.45-baseValue, label:1},
        {y:33-baseValue, label:20},
        {y:31.25-baseValue, label:2},
        {y:48-baseValue, label:8},
        {y:12.15-baseValue, color:'#99CCFF', label: ""},
        {y:40-baseValue, color:'#99DDDD', label: ""}
    ],
    labels:[10,50,1,20,2,8]
},{
    name: 'High',
    grouping:false,
    type:'bar',
            data:[
            {y:46.86-baseValue, label:30},
            {y:55-baseValue, label:70},
            {y:42.28-baseValue, label:3},
            {y:48-baseValue, label:30},
            {y:27.77-baseValue, label:4},
            {y:35-baseValue, label:5},
            {y:46.86-baseValue, color:'#99CCFF', label:""},
            {y:80-baseValue, color:'#99DDDD', label: ""}
           ],
    labels:[30,70,3,30,4,5,]
},
{
    name: 'Median',
    type: 'scatter',
    data: [
            null,
            null,
            null,
            null,
            null,
            null,
            27-baseValue,
            60-baseValue
           ],
    marker: {
        lineWidth: 2,
        lineColor: Highcharts.getOptions().colors[3],
        fillColor: 'white'
    }
}]

问题在下图中进行了注释：

【问题讨论】：

标签： javascript charts highcharts

【解决方案1】：

如果您想将 0/origin 的点与系列的其余部分放在不同的位置 - 那么您应该使用不同的系列并添加隐藏的另一个水平轴（在您的代码中它将是 y 轴，因为由 bar 引起的反转图表）。要同步这些轴，您可以在轴上设置适当的最大值和最小值。示例：http://jsfiddle.net/frgo4Lun/3/

或你可以使用thresholdhttp://api.highcharts.com/highcharts#plotOptions.bar.threshold。示例：http://jsfiddle.net/frgo4Lun/4/

您还发布了带有刻度之间系列的图像。您可以将点的 x 位置设置为不舍入值，例如 1.5。示例：http://jsfiddle.net/frgo4Lun/5/

【讨论】：