echarts 折线配置项内容和展示

配置项如下
      option = {
    dataset: {
        source: [
            ['product', '03-19', '03-20', '03-21', '03-22', '03-23', '03-24', '03-25'],
            ['有害程序', 600, 500, 400, 600, 620, 440, 700],
            ['网络攻击', 100, 300, 500, 290, 410, 660, 300]
        ]
    },
    legend: {
        itemWidth: 8, // 图例的宽度
        itemHeight: 8, // 图例的高度
        itemGap: 60,
        icon: 'circle',
        // orient: 'vertical',
        left: 'center',
        top: 'top',
        selectedMode: false, // 取消图例上的点击事件
        textStyle: {
            color: 'rgba(24,144,255,1)',
            fontSize: '18',
            fontFamily: 'PingFangSC-Regular',
            fontWeight: '400',
            lineHeight: '25px'
        }
    },
    grid: {
        left: '10',
        right: '40',
        bottom: '10',
        containLabel: true
    },
    tooltip: {
        trigger: 'axis',
        axisPointer: {
            // 坐标轴指示器,坐标轴触发有效
            type: 'line' // 默认为直线,可选为:'line' | 'shadow'
        }
    },
    xAxis: {
        boundaryGap: false, // x轴从0开始到结束显示
        type: 'category',
        splitLine: {
            show: false
        }, // 去除网格线
        splitArea: {
            show: false
        }, // 保留网格区域
        axisTick: {
            show: false
        },
        axisLine: {
            onZero: false,
            show: true,
            symbolOffset: 20,
            lineStyle: {
                color: '#979797',
                width: 0.6 // 这里是为了突出显示加上的
            }
            // symbol: ['none', 'arrow'],
            // symbolSize: [6, 12],
            // symbolOffset: [0, 8]
        },
        axisLabel: {
            align: 'center',
            textStyle: {
                fontSize: 16,
                color: 'rgba(132,207,241,1)',
                fontFamily: 'PingFangSC-Regular',
                fontWeight: 400
            }
        }
    },
    yAxis: {
        interval: 200,
        max: function(value) {
            const base = Math.ceil(value.max / 200)
            return base * 200
        },
        splitLine: {
            show: false
        }, // 去除网格线
        splitArea: {
            show: false
        }, // 保留网格区域
        axisLine: {
            show: true,
            lineStyle: {
                // 轴上的线样式
                color: '#979797'
            }
        },
        axisTick: {
            show: false
        },
        axisLabel: {
            // 轴上的数据样式
            fontSize: '16',
            fontFamily: 'PingFangSC-Regular',
            fontWeight: '400',
            color: 'rgba(132,207,241,1)',
            lineHeight: '25px'
        }
    },
    series: [{
            type: 'line',
            showSymbol: true, // 显示折线拐点
            seriesLayoutBy: 'row',
            symbol: 'circle',
            symbolSize: 8,
            itemStyle: {
                color: 'rgba(186,231,255,1)',
                width: '6px',
                height: '6px'
            }, // 线条样式
            lineStyle: {
                color: 'rgba(24, 159, 255, 0.3)'
            },
            areaStyle: {
                color: 'rgba(24, 159, 255, 0.3)'
            },
            z: 10
        },
        {
            type: 'line',
            showSymbol: true, // 显示折线拐点
            seriesLayoutBy: 'row',
            symbol: 'circle',
            symbolSize: 8,
            itemStyle: {
                color: 'rgba(250,204,20,1)',
                width: '6px',
                height: '6px'
            }, // 线条样式
            lineStyle: {
                // 折线样式
                color: 'rgba(24, 159, 255, 0.3)'
            },
            areaStyle: {
                // 区域样式
                color: 'rgba(24, 159, 255, 0.3)'
            }
        }
    ]
};
    
截图如下