如何始终显示在HighCharts的情节主线？(How to always show the plo

我创建与它的plotline一个HighChart。 的情节主线具有固定值，而数据可图表之间变化。

HighChart自动缩放基于数据的最大值y轴，但它并没有考虑到情节主线在其计算值。

因此，如果数据范围涵盖的plotline值时，情节主线被示出，但被裁切掉视口的如果不是。

例：

$(function () {
    $(document).ready(function() {
        var chart = new Highcharts.Chart({
            chart: {
                renderTo: 'container',
                type: 'column'
            },
            title: {
                text: 'Dummy Data by Region'
            },
            xAxis: {
                categories: ['Africa', 'America', 'Asia']
            },
            yAxis: {
                plotLines:[{
                    value:450,
                    color: '#ff0000',
                    width:2,
                    zIndex:4,
                    label:{text:'goal'}
                }]
            },
            series: [{
                name: 'Year 1800',
                data: [107, 31, 650]
            }]
        });
    });

});​

的jsfiddle对于上面的代码： http://jsfiddle.net/4R5HH/3/

球门线（红色）被示出为默认数据，但如果我改变数据为[107，31，250]，则情节主线熄灭图形视口的，并因此变得不可见。

Answer 1:

你需要在一个点添加到您图表，但禁用标记。 我加入散点图类型，并将其值等于目标值的新系列：

{
     name: 'Goal',
     type: 'scatter',
     marker: {
          enabled: false
     },
     data: [450]
}

请参阅更新的jsfiddle： http://jsfiddle.net/wergeld/4R5HH/4/

Answer 2:

不引入数据点的另外一个选项：

        yAxis: {
            minRange:450,
            min:0,
            plotLines:[{
                value:450,
                color: '#ff0000',
                width:2,
                zIndex:4,
                label:{text:'goal'}
            }]
        },

此设置最小的Y轴为0（这是不太可能在这种情况下假）和最小范围至450。

见更新小提琴 。

Answer 3:

在某些情况下，wergeld的解决方案会比JANK的解决方案最好，尤其是当你不知道min和minRange 。 但wergeld的解决方案有一个小问题。 如果你将鼠标置于情节线，它会显示在点一个点和提示。 为了避免这种情况，我已经修改了他的水溶液，并添加enableMouseTracking摆脱这个问题。

{
     name: 'Goal',
     type: 'scatter',
     marker: {
          enabled: false
     },
     data: [450],
     enableMouseTracking: false
}

请参阅更新的jsfiddle： http://jsfiddle.net/4R5HH/570/

文章来源: How to always show the plotLine in HighCharts?