Как включить события: {} свойство пользовательских данных старшей диаграммы в highcharts-vue

Question

Vue, чтобы построить graps.Я обычно передаю свой JSON в параметры тега: например,

. Теперь я пытаюсь построить собственную диаграмму, используя функции рендерера и ren.path (). attr (). add ().Поскольку в этих свойствах используется функция load () внутри параметров диаграммы, я не могу преобразовать их в файл JSON.

ТАМОЖЕННОЕ ЗНАЧЕНИЕ ЧАРТА:

{
chart: {
    backgroundColor: 'white',
    width: 600,
    height: 200,
    borderWidth: 1,
    events: {
        load: function () {
            var ren = this.renderer,
                colors = Highcharts.getOptions().colors,
                rightArrow = ['M', 0, 0, 'L', 10, 0, 'L', 5, 5, 'M', 10, 0, 'L', 5, -5];
    ren.path(['M', 50, 100, 'L', 550, 100])
                .attr({
                'stroke-width': 3,
                                stroke: 'black',
                                dashstyle: 'solid'
                })
                .add();

  ren.text('0%', 50 , 150).add();
  ren.text('Peer Group 1', 50, 50).add();
  ren.text('20%', 150 , 150).add();
  ren.text('Peer Group 2', 150, 50).add();
  ren.text('40%', 250 , 150).add();
  ren.text('Peer Group 3', 250, 50).add();
  ren.text('60%', 350 , 150).add();
  ren.text('Peer Group 4', 350, 50).add();
  ren.text('80%', 450 , 150).add();
  ren.text('Peer Group 5', 450, 50).add();
  ren.text('100%', 550 , 150).add();

   ren.path(['M', 100, 80, 'L', 100, 120])
     .attr({'stroke-width': 3,stroke: 'black',dashstyle: 'solid'}).add();
   ren.path(['M', 200, 80, 'L', 200, 120])
     .attr({'stroke-width': 3,stroke: 'black',dashstyle: 'solid'}).add();
   ren.path(['M', 300, 80, 'L', 300, 120])
     .attr({'stroke-width': 3,stroke: 'black',dashstyle: 'solid'}).add();
   ren.path(['M', 400, 80, 'L', 400, 120])
     .attr({'stroke-width': 3,stroke: 'black',dashstyle: 'solid'}).add();
   ren.path(['M', 500, 80, 'L', 500, 120])
     .attr({'stroke-width': 3,stroke: 'black',dashstyle: 'solid'}).add();  


    ren.circle(150, 100, 9).attr({fill: '#0000FF',
            stroke: 'black','stroke-width': 0}).add();
 ren.text('20%', 140, 70).css({color: '#0000FF'}) .add();

        }
    }
},
title: {
    text: 'Highcharts export server overview',
    style: {
        color: 'black'
    }
}

}

См. https://jsfiddle.net/87ng9v1z/ JSON работает нормально.я всегда использую один и тот же тип рабочего json и разбираю его в теге, как показано выше.

Я что-то упустил?Есть ли другой способ загрузки данных этого типа в верхние таблицы или как преобразовать эти данные в формат JSON.