效果图:

Echarts实现折线图的填充渐变

渐变使用line的areaStyle属性,linear为线性渐变

let option={
    series:[
        {
            type:'line',
            areaStyle:{
                color:{
                    //线性渐变
                    type: 'linear',
                    x: 0,
                    y: 0,
                    x2: 0,
                    y2: 1,
                    colorStops: [{
                        offset: 0, color: 'rgba(1, 255, 255, 0.8)', // 0% 处的颜色
                    }, {
                        offset: 0.6, color: 'rgba(1, 255, 255,0)', // 100% 处的颜色
                    }],
                    global: false, // 缺省为 false
                },
            },
        }
    ]
}

 

相关文章:

  • 2022-12-23
  • 2022-01-12
  • 2022-12-23
  • 2021-06-29
  • 2022-12-23
  • 2022-12-23
  • 2022-12-23
  • 2021-12-24
猜你喜欢
  • 2021-05-08
  • 2022-01-05
  • 2021-10-25
  • 2021-09-14
  • 2021-12-03
  • 2022-12-23
  • 2022-01-17
相关资源
相似解决方案