总结echarts绘图样式更改
一、颜样式更改
1.使用颜主题
Echarts提供了一些默认的颜主题,可以直接在图表配置中设置。如:
```
option =
color: 'red' // 设置整个图表的颜为红
};
```
2.自定义颜
用户也可以自定义颜,可以是一个数组,也可以是一个颜渐变对象。如:
```
option =
color: ['#ff0000', 'ff00', 'ff'] // 设置图表的颜为红、绿、蓝
};
```
3.颜映射
可以根据数据自动映射颜,使不同的数据对应不同的颜。如:
```
option =
color: ['red', 'blue'] // 设置数据为红、蓝
};
```
二、背景样式更改
1.修改背景颜
可以通过修改图表配置的backgroundColor属性来更改背景颜。如:
```
option =
backgroundColor: '#f1f1f1' // 设置背景颜为淡灰
};
```
2.设置渐变背景
可以通过设置backgroundColor为一个颜渐变对象,来实现渐变背景效果。如:
```
option =
backgroundColor:
type: 'linear',
x:0,
y:0,
x2:1,
y2:1,
colorStops:
offset: 0, color: 'red' // 0% 处的颜
},
offset: 1, color: 'blue' // 100% 处的颜
}],
globalCoord: false // 缺省为 false
textstyle}
};
```
三、字体样式更改
1.修改标题字体样式
可以通过设置图表配置的title属性来修改标题的字体样式。如:
```
option =
title:
textStyle: { // 标题文字的样式
color: 'red',
fontSize: 18,
fontWeight: 'bold'
}
}
};
```
2.修改图例字体样式
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论