Echarts 之横向柱状图（完成度用汉字标识）

效果图

代码 

<script src="../js/echarts-4.1.0/echarts.js"></script>
<script src="../js/theme/customed.js"></script>
<script type="text/javascript">
    var yAxisData = ['项目1','项目2','项目3','项目4','项目5'];
    var zdxmData = [95,30,10,50,100];
    var valdata = [100,100,100,100,100];
    var option = {
        xAxis: {
            show: false
        },
        grid: {
            top:'2%',
            left: '2%',
            right: '2%',
            bottom: '2%',
            containLabel: true
        },
        yAxis: [{
            show: true,
            data: valdata,
            inverse: true,
            axisLine: {
                show: false
            },
            splitLine: {
                show: false
            },
            axisTick: {
                show: false
            },
            axisLabel: {
                formatter: function(value, index) {
                    return [
                        (index + 1)
                    ].join('\n')
                },
                rich: {
                    lg: {
                        // backgroundColor: '#339911',
                        // color: '#fff',
                        borderRadius: 15,
                        // padding: 5,
                        align: 'center',
                        width: 15,
                        height: 15
                    },
                }
            },
    
    
        }, {
            show: true,
            inverse: true,
            data: yAxisData,
            axisLine: {
                show: false
            },
            splitLine: {
                show: false
            },
            axisTick: {
                show: false
            },
    
        }],
        series: [{
            name: '条',
            type: 'bar',
            yAxisIndex: 0,
            data: zdxmData,
            barWidth: 15,
            itemStyle: {
                normal: {
                    barBorderRadius: 30,
                    color: '#1089E7'
                }
            },
            label: {
                normal: {
                    show: true,
                    position: 'insideRight',
                    fontSize:'10',
                    formatter: function(params) {
                        if(params.value == 95){
                            return "待验收";
                        }else if(params.value == 30 || params.value == 50){
                            return "建设中";
                        }else if(params.value == 10){
                            return "已立项";
                        }else if(params.value == 100){
                            return "已完成";
                        }
                    }
                }
            },
        }, {
            name: '框',
            type: 'bar',
            yAxisIndex: 1,
            barGap: '-100%',
            data: [100, 100, 100, 100, 100],
            barWidth: 15,
            itemStyle: {
                normal: {
                    color: 'none',
                    borderColor: '#00c1de',
                    borderWidth: 3,
                    barBorderRadius: 15,
                }
            }
        }, ]
    };
</script>

 工作中使用到的，总结归纳后，仅供各位大神们参考......