@vik_kap

Как вывести данные с Highstock (из highcharts) на Vue?

Есть очень странная проблема.

Есть набор данных для графика (options), обычно они включают себя title, series и тд.

Сделала компонент на vue, который принимает с родительского компонента options и typeChart (тип конструктора) и инициализирует график -
this.chart = Highcharts[this.typeChart](this.$el, this.options)


Мне нужны два типа конструктора графиков - .chart и .stockChart. И вот здесь начинается небольшая проблема.

Дело в том, что если создать график через .chart:
this.chart = Highcharts.chart(this.$el, this.options)

то в родительском компоненте я спокойно могу посмотреть данные этого графика (в mounted например, прописав console.log(this.options.series[0].data))

Но если выбрать конструктор .stockChart, то this.options.series вообще равен null.
Мне необходимо менять this.options.series[0].data через родительский компонент (то есть через setData не получится), но это возможно только при конструкторе chart, что странно :)

Надеюсь понятно объяснила :)
  • Вопрос задан
  • 377 просмотров
Решения вопроса 1
nikichv
@nikichv
Frontend developer. Vue addicted.
Так, ну во-первых, если у вас this.options.series = null, то сам чарт тут не причем. Получается у вас где-то не записывается значение в пропс или в каком-то другом месте ошибка (что сложно понять, ибо вы не привели пример).
Во-вторых, я правильно понимаю, что вы прокидываете серии в чарт через пропсы, а потом в самом компоненте чарта через this.$parent хотите поменять эти самые пропсы, чтобы они обновились и прокинулись опять же в этот компонент? О_о Вам не кажется, что вы делаете что-то не так?
Ну и в-третьих, мой вам совет: при работе с highchart'ом в vue лучше делайте все сразу внутри компонента графика. Плюсы такого подхода: никаких вотчеров, прямой доступ к инстансу графика, не будет несоответствий между сериями в пропсах и в самом чарте (ибо далеко не всегда this.options.series[0] будет равен instance.series[0]). Я сам сначала все в график кидал через пропсы, чтоб компонент типа универсальный был. В итоге когда функционал вырос в несколько раз, все это стало очень сложно хендлить, плюс пошли просадки по памяти.
Ну и создайте пример хоть на том же http://jsfiddle.net, чтоб можно было вам помочь на деле.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы