今天在用 echarts 画图的时候出现了一个奇怪的问题——legend显示的内容和画的图不符合。
错误图片
{
……
legend: {
data: ['采集端在线率', '采集端离线率', '发射端在线率', '发射端离线率']
}
……
series: [
{
name: '采集端在线率',
……
data: [
{
name: '采集端在线率',
value: 50
},
{
name: '采集端离线率',
value: 50
}
]
},
{
name: '发射端在线率',
……
data: [
{
name: '发射端在线率',
value: 30
},
{
name: '发射端离线率',
value: 70
}
]
}
]
}
如上,这时 legend 中的“采集端在线率”和“发射端在线率”并不是图中的内容,而是整个系列圆环。因为 series 中的元素的 name 与 legend 中 data 的元素相同。解决方法也很简单,比如将 series 中的 name 的“在线率”三个字去掉。效果图如下:
正确图片
到底是我技术烂呢还是百度坑呢。