echarts将配置项series中的name重命名
时间: 2024-01-28 22:43:22 浏览: 66
Echarts-配置项手册.zip
你可以通过在配置项中使用formatter函数来重命名series中的name。具体来说,你需要在series中的name属性值中使用formatter函数,并在函数中返回你想要的新名称。
例如,假设你有一个柱状图,你想要将每个柱子的名称从默认的"Series 1"和"Series 2"重命名为"Apples"和"Oranges"。你可以这样做:
```
option = {
xAxis: {
data: ['2015', '2016', '2017', '2018', '2019', '2020']
},
yAxis: {},
series: [{
name: 'Series 1',
type: 'bar',
data: [10, 20, 30, 40, 50, 60],
itemStyle: {
color: '#FFA07A'
}
}, {
name: 'Series 2',
type: 'bar',
data: [20, 30, 40, 50, 60, 70],
itemStyle: {
color: '#87CEFA'
}
}]
};
// 使用formatter函数重命名series名称
option.series.forEach(function (seriesItem) {
seriesItem.name = function(params) {
if (seriesItem.name === 'Series 1') {
return 'Apples';
} else if (seriesItem.name === 'Series 2') {
return 'Oranges';
} else {
return seriesItem.name;
}
};
});
// 渲染图表
var myChart = echarts.init(document.getElementById('myChart'));
myChart.setOption(option);
```
在这个例子中,我们遍历了series数组中的每个项,并使用了一个匿名函数来为每个series的name属性赋值。在这个函数中,我们检查当前的name属性值,如果是"Series 1",我们将它重命名为"Apples",如果是"Series 2",我们将它重命名为"Oranges"。对于其他的name属性值,我们保持它们原本的名称不变。最后,我们将这个匿名函数赋值给每个series的name属性。
渲染这个图表后,你应该会看到每个柱子的名称已经被重命名为"Apples"和"Oranges"。
阅读全文