在导出时更新的yAxis标题丢失

时间:2014-09-16 18:38:32

标签: javascript jquery highcharts

我们的图表包含多个系列。我们只允许一次在图表中显示一个系列。首次加载图表时,我们会将yAxis的标题设置为series[0].name

chart {
...
events: {
    load: function () {
        this.options.yAxis[0].title.text = this.series[0].name;
        this.yAxis[0].setTitle({ text: this.series[0].name });
        this.yAxis[0].update({
            title: {
                text: this.series[0].name
            }
        });
    }
}
...
}

在图例项目上点击我们:

events: {
    legendItemClick: function (event) {
        var seriesIndex = this.index;
        var serie = this.chart.series;
        for (i = 0; i < serie.length; i++) {
            if (serie[i].index == seriesIndex) {
                serie[i].show();
                this.chart.options.yAxis[0].title.text = serie[i].name;
                this.chart.yAxis[0].setTitle({ text: serie[i].name });
            } else {
                serie[i].hide();
            }
        }
        return false;
    }
}

当用户点击图例中的每个系列时,数据集会更新,yAxis.title.text会更改以反映活动系列的series.name

但是,当我们导出图表而不管哪个系列处于活动状态时,yAxis.title.text始终是最初加载的值。

如何让图表导出以获得yAxis的正确标题?我认为设置chart.options会这样做。

代表jsFiddle

1 个答案:

答案 0 :(得分:1)

您可以使用循环查找可见的系列,然后更新轴标题,而不是静态设置第一个系列标题。因此,在导出时,您将实现目标。

load: function () {

                var series = this.series,
                    yAxis = this.yAxis[0];

                $.each(series,function(i, serie) {
                    if(serie.visible) {
                        yAxis.setTitle({
                            text: serie.name
                        });
                    }
                });
 }

示例:http://jsfiddle.net/e9o7ek2a/3/