带滚动条的高图表列范围



我正在使用Highcharts-more中的列范围类型。默认数据标签格式化程序将低/高数据放在范围的两端,这很好。

但是当我使用滚动条时,高标签不会移动跟随滚动,如何设置,在柱形图中使用滚动条?

示例:在此处输入链接说明

Highcharts.chart('container', {
chart: {
    type: 'columnrange',
    inverted: true
},
title: {
    text: 'Temperature variation by month'
},
subtitle: {
    text: 'Observed in Vik i Sogn, Norway, 2017'
},
xAxis: {
    categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',
        'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
        max:4,
        scrollbar: {
        enabled: true
        }
},
yAxis: {
    title: {
        text: 'Temperature ( °C )'
    }
},
tooltip: {
    valueSuffix: '°C'
},
plotOptions: {
    columnrange: {
        dataLabels: {
            enabled: true,
            format: '{y}°C'
        }
    }
},
legend: {
    enabled: false
},
series: [{
    name: 'Temperatures',
    data: [
        [-9.9, 10.3],
        [-8.6, 8.5],
        [-10.2, 11.8],
        [-1.7, 12.2],
        [-0.6, 23.1],
        [3.7, 25.4],
        [6.0, 26.2],
        [6.7, 21.4],
        [3.5, 19.5],
        [-1.3, 16.0],
        [-8.7, 9.4],
        [-9.0, 8.6]
    ]
}]
});

这是Highcharts错误,已经在master分支中修复,并将在7.0.2版本中发布。同时,您可以使用 master 分支中的代码:

<script src="https://github.highcharts.com/master/highstock.src.js"></script>
<script src="https://github.highcharts.com/master/highcharts-more.js"></script>

或较旧的Highcharts版本:

<script src="https://code.highcharts.com/stock/6/highstock.js"></script>
<script src="https://code.highcharts.com/6/highcharts-more.js"></script>

现场演示:https://jsfiddle.net/BlackLabel/cqzn0tu3/

高图表文件服务:https://code.highcharts.com/

最新更新