vue中的v-charts如何多个x轴？

Question

v-charts使用ve-histogram，settings设置axisSite: { right: ['到店转化', '成交转化']}可以设置右边的x轴，但需求需要把一个数据设置到上x周。效果如下：

但发现加了data-zoom就出现bug了，缩小后上面的x轴不会变化，如图：

找不到好的接近办法，代码如下：

<template>
    <div>
        <ve-histogram :data="chartData" :data-zoom="dataZoom" :settings="chartSettings"></ve-histogram>
    </div>
</template>

<script>
export default {
    data() {
        this.chartSettings = {
            dimension:['日期', '日期'],
            axisSite: { right: ['下单率'] },
            showLine: ['下单用户'],
        }
        this.dataZoom = [
            {
                type: 'inside',
                start: 0,
                end: 100
            },
            {
                type: 'slider',
                start: 0,
                end: 100
            }
        ];
       
        return {
            chartData: {
                columns: ['日期', '访问用户', '下单用户', '下单率'],
                rows: [
                    { '日期': '1/1', '访问用户': 1393, '下单用户': 1093, '下单率': 0.32 },
                    { '日期': '1/2', '访问用户': 3530, '下单用户': 3230, '下单率': 0.26 },
                    { '日期': '1/3', '访问用户': 2923, '下单用户': 2623, '下单率': 0.76 },
                    { '日期': '1/4', '访问用户': 1723, '下单用户': 1423, '下单率': 0.49 },
                    { '日期': '1/5', '访问用户': 3792, '下单用户': 3492, '下单率': 0.323 },
                    { '日期': '1/6', '访问用户': 4593, '下单用户': 4293, '下单率': 0.78 }
                ]
            }
        }
    }
}
</script>

<style scoped>

</style>