Javascript Diagram библиотека

JavaScript Diagram - это готовая библиотека для создания любых видов диаграмм с возможностью автоматически размещать древовидные данные , а также упорядочивать данные с циклическими зависимостями. В Diagram можно определять форму блоков и их стилистику, а также настраивать связи между ними.

diagram
1 2 3 4

1. Расположение блоков

  • Автоматическое размещение в соответствии с указанными связями
  • Гибкая настройка алгоритма автоматической расстановки
  • Размещение по заданным координатам

2. Стилизация блоков

  • С помощью CSS
  • С помощью стилевых свойств блоков

3. Выбор формы блоков

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

4. Настройка связей между блоками

  • Стилизация связей через CSS и стилевые свойства
  • Разные типы стрелок для связей
  • Отрисовка по указанным координатам

Преимущества Webix JavaScript Diagram

Интеграция: jQuery, Angular, React, Vue.js, Backbone

Соответствует требованиям Секции 508

Поддерживается во всех современных браузерах

Удобная стилизация с помощью CSS

Работает на устройствах с сенсорным экраном

Быстрая и плавная навигация

Расширенные функции JS Diagram для ваших веб-приложений на JavaScript

features-1

  • Возможность задавать автоматическую ширину или высоту блоков.

features-2

  • Возможность выбрать форму блоков диаграммы из предложенного списка, а также добавить свою форму.

features-3

  • Возможность стилизовать блоки (цвета фона, поворот, стиль текста и выравнивание и т.д.).

features-4

  • Возможность задавать разные типы связей, стилизовать линии, а также отрисовать их по строго заданным координатам.

features-5

  • Возможность создавать блоки для древовидных диаграмм.

features-6

  • Возможность выполнять все операции CRUD (создание, чтение, обновление, удаление) с элементами данных.

features-7

  • Возможность отфильтровать данные блоков диаграммы.

features-8

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

JavaScript Diagram Gallery live demo

Webix Diagram Library licensing