echarts折线图区域颜色渐变色设置由线条到横坐标#5B8FF9到#FFFFFF变化，透明度为0.2

在ECharts中，你可以通过`color`属性以及自定义的颜色映射函数来实现从线条到横坐标的渐变效果，并调整透明度。这里是一个示例，展示如何设置折线图的渐变色：

option = {
    series: [{
        type: 'line',
        name: '折线图',
        data: ...,
        lineStyle: { // 设置线样式
            color: function(param) { // 自定义颜色映射函数
                var r = Math.floor(Math.random() * 256);
                var g = Math.floor(Math.random() * 256);
                var b = Math.floor(Math.random() * (param === undefined ? 256 : 255)); // 如果是横坐标，则渐变为白色
                if(param === undefined) b = 255;
                
                // 创建一个颜色对象，将颜色转换为RGB数组并设置透明度
                var color = `rgba(${r}, ${g}, ${b}, 0.2)`;
                return color;
            }
        },
        areaStyle: { // 设置填充区域样式
            color: 'transparent', // 清除默认填充颜色
            borderType: 'solid', // 设置边框类型
            borderColor: '#5B8FF9', // 边框颜色
            borderWidth: 2 // 边框宽度
        }
    }]
};

在这个例子中，当遍历数据时，`color`函数会生成随机的半透明蓝色（范围内的随机值），对于横坐标（`undefined`），我们将颜色设为白色。`areaStyle`用于清除填充区域的默认颜色，并添加了一个边框来区分。