как добавить компонент диаграммы/графика noflo

У меня есть массив данных в стиле временных рядов, который я хотел бы передать в компонент noflo, который отображает данные в корзине/графике/графике с использованием среды выполнения браузера и пользовательского интерфейса потока.

Я просмотрел библиотеку компонентов и не нашел подходящего компонента. Я знаком с несколькими библиотеками построения диаграмм и готов написать их сам, но не знаю, как вписать это в компонент.

  1. есть ли компонент построения диаграмм/чертежей, который я пропустил? Я видел noflo-ducksboard, но я действительно хочу иметь возможность просматривать сюжет с внутри нофло-уи.
  2. как я могу загрузить библиотеку диаграмм в компонент?
  3. есть ли конкретная библиотека диаграмм, которую вы предлагаете мне использовать?

person 7yl4r    schedule 14.04.2015    source источник


Ответы (1)


Я не видел конкретной библиотеки графиков. noflo-canvas является низкоуровневым и может предоставить вам необходимые примитивы. Вот краткая демонстрационная линейная диаграмма: https://app.flowhub.io/#example/77f213fb32c9b22527e2< /а>

демонстрационная линейная диаграмма noflo-canvas

Чтобы построить из этого, вам просто нужно создать один компонент, который переводит ваши данные в точки для рисования.

person forresto    schedule 15.04.2015
comment
спасибо за пример. Это очень поможет мне, если я пойду по этому пути, но я действительно надеюсь, что мне не нужно создавать библиотеку диаграмм с нуля. Хотя я полагаю, что мог бы разложить существующий на набор компонентов. Можно ли загрузить javascript во внешнем файле в компонент или в среду выполнения для использования в компонентах? - person 7yl4r; 15.04.2015
comment
также: почему там работает dom/GetElement? где был создан элемент #mycanvas? - person 7yl4r; 16.04.2015
comment
Создание библиотек с зависимостями еще не отполировано. Посетите github.com/noflo/noflo-browser-app, чтобы создать собственный iframe. время выполнения, где вы можете загрузить d3 или любую другую библиотеку для построения диаграмм, которая вам нравится. Холст делался в настройках графика (значок шестеренки справа от поиска) превью содержимого html. Чтобы создать холст внутри графика, есть canvas/CreateCanvas и dom/AppendChild. - person forresto; 17.04.2015
comment
Ага! Спасибо за советы. Теперь все начинает обретать смысл. - person 7yl4r; 17.04.2015