Highcharts：使X轴和Y轴相交于0

Question

我正在尝试使图表的 X 轴和 Y 轴在 0 处相交，总是。目前，我正在拦截“加载”事件，然后更改最初工作的轴的偏移量，但是当调整窗口大小或放大图表时，轴不会更新。

即使调整窗口大小或缩放图表，如何保持轴以 0 为中心？

这是我的小提琴和代码：http://jsfiddle.net/a003mc4b/

$(function () {
    $('#container').highcharts({

        chart: {
            type: 'scatter',
            zoomType: 'xy',
            events: {
                load : function() {
                    this.xAxis[0].update({
                            offset: -this.yAxis[0].translate(0)
                        });
                    this.yAxis[0].update({
                            offset: -this.xAxis[0].translate(0)
                        });
                }
            },
        },

        title: {
            text: 'X and Y axis should intersect at 0'
        },
        yAxis: {
            lineColor: '#FF0000',
            lineWidth: 1
        },
        xAxis: {
            lineColor: '#FF0000',
            lineWidth: 1
        },  
        series: [{
            data: [[0,0],[1,1],[2,5],[-1,-5],[0,5]]
        }]
    });
});

Answer 1

你可以使用情节线的概念。

您可以为 xAxis 和 Yaxis 分别绘制一条 0 的线。这将使它们始终在 0 处相交，即使您调整大小也是如此

xAxis: [{
 plotLines: [{
                value: 0,
                 width: 2,
                color: 'blue'
            }]
}],
yAxis : [{
 plotLines: [{
                value: 0,
                 width: 2,
                color: 'blue'
            }]    
}]

更新了你的 js fiddle here，

即使你调整大小，这个东西也不会受到影响。

Answer 2

试试这样的：

yAxis: {
    offset: -15
},

检查这个小提琴：http://jsfiddle.net/a003mc4b/2/