1-部门年度任务echarts 柱状配置项内容和展示

配置项如下
      option = {
    tooltip: {
        trigger: 'axis',
        axisPointer: {
            // 坐标轴指示器,坐标轴触发有效
            // type: 'shadow' // 默认为直线,可选为:'line' | 'shadow'
        },
    },
    grid: {
        left: '3%',
        right: '4%',
        bottom: '3%',
        containLabel: true, // 防止标签溢出
    },
    xAxis: [
        {
            type: 'category',
            data: ['临床医学', '软件工程', '力学','法学','地理信息科学','土木工程','应用化学','通讯工程','英语翻译','生物学'],
            axisLabel: {
                margin: 20,
                interval: 0,
                color: '#979797',
                textStyle: {
                    fontSize: 18,
                },
            },
            axisLine: {
                lineStyle: {
                    color: '#cedbe9',
                },
            },
            axisTick: {
                show: false,
            },
        },
    ],
    yAxis: [
        {
            type: 'value',
            name: '单位:%',
            nameTextStyle: {
                fontSize: 13,
            },
            max:20,
            axisLabel: {
                color: '#979797',
                textStyle: {
                    fontSize: 18,
                },
            },
            axisLine: {
                show: true,
                lineStyle: {
                    color: '#cedbe9',
                },
            },
            axisTick: {
                show: false,
            },
            splitLine: {
                lineStyle: {
                    color: '#cedbe9',
                    type: 'dashed',
                },
            },
        },
    ],
    series: [
        {
            name: '级别',
            type: 'bar',
            // barWidth: '10%',
            // 设置barCategoryGap,不设置barWidth
            barCategoryGap: '90%',
            data: [18, 17, 16,14,13,12,10,10,9,8],
            itemStyle: {
                normal: {
                    // 颜色上下渐变
                    color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                        { offset: 0, color: '#83bff6' },
                        { offset: 0.5, color: '#188df0' },
                        { offset: 1, color: '#188df0' },
                    ]),
                    barBorderRadius: [10, 10, 0, 0],
                },
            },
        },
    ],
};

    
截图如下