Chartkick-vue 条形图 - “horizo​​ntalBar”不是注册控制器

Question

我想将垂直柱形图转换为水平堆积条形图。我使用chartkick-vue0.61 和chart.js3.0-beta。

我当前的代码：

<column-chart :data="chartData" suffix="%"
              height="200px"
              :colors="[['#28a745', '#007bff', '#ffc107', '#dc3545']]">
</column-chart>

呈现方式如下：

我找到了这个文档，但我不知道如何将其传递给chartkick-vue，所以我从单杠开始：

<bar-chart
  :data="chartData"
  suffix="%"
  height="200px"
  :colors="[['#28a745', '#007bff', '#ffc107', '#dc3545']]"
>

但它失败了：

Error Loading Chart: "horizontalBar" is not a registered controller

这是代码沙箱：https://codesandbox.io/s/pective-williamson-upohe

我该如何解决？

Answer 1

现在它实际上已经在选项中type: 'bar'了。indexAxis: 'y'请参阅https://www.chartjs.org/docs/latest/samples/bar/horizo​​ntal.html