echarts折线图图例样式
时间: 2023-10-29 18:59:46 浏览: 129
Echars折线图例子
Echarts 折线图的图例可以通过设置 legend 属性来自定义样式。以下是一些常用的图例样式设置示例:
1. 修改图例文字颜色和字体大小:
```javascript
legend: {
textStyle: {
color: '#333',
fontSize: 14
}
}
```
2. 隐藏图例:
```javascript
legend: {
show: false
}
```
3. 修改图例位置:
```javascript
legend: {
top: 'bottom' // 可选值:'top', 'bottom', 'left', 'right'
}
```
4. 修改图例图标类型:
```javascript
legend: {
data: ['数据1', '数据2'],
// 设置图例图标类型
// 可选值:'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow', 'none'
icon: 'circle'
}
```
5. 修改图例图标颜色:
```javascript
legend: {
data: ['数据1', '数据2'],
// 设置图例图标颜色
// 可以是颜色值或者回调函数,回调函数的参数为当前图例的名称
textStyle: {
color: function(name) {
if (name === '数据1') {
return 'red';
} else {
return 'blue';
}
}
}
}
```
以上是一些常用的图例样式设置示例,您可以根据需要自由组合。
阅读全文