6

使用 Highcharts,我想创建一个类似于这个的人口金字塔:

http://jsfiddle.net/gh/get/jquery/1.7.2/highslide-software/highcharts.com/tree/master/samples/highcharts/demo/bar-negative-stack/

但这会比较不同的地区。因此,不是每个年龄组和性别都有一个条形图,而是有 3 个条形图,每个代表一个不同的区域。

到目前为止我所拥有的是这个,但我不确定我是否朝着正确的方向前进。

http://jsfiddle.net/YCxgr/

如您所见,给定年龄类别和区域的条形图彼此不对齐:我想要的是使区域的条形图针对两种性别正确对齐,以便它们显示为 3 个条形图(每个区域一个) 而不是 6. 我怎样才能做到这一点?

4

2 回答 2

5

为你准备一个 jsFiddle 现在回答你的问题

   series: [{
    name: 'Region 1',
    zIndex: 1000,
    data: [[0, -3 ],[0,3],[1, -5] ,[1,5],[2, -4],[2,4],[3, -3],[3,3]]
},{
    name: 'Region 2',
    data: [[0, -4] ,[0,4],[1, -2],[1,2],[2, -6],[2,6],[3, -4],[3,4]]
},{
    name: 'Region 3',
    data:  [[0, -3],[0,3],[1, -5],[1,5],[2, -4],[2,4],[3, -3],[3,3]]
}]

工作的jsFiddle

于 2012-07-05T13:03:34.767 回答
1

当我今天查看示例时,只有原始的普通金字塔示例有效。另一个在结果窗格中没有显示任何内容。

我注意到缺少 highcharts 库引用,并且 jquery 版本在 1.4.2 上。

我通过添加引用修复了这两个问题:

<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>

并选择 jquery 1.7.2 版。现在他们(再次)显示金字塔。看:

  1. 原创海报的多柱金字塔尝试
  2. 修复了答案中的多列金字塔

我希望这可以帮助其他对示例感兴趣的人。

于 2014-02-12T13:36:19.257 回答