Question

在我的图表中，我希望更改xAxis极限取决于各种系列。让我们说系列1，如果我隐藏/显示系列，xAxis的极端不应该改变。它应该具有相同的行为，就像我有ignoreHiddenSeries = false

但是对于系列2，极端应该在show / hide系列上改变，就好像我有ignoreHiddenSeries = true

我怎样才能做到这一点？

我在这里做了一个jsfiddle示例：https://jsfiddle.net/cjchLqaa/2/ 在开始时，xAxis具有极值0,4，其中系列1和2是可见的。但如果我隐藏系列1，那么xAsis仍然应该具有与以前相同的极端。但对于系列2，它应该以正常方式改变。

jsfiddle代码：

$(function () {
   $('#container').highcharts({
    chart:{
        //ignoreHiddenSeries:true,
    },

    xAxis: {

    },

    series: [{
        data: [
            [0, 29.9],
            [1, 71.5],
            [2, 106.4]
        ]
    },
            {
        data: [
            [2, 29.9],
            [3, 71.5],
            [4, 106.4]
        ]
    }]
});


var chart=$('#container').highcharts();

 $("#button1").click(function () {
    var series = chart.series[0];

    if (series.visible) {
        series.hide();

    } else {
        series.show();
    }
});

$("#button2").click(function () {
    var series = chart.series[1];

    if (series.visible) {
        series.hide();

    } else {
        series.show();
    }
 });


});

Answer 1

我会通过检查系列名称（或id）来解决这个问题，如果它符合条件，则抓住x轴极值，隐藏序列，并使用原始极值运行setExtremes()。

像这样：

function(e) {
    e.preventDefault();
    var ext = this.xAxis.getExtremes();
    this.setVisible();
    if(this.name == 'Series 1') {
        this.xAxis.setExtremes(ext.min,ext.max);    
    }
    else {
        this.xAxis.setExtremes();
    }
}

示例，使用legendItemClick事件：

http://jsfiddle.net/jlbriggs/sas2jawm/

Answer 2

$("#button1").click(function () {

    chart.options.chart.ignoreHiddenSeries = false;
    var series = chart.series[0];

    if (series.visible) {
        series.hide();

    } else {
        series.show();
    }
});

$("#button2").click(function () {

    chart.options.chart.ignoreHiddenSeries = true;
    var series = chart.series[1];

    if (series.visible) {
        series.hide();

    } else {
        series.show();
    }
 });

图表xAxis极端变化/修复

2 个答案: