【Echarts】渐变色实现方式

实现方式一:

color: {
            type: 'linear',
            //颜色渐变函数 前四个参数分别表示四个位置依次为左、下、右、上
            x: 1, y: 1, x2: 0, y2: 0,
            colorStops: [
              {
                offset: 0,
                color: '#00FF66', // 0% 处的颜色
              },
              {
                offset: 1,
                color: 'rgba(0,255,102,0.20)', // 100% 处的颜色
              },
            ],
            global: false, // 缺省为 false
          },

 

实现方式二:

 

//左、下、右、上
color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                            offset: 0,
                            color: 'rgba(13, 191, 255, 0)'
                        }, {
                            offset: .5,
                            color: 'rgba(13, 191, 255, .5)'
                        },{
                            offset: 1,
                            color: 'rgba(13, 191, 255, 1)'
                        }])

 

posted @   维多利亚的巴黎世家  阅读(943)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· 阿里巴巴 QwQ-32B真的超越了 DeepSeek R-1吗?
· 【译】Visual Studio 中新的强大生产力特性
· 【设计模式】告别冗长if-else语句:使用策略模式优化代码结构
· 10年+ .NET Coder 心语 ── 封装的思维:从隐藏、稳定开始理解其本质意义
点击右上角即可分享
微信分享提示