怎么设置echarts的富文本legend
时间: 2023-06-26 10:10:27 浏览: 163
要设置 Echarts 的富文本图例,需要在 legend.data 属性中指定每个图例项的名称和样式。在名称中使用 HTML 标签,就可以实现富文本效果了。
下面是一个示例代码,演示如何设置带有富文本样式的图例:
```javascript
option = {
// ...
legend: {
data: [
{
name: '<span style="color:red">直接访问</span>',
icon: 'circle',
},
{
name: '<span style="color:blue">邮件营销</span>',
icon: 'circle',
},
{
name: '<span style="color:green">联盟广告</span>',
icon: 'circle',
},
{
name: '<span style="color:purple">视频广告</span>',
icon: 'circle',
},
{
name: '<span style="color:orange">搜索引擎</span>',
icon: 'circle',
},
],
// ...
},
// ...
};
```
在这个例子中,我们用了 `<span>` 标签来设置颜色。您还可以使用其他 HTML 标签,例如 `<b>`、`<i>`、`<u>` 等等来设置其他样式。
阅读全文