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
                },
            },
        }
    ]
}

 

posted @ 2020-09-17 09:58  herry菌  阅读(2427)  评论(0编辑  收藏  举报