vue3项目中使用echarts,我使用的是tree图(echart示例),现在有个地方想实现的效果是如下图(这张图就是我已经实现的效果),就是在前端加个标签。我本来想在formatter里面return <span><span>,结果显示的是整个html代码,不是我要的效果,然后就去仔细看了下配置项,使用另一种方式实现了。
思路
formatter中把自定义字段赋值给b或c(label中formatter配置项),再在rich中给b或c添加样式即可。
实现
label: {
formatter: function(params) {
// data.type赋值给b,name赋值给c
return `{b|${params.data.type}}{c|${params.name}}`
},
rich: {
// 给b或c各自添加样式
b: {},
c: {}
}
}