Echarts在线免费图表

 
            option = {
   backgroundColor: '#fff',
    color: ['#5f84e2', '#dc7898', '#7ad27a', '#9171f7', '#dc8a46', '#f2ca6b', '#76a230'],
    tooltip: {
        trigger: 'axis',
        axisPointer: {
            type: 'cross',
            label: {
                backgroundColor: '#6a7985'
            }
        }
    },
    legend: {
        show: true,
        icon: 'rect',
        right: 20,
        top: 15,
        itemWidth: 8,
        itemHeight: 8,
        textStyle: {
            fontSize: 12,
            color: '#333333'
        },
        data: ['一部', '二部', '三部', '四部', '五部', '六部', '七部', '服务中心']
    },
    grid: {
        left: '3%',
        right: '4%',
        bottom: '0%',
        containLabel: true
    },
    xAxis: [{
        type: 'category',
        boundaryGap: true,
        axisTick: {
            show: false
        },
        axisLine: {
            show: false
        },
        axisLabel: {
            textStyle: {
                fontSize: 14,
                color: '#999999'
            }
        },
        data: ['2024/1', '2024/2', '2024/3', '2024/4', '2024/5', '2024/6', '2024/7', '2024/8', '2024/9']
    }],
    yAxis: [{
        show: true,
        min: 300,
        type: 'value',
        axisTick: {
            show: false
        },
        axisLine: {
            show: false
        },
        splitLine: {
            show: true,
            lineStyle: {
                color: '#f2f3f7'
            }
        },
        axisLabel: {
            textStyle: {
                fontSize: 14,
                color: '#999999'
            }
        },
    }],
    series: ['一部', '二部', '三部', '四部', '五部', '六部', '七部', '服务中心'].map(i => {
        return {
            name: i,
            type: 'line',
            stack: '总量',
            symbol: 'circle',
            symbolSize: [8, 8],
            areaStyle: {
                normal: {}
            },
            data: [300, 330, 360, 390, 420, 450, 600, 900, 1500]
        }
    })
};