echarts折线图背景渐变以及常用配置项

 let myChart = this.$echarts.init(document.getElementById('plant-charts'));
                // 绘制图表
                myChart.setOption({
                    tooltip: {
                        formatter: '{c}' //设置单位
                    },
                    //图例样式
                    legend: {
                        data: ['宽带情况', '数据量'],
                        textStyle: {//图例文字的样式
                            color: '#fff',
                            fontSize: 12,
                            padding: [0, 20, 0, 0]
                        }
                    },
                    grid: {  //设置图标距离父级div的间距
                        top: "10",
                        left: "0",
                        right: "15",
                        bottom: "10",
                        containLabel: true
                    },
                    xAxis: {
                        type: 'category',
                        boundaryGap: false,
                        data: ['2015','2016','2017','2018','2019','2020','2021'],
                        axisLabel: {
                            interval: '0', //类目轴(category)中用数值表示显示间隔，0为显示所有，1为隔一个显示一个，以此类推
                            textStyle: {  //文字样式
                                color: '#62799C',
                                fontSize: '12'
                            },
                        },

                        axisTick: {       //y轴刻度线不显示
                            show: false
                        },
                    },
                    yAxis: {
                        type: 'value',
                        //show: false,
                        axisLabel: {
                            textStyle: {  //文字样式
                                color: '#62799C',
                                fontSize: '12'
                            },

                        },
                        // 控制网格线
                        splitLine: {
                            //  改变轴线颜色
                            lineStyle: {
                                color: '#2a2a2d'
                            }
                        },
                        axisTick: {       //y轴刻度线
                            show: false
                        },
                    },
                    series: [{
                        data: [5000,6000,7000,4400,3200,4500,6800],
                        type: 'line',
                        itemStyle: {
                            normal: {
                                color: 'rgba(62,139,222,1)'//线颜色
                            }
                        },
                        areaStyle: {
                            normal: {
                                color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [{ //折线图颜色渐变
                                    offset: 0,
                                    color: 'rgba(62,139,222,0.6)'
                                }, {
                                    offset: 1,
                                    color: 'rgba(62,139,222,0.01)'
                                }])
                            }
                        },
                    }]
        });