Высокие диаграммы, сгенерированные из таблицы HTML: невозможно добавить второй yAxis динамически

Question

У меня есть переменная таблица столбца HTML (в этом примере один столбец даты и три столбца значений).Создать Highchart из этого просто, используя datatable в качестве входных данных графиков:

this.chart = Highcharts.chart(this.container.nativeElement, {
     data: {table: 'datatable'},
    ...
}

, где я получаю только один yAxis, основываясь на последнем столбце значений.Это, вероятно, как и ожидалось.

Проблема: я бы хотел, чтобы для каждого из трех столбцов значений была отдельная yAxis с именем заголовка столбца таблицы в качестве метки / имени yAxis.Пожалуйста, смотрите скриншот ниже.

На скриншоте выше вы можете видеть, что три серии имеют разные диапазоны, а один с наименьшими значениями («Значение1») в основном отображается как плоское.

Использование функции Highcharts.Chart.addAxis() работает несколько - я получаю новую метку yAxis, но не сопоставляюсь с соответствующим столбцом значений с линиями сетки.Проблема в том, что все загружается динамически.Предварительно я не знаю, сколько столбцов я получу, и, соответственно, я не знаю, сколько yAxis 'мне нужно отобразить.

Все примеры, которые я видел, используют жестко закодированную информацию yAxis и не помогают,У меня заканчиваются возможные ответы о переполнении стека, и до сих пор, к сожалению, я не нашел ни одного решения этой конкретной проблемы.

Answer 1

В дополнение к добавлению оси необходимо также подключить ее к соответствующей серии:

chart.addAxis({
    opposite: true
});

chart.series[1].update({
    yAxis: 1
});

Демонстрационная версия: https://jsfiddle.net/BlackLabel/1bkvcwmp/

Справочник по API: https://api.highcharts.com/class-reference/Highcharts.Series#update