Echarts在线免费图表

 
            option = {
      title: {
        text: "统计",
        textStyle: { color: "#000000", fontSize: 20, fontWeight: "normal" },
        x: "left"
    },
    tooltip: {
        trigger: 'axis',
        axisPointer: { // 坐标轴指示器，坐标轴触发有效
            type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
        }
    },
    legend: {
        data: ['总容量', '月度增容量', '用电量'],
        right: '40%',
    },
    grid: {
        left: '3%',
        right: '4%',
        bottom: '3%',
        containLabel: true
    },
    xAxis: {
        type: 'category',
        splitLine: {
            show: false
        },
        axisTick: {
            show: false
        },
        data: ['2022-10', '2022-11', '2022-12', '2023-01', '2023-02', '2023-03', '2023-04', '2023-05', '2023-06', '2023-07', '2023-08', '2023-09']
    },
    yAxis: [
        {
        type: 'value',
        name: '容量',
        axisLine:{
            show:'true'
        },
            min: 0,
            max: 500,
                    yxisLine: {
            lineStyle: { color: '#C4C4C4' }
        },
            axisLabel: {
                formatter: '{value} KVA'
            }
    },
        {
        type: 'value',
        name: '用电量',
        axisLine:{
            show:'true'
        },
            min: 0,
            max: 500,
                    yxisLine: {
            lineStyle: { color: '#C4C4C4' }
        },
            axisLabel: {
                formatter: '{value} Kwh'
            }
    }],
    series: [{
            name: '总容量',
            itemStyle: {
                normal: {
                    color: '#28C1FF',
                }
            },
            // 柱子间的间距
            barCategoryGap: '40%',
            type: 'bar',
            data: [320, 332, 301, 334, 390, 330, 320,314,378,333,410,289]
        },
        {
            name: '月度增容量',
            itemStyle: {
                color: "#FAA13D"
            },
            type: 'bar',
            data: [120, 132, 101, 134, 90, 230, 210,290,310,345,351,431]
        },
        {
            name: '用电量',
            itemStyle: {
                color: "#81D32A"
            },
            type: 'bar',
            yAxisIndex: 1,
            data: [220, 182, 191, 234, 290, 330, 310,333,356,278,278,348,]
        },
    ]
};