echarts内置的渐变色生成器

最新推荐文章于 2024-09-01 07:16:48 发布

懒洋洋懒羊羊

最新推荐文章于 2024-09-01 07:16:48 发布

阅读量1.2k

点赞数

文章标签： echarts 前端 javascript

本文链接：https://blog.csdn.net/m0_45827438/article/details/130749915

版权

echarts内置的渐变色生成器

1.线性渐变echarts.graphic.LinearGradient

// 4个方位参数依次为右、下、左、上，
// 数组, 用于配置颜色的渐变过程. 每一项为一个对象, 包含offset和color两个参数. offset的范围是0 ~ 1, 用于表示位置
//下面代码从上面开始渐变
new echarts.graphic.RadialGradient(0, 0, 0, 1,[
                {
                  offset: 0,
                  color: 'rgba(255,255,255,0)',
                },
                {
                  offset: 0.89,
                  color: 'rgba(255,143,52,0.1)',
                },
                {
                  offset: 1,
                  color: 'rgba(255,129,26,0.22)',
                },
              ]),

2.径向渐变echarts.graphic.RadialGradient

//三个参数依次代表圆心x,y,半径
//数组配置渐变色
new echarts.graphic.RadialGradient(0.5, 0.5, 0.5, [
                {
                  offset: 0,
                  color: 'rgba(255,255,255,0)',
                },
                {
                  offset: 0.89,
                  color: 'rgba(255,143,52,0.1)',
                },
                {
                  offset: 1,
                  color: 'rgba(255,129,26,0.22)',
                },
              ]),