折线图echarts 折线配置项内容和展示

配置项如下
      option = {
    backgroundColor: '#000',
    tooltip: {
        trigger: 'axis',
        backgroundColor: '#000000',
        borderWidth: 0,
        padding: [5, 10],
        textStyle: {
            color: '#ffffff',
        },
    },
    grid: {
        //   top: 0,
        //   left: 0,
        //   right: 0,
        //   bottom: 0,
        //   containLabel: false
    },
    toolbox: {
        show: false,
    },
    xAxis: {
        type: 'category',
        boundaryGap: false, //坐标轴两边留白
        data: ['11:00', '11:20', '11:40', '12:00', '12:20', '12:40', '13:00'],
        axisLabel: {
            textStyle: {
                color: '#D6E1FF',
            }
        },
        axisLine: {
            lineStyle: {
                color: '#9EA3B4',
                opacity: 0.3,
            }
        },
        axisTick: {
                show: false,
            },
    },
    yAxis: [
        {
            type: 'value',
            splitNumber: 5,
            splitLine: {
                lineStyle: {
                    color: '#9EA3B4',
                    opacity: 0.3,
                },
            },
            axisLabel: {
                textStyle: {
                    color: '#D6E1FF',
                },
            },
        },
    ],
    series: [
        {
            type: 'line',
            symbol: 'none',
            itemStyle: {
                normal: {
                    color: '#4D62FF',
                    lineStyle: {
                        color: '#4D62FF',
                        width: 2,
                    },
                    areaStyle: {
                        //区域填充样式
                        color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
                            {
                                offset: 0,
                                color: 'rgba(77, 98, 255, 0.1)',
                            },
                            {
                                offset: 1,
                                color: 'rgba(77, 98, 255, 0.5)',
                            },
                        ]),
                    },
                },
            },
            toolbox: {
                show: false,
            },
            data: [480, 390, 500, 260, 320, 660, 320],
        },
        {
            type: 'line',
            symbol: 'none',
            itemStyle: {
                normal: {
                    color: '#A03CFC',
                    lineStyle: {
                        color: '#A03CFC',
                        width: 2,
                    },
                    areaStyle: {
                        //区域填充样式
                        color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
                            {
                                offset: 0,
                                color: 'rgba(160, 60, 252, 0.1)',
                            },
                            {
                                offset: 1,
                                color: 'rgba(160, 60, 252, 0.5)',
                            },
                        ]),
                    },
                },
            },
            toolbox: {
                show: false,
            },
            data: [340, 510, 540, 600, 500, 600, 640],
        },
        {
            type: 'line',
            symbol: 'none',
            itemStyle: {
                normal: {
                    color: '#4F12FF',
                    lineStyle: {
                        color: '#4F12FF',
                        width: 2,
                    },
                    areaStyle: {
                        //区域填充样式
                        color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
                            {
                                offset: 0,
                                color: 'rgba(79, 18, 255, 0.1)',
                            },
                            {
                                offset: 1,
                                color: 'rgba(79, 18, 255, 0.5)',
                            },
                        ]),
                    },
                },
            },
            toolbox: {
                show: false,
            },
            data: [700, 600, 680, 420, 520, 600, 700],
        },
        {
            type: 'line',
            symbol: 'none',
            itemStyle: {
                normal: {
                    color: '#23CDF1',
                    lineStyle: {
                        color: '#23CDF1',
                        width: 2,
                    },
                    areaStyle: {
                        //区域填充样式
                        color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
                            {
                                offset: 0,
                                color: 'rgba(35, 205, 241, 0.1)',
                            },
                            {
                                offset: 1,
                                color: 'rgba(35, 205, 241, 0.5)',
                            },
                        ]),
                    },
                },
            },
            toolbox: {
                show: false,
            },
            data: [80, 100, 110, 260, 480, 480, 590],
        },
    ],
};

    
截图如下