Echarts 柱状图，如何在x轴两个坐标之间显示

Question

如图，求教

Answer 1

使用双坐标轴

xAxis: [{
    type: 'category',
    data: [0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23],
    show: false
}, {
    type: 'category',
    data: [0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24],
    boundaryGap: false,
    axisTick: { alignWithLabel: true },
    position: 'bottom'
}],
yAxis: {
    type: 'value'
},
series: [{
    data: [120, 200, 150, 80, 70, 110, 130,120,210,110,210],
    type: 'bar',
    barCategoryGap:'20%',
    itemStyle: {
    },        
    xAxisIndex: 0,
    backgroundStyle: {
        color: 'rgba(220, 220, 220, 0.8)'
    }
}]

Answer 2

不知道你想要的是不是这种效果，https://echarts.apache.org/zh...

xAxis: {
    type: 'category',
    data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
    boundaryGap: true,  // <-----------------
},

Answer 3

你可以改变x轴文字的偏移量
xAxis:[

{
    axisLabel: {
        padding:[2,2,2,60] //x轴文字偏移
    },
}

]