Vue.js Y轴必须在X轴上

我正在制作一个实时更新的条形图。我希望它从右到左更新，以便最新的一个在右边出现，并将之前的一个推到左边。但目前它的更新是从下到上（）

我尝试使用图表上的选项，但没有效果。有什么解决办法吗？ jsfiddle上的实例。

这些是高图表选项

export const liveChart = {
  liveChartInterval: null,
  colors: ['#547fff'],
  chart: {
    height: 170,
    type: 'bar',
    animation: Highcharts.svg, // don't animate in old IE
    marginRight: 10,
    events: {
      load: function () {

        // set up the updating of the chart each second
        var series = this.series[0];
        liveChartInterval = setInterval(function () {
          var x = (new Date()).getTime(), // current time
            y = Math.random();
          series.addPoint([x, y], true, true);
        }, 1000);
      }
    },
    inverted: true
  },

  time: {
    useUTC: false
  },
  credits: {
    enabled: false
  },
  title: false,
  xAxis: {
    type: 'datetime',
    tickPixelInterval: 150
  },
  yAxis: {
    title: {
      enabled: false
    },
    plotLines: [{
      value: 0,
      width: 1,
      color: '#808080'
    }]
  },
  tooltip: {
    headerFormat: '<b>{series.name}</b><br/>',
    pointFormat: '{point.x:%Y-%m-%d %H:%M:%S}<br/>{point.y:.2f}'
  },
  legend: {
    enabled: false
  },
  exporting: {
    enabled: false
  },
  series: [{
    name: 'Random data',
    data: (function () {
      // generate an array of random data
      var data = [],
        time = (new Date()).getTime(),
        i;

      for (i = -19; i <= 0; i += 1) {
        data.push({
          x: time + i * 1000,
          y: Math.random()
        });
      }
      return data;
    }())
  }]
};

导出常量活动图表={
liveChartInterval:null，
颜色：['#547fff']，
图表：{
身高：170，
类型：'bar'，
动画：Highcharts.svg，//不要在旧IE中设置动画
marginRight:10，
活动：{
加载：函数（）{
//设置图表的每秒更新
var系列=本系列[0]；
liveChartInterval=setInterval（函数（）{
var x=（新日期（））.getTime（），//当前时间
y=数学随机（）；
系列。添加点（[x，y]，真，真）；
}, 1000);
}
},
倒过来：是的
},
时间：{
useUTC:false
},
学分：{
已启用：false
},
标题：假，
xAxis：{
键入：“日期时间”，
像素间隔：150
},
亚克斯：{
标题：{
已启用：false
},
绘图线：[{
值：0，
宽度：1，
颜色：'#808080'
}]
},
工具提示：{
headerFormat:“{series.name}
”，
点格式：“{point.x:%Y-%m-%d%H:%m:%S}
{point.Y:.2f}”
},
图例：{
已启用：false
},
出口：{
已启用：false
},
系列：[{
名称：'随机数据'，
数据：（函数（）{
//生成一个随机数据数组
var数据=[]，
时间=（新日期（））.getTime（），
我
对于（i=-19；i您需要使用
列
图表类型，而不是
条形
：

chart: {
    type: 'column',
    ...
}


现场演示：

API参考：

文档：