highchart columnrange自定义颜色

来源:互联网 发布:上海趣推网络 编辑:程序博客网 时间:2024/06/08 18:36

客户需要自定义columnrange每根横柱的颜色,
官方例子

 series: [{        name: 'tl',        data: [            [-9.7, 9.4],            [-8.7, 6.5]        ]    }]

我一开始这样写

series[{{name:'tl',y:[23.4,34.6],color:'#ff0'},{name:'tl',y:[21.4,36.6],color:'#f0f'}}]

但是不行,翻遍API也没找到解释。其中的查询,试验,过程不表,
解决方法 增加事件,暴露出this:

plotOptions: {                                series: {                                    colorByPoint: true,                                    cursor: 'pointer',                                    point: {                                        events: {                                            click: function () {                                                console.log(this);                                            }                                        }                                    }                                }}

打印出的对象为

这里写图片描述
可以发现 low和high的属性,一试 果然是他们!

series[{{name:'tl',low:23.4,high:34.6,color:'#ff0'},{name:'tl',low:21.4,high:36.6,color:'#f0f'}}]

除了查阅API,以及baidu问题。暴露出this,遍历出其中属性,也是一种解决问题的方法。

原创粉丝点击