我们在使用Echarts构建图表的过程中,经常会使用到标签(label)功能,用来对图表进行一些标注。下面介绍如何设置标签文字的颜色可控化:
······
series: [{
label: {
formatter: (params) => {
const data = params.data;
return data.key % 2 == 0?
`{b1|${data.name}}\n{c|${data.value}}` // 此处也可以使用字符串变量语法,分隔线前面的b1、b2、c对应rich中的样式名
:
`{b2|${data.name}}\n{c|${data.value}}`
},
rich: {
b1: {color: '#000000'},
b2: {color: '#FFFFFF'},
c: {color: '#FF5A00'}
}
}
}]
这样,我们就可以根据params中某项数据的值来动态设置label标签中的文字样式了,这里的params大家可以打印出来,是一个包括图表各项数据信息的对象。