患者年龄性别分布echarts 柱状配置项内容和展示

配置项如下
      option = {
    title: {
        text: '患者数量(人)',
        textStyle: { color: '#666', fontSize: 14, fontWeight: 'normal' },
        padding: [5, 0, 0, 0],
    },
    legend: { orient: 'vertical', top: 0, right: 0, itemWidth: 10, itemHeight: 10, icon: 'circle', data: ['男', '女'] },
    grid: { left: 0, top: 50, bottom: 20, right: 20, containLabel: true },
    xAxis: {
        type: 'category',
        data: ['50岁以下', '50-59岁', '60-69岁', '70-79岁', '80-89岁', '90-99岁', '100岁以上'],
        axisLine: { lineStyle: { color: '#ccc' } },
        axisTick: { length: 3 },
        axisLabel: { color: '#999' },
    },
    yAxis: {
        type: 'value',
        axisLine: { show: true, lineStyle: { color: '#ccc' } },
        axisLabel: { color: '#999' },
        splitLine: { lineStyle: { color: ['#CEEDFF'], type: [5, 8], dashOffset: 3 } },
    },
    tooltip: {
        trigger: 'axis',
        axisPointer: { type: 'shadow' },
        textStyle: { color: '#424242' },
        renderMode: 'html',
        className: 'tooltip',
        order: 'seriesDesc',
    },
    series: [
        {
            name: '女',
            type: 'bar',
            stack: 'total', // ! 多条数据总计 => 堆叠
            barWidth: 24,
            color: '#FFC53D',
            itemStyle: { borderRadius: 0 },
            data: [5, 0, 0, 2, 3, 0, 0],
        },
        {
            name: '男',
            type: 'bar',
            stack: 'total', // ! 多条数据总计 => 堆叠
            barWidth: 24,
            color: '#52A8FF',
            itemStyle: { borderRadius: [12, 12, 0, 0] },
            data: [16, 2, 3, 3, 8, 2, 1],
        },
    ],
};

    
截图如下