echarts颜色渐变

Posted 2023-04-23

参考技术A echart中创建了渐变方法，先上图hhh

1，0，0，1分别代表了右、下、左、上四个位置的颜色坐标
然后再在下方
offset: 0, color: '#00FF00',代表颜色坐标为0的颜色
offset: 0.5, color: '#3A8EE6',代表颜色坐标为0.5的颜色
offset: 0.8, color: '#FAB6B6',代表颜色坐标为0.8的颜色
offset: 1, color: '#ddd'代表颜色坐标为1处的颜色

echarts中颜色渐变写法

color: new echarts.graphic.LinearGradient(0, 0, 1, 0,[
                {
                  offset: 0,
                  color: ‘#00ddff‘
                },
                {
                  offset: 1,
                  color: ‘#007db8‘
                }
]),                    

1、使用颜色渐变生成器echarts.graphic.LinearGradient
2、前边四个参数配置颜色渐变的起止位置：按照顺序依次为：右 下 左 上 四个方向的起止位置，1 代表着渐变
3、第五个参数是一个数组，数组里边给渐变的起止点的颜色，offset：0代表渐变0方向的颜色； offset：1代表渐变1方向的颜色

 

效果图：