我们的图表包含多个系列。我们只允许一次在图表中显示一个系列。首次加载图表时,我们会将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。
答案 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
});
}
});
}