javascript - highcharts 散布有 4 个象限

Question

免责声明:我对使用这些图表框架完全陌生，而且我对 javascript 也不是特别擅长。

我使用 highcharts 创建了一个乱七八糟的散点图 here .

必须更改为有 4 个颜色象限，像这样 here .

问题是这个没有负 y 轴和正 y 轴，我一辈子都想不出如何在数据中间的某个地方发生这种情况。任何帮助是极大的赞赏。

Answer 1

只是mocked up this example , 基于 previous work通过 @jlbriggs .

为了添加象限着色，我求助于使用 chart.renderer 绘制它(我找不到使用轴 plotBands 的更好方法):

function(chart) { // on complete

    var width = chart.plotBox.width / 2.0;
    var height = chart.plotBox.height / 2.0 + 1;

    chart.renderer.rect(chart.plotBox.x,                      
                            chart.plotBox.y, width, height, 1)
            .attr({
                fill: 'lightblue',
                zIndex: 0
            })
            .add();

     chart.renderer.rect(chart.plotBox.x + width,                      
                         chart.plotBox.y, width, height, 1)
            .attr({
                fill: 'yellow',
                zIndex: 0
            })
            .add();

    chart.renderer.rect(chart.plotBox.x,                      
                        chart.plotBox.y + height, width, height, 1)
            .attr({
                fill: 'yellow',
                zIndex: 0
            })
            .add();

    chart.renderer.rect(chart.plotBox.x + width,                      
                        chart.plotBox.y + height, width, height, 1)
            .attr({
                fill: 'lightblue',
                zIndex: 0
            })
            .add();        
});