Highcharts柱形图

Question

我正在尝试使用Highcharts创建类似于下图所示的图表。很明显，第一列（100％）是所有其他列表的总和。我想到的方法是在每个单独的类别下面都有隐形系列，让它们看起来更加凸显。唯一让我难以忍受的是想到的情况，我可能不得不面对30多个类别（可能在我们的应用程序中）。有没有更简单的方法来实现相同的结果？

我无法直接发布图片，因为我是新用户。抱歉。

http://i.stack.imgur.com/RBWIf.png

Answer 1

我建议考虑看看“低”财产如下所示：

http://fiddle.jshell.net/8JP8T/

var chart = new Highcharts.Chart({ 

    chart: { 
     renderTo: 'container', 
     type: 'column' 
    }, 

    xAxis: { 
     categories: ['Jan', 'Feb', 'Mar', 'Apr'] 
    }, 

    series: [{ 
     data: [{ 
      low: 1, 
      y: 2 
     }, { 
      low: 2, 
      y: 4 
     }, { 
      low: 0, 
      y: 4 
     }, { 
      low: 4, 
      y: 5 
     }] 
    }] 

}); 

你还是要预处理数据以得到正确的y值和低价值，但它似乎可行？

Answer 2

对于柱形图，对于每个点可以指定y值和相应的low创建浮动列。

series: [{ 
    data: [ 
       {y: 29.9, low: 20}, 
       {y: 50, low: 20}, 
       {y: 100, low: 50} 
    ] 
}] 

See this example on jsfiddle。