如何控制echarts中多个图例的颜色
时间: 2024-05-04 22:21:28 浏览: 17
在 ECharts 中,可以通过设置 `color` 属性来控制多个图例的颜色。具体来说,可以将多个颜色值组成的数组赋值给 `color` 属性,ECharts 会按照顺序依次为各个图例分配颜色。以下是一个示例代码:
```javascript
option = {
color: ['#5793f3','#d14a61','#675bba'], // 设置颜色数组
legend: {
data:['邮件营销','联盟广告','视频广告'],
},
series: [
{
name:'邮件营销',
type:'pie',
data:[
{value:335, name:'直接访问'},
{value:310, name:'邮件营销'},
{value:234, name:'联盟广告'},
{value:135, name:'视频广告'},
{value:1548, name:'搜索引擎'}
]
},
{
name:'联盟广告',
type:'pie',
data:[
{value:335, name:'直接访问'},
{value:810, name:'邮件营销'},
{value:434, name:'联盟广告'},
{value:235, name:'视频广告'},
{value:1548, name:'搜索引擎'}
]
},
{
name:'视频广告',
type:'pie',
data:[
{value:335, name:'直接访问'},
{value:710, name:'邮件营销'},
{value:234, name:'联盟广告'},
{value:535, name:'视频广告'},
{value:1548, name:'搜索引擎'}
]
}
]
};
```
在上面的示例中,我们通过设置 `color` 属性为 `['#5793f3','#d14a61','#675bba']`,为三个图例分别分配了不同的颜色。
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![docx](https://img-home.csdnimg.cn/images/20210720083331.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)