Как объединить два чарта в Chart.js?

Question

[Евгений Журов]

Добрый день, есть два объекта в datasets, у каждого в data - одинаковое количество данных. Одни данные нужно вывести в Bar, другие - в Line. Но у одного значения, измеряемые в десятках и сотнях тысяч, а у другого - в основном единицы, максимум - десятки. Т.е. обычный mixed chart из документации предоставляет не совсем нужный функционал. Поскольку шкала у обоих чартов одна, то получается, что line chart со своими жалкими единицами тупо тянется сплошной линией в самом низу диаграммы, т.к. привязан к шкале с сотнями тысяч. Выглядит это вот так:


А надо чтобы было вот так, с двумя осями y, каждая для своего типа чарта:


Поскольку приложение делается на vue, то особенно признателен буду за подсказку, как это сделать в конетксте vue.

Answer 1

[0xD34F]

Надо определить две оси Y:

options: {
  scales: {
    yAxes: [
      { id: 'y1', position: 'left' },
      { id: 'y2', position: 'right' },
    ],
  },
},

приложение делается на vue

Есть vue-chartjs, использование которого для вашего случая может выглядеть так, например.

Comments

[Евгений Журов]

Вчера уже разобрался, но все равно большое спасибо