解决echarts中同一刻度下多柱状图合一

先贴代码：

var categoryData = ['a1','a2','a3','a4','a5'];
var data1 = [[0, 16, 113], [1, 16, 115],
[2, 26, 122],[3, 92, 122], [4, 56, 77]];

var data2 = [[0, 44, 233], [1, 18, 315],
[2, 43, 310],[3, 12, 42], [4, 23, 233]];

var data3 = [[0, 22, 54], [1, 23, 45],
[2, 33, 155],[3, 44, 211], [4, 52, 88]];

function addZvalue(){
    for(var i=0;i<data1.length;i++){
        var arr1=[data1[i][2],data2[i][2],data3[i][2]];
        var arr2=[data1[i][2],data2[i][2],data3[i][2]];
        arr2.sort(function(a,b){return b-a});
        
        data1[i].push(arr2.indexOf(arr1[0])+10);
        data2[i].push(arr2.indexOf(arr1[1])+10);
        data3[i].push(arr2.indexOf(arr1[2])+10);
        
        //console.log(data1[i]);
    }
   

}
addZvalue();
 console.log(data1);
 console.log(data2);
 console.log(data3);

function renderItem1(params, api) {
    var yValue = api.value(2);
    var z2Value=api.value(3);
   // console.log(z2Value);
    var start = api.coord([api.value(0), yValue]);
    var size = api.size([api.value(1) - api.value(0), yValue]);
    var style = api.style({
        stroke: api.visual('color')
    });
    
    return {
            type: 'rect',
            shape: {
                x: start[0],
                y: start[1] ,
                width:40,
                height:size[1]
                
            },
            style: style,
            z2: z2Value
            
            
        };
}


option = {
    tooltip: {
        trigger: 'axis',
        axisPointer: {
            type: 'shadow'
        }
    },
    title: {
        text: 'Error bar chart'
    },
    legend: {
        data: ['bar1', 'bar2','bar3']
    },
  
    xAxis: {
        data: categoryData
    },
    yAxis: {},
    series: [{
        type: 'custom',
        name: 'bar1',
        itemStyle: {
            normal: {
                borderWidth: 1.5
            }
        },
        renderItem: renderItem1,
        encode: {
            x: 0,
            y: [1, 2]
        },
        data: data1,
        z:4
        
    }, {
        type: 'custom',
        name: 'bar2',
        itemStyle: {
            normal: {
                borderWidth: 1.5
            }
        },
        renderItem: renderItem1,
        encode: {
            x: 0,
            y: [1, 2]
        },
        data: data2,
        z:4
        
    }, {
        type: 'custom',
        name: 'bar3',
        itemStyle: {
            normal: {
                borderWidth: 1.5
            }
        },
        renderItem: renderItem1,
        encode: {
            x: 0,
            y: [1, 2]
        },
        data: data3,
        z:4
        
    }]
};

效果图展示：

主要用到的的属性z2，这是控制图层的属性