Highcharts: Y-оси с нулевым выравниванием углов 6

Question

Мне нужно реализовать диаграмму, как в этой ссылке: highchart-image

Итак, я нашел плагин в старшей таблице, я думаю, что он полезен:

http://highchartsweb.vifi.ee/plugin-registry/single/42/Zero-align%20y-axes

Я использую файл, который отвечает за выравнивание с именем "tick_positioner.js", и добавляю его в свое угловое приложение.

"scripts": [
              "node_modules/highcharts-zero-align-y-axes/tick_positioner.js"
            ]

У меня первая ошибка

tick_positioner.js:147 Uncaught ReferenceError: Highcharts is not defined

Но highchart загружается в приложение

Answer 1

Чтобы создать такой тип диаграммы, вам не нужно использовать zero-align y-axes плагин:

Highcharts.chart('container', {
    series: [{
        type: 'column',
        data: [2, -3, -5, 1, 6, -2, 11, -9]
    }, {
        type: 'column',
        data: [-2, -3, -5, 1, 6, -2, 11, -9]
    }]
});

Демонстрация в реальном времени: http://jsfiddle.net/BlackLabel/750bu6a2/

Однако, чтобы загрузить плагин в ваш проект, вы должны импортировать и инициализировать его следующим образом:

import * as Highcharts from 'highcharts';
import * as HC_customEvents from 'highcharts-custom-events';
HC_customEvents(Highcharts);

Документы: https://github.com/highcharts/highcharts-angular/blob/master/README.md