1. Продукти
  2.   Діаграма
  3.   JavaScript
  4.   JS-Sequence-Diagrams
 
  

Open Source JavaScript API для діаграм послідовності UML

Перетворіть простий текст на діаграму послідовності UML за допомогою безкоштовної бібліотеки JavaScript з відкритим кодом.

JS-Sequence-Diagrams дають розробникам програмного забезпечення можливість генерувати діаграми послідовностей UML із простого тексту через бібліотеку JavaScript з відкритим кодом. Діаграма послідовності показує об’єкти та класи, залучені до розробки, і порядок повідомлень, якими обмінюються об’єкти. Бібліотека використовує Jison для аналізу тексту та Snap.svg для малювання зображення.

Він малює прості діаграми послідовності SVG із текстового представлення діаграми. Бібліотека містить два стилі для візуалізації діаграми: «звичайний» і «намальований від руки». Існує кілька класів CSS для налаштування діаграм SVG.

Previous Next

Початок роботи з діаграмами послідовності JS

Рекомендований спосіб встановлення JS Sequence Diagrams — запустити bower; встановіть bramp/js-sequence-diagrams і додайте наведені нижче скрипти:

Встановіть JS Sequence Diagrams через bower

 <script src="/{{ bower directory }}/bower-webfontloader/webfont.js" />

<script src="/{{ bower directory }}/snap.svg/dist/snap.svg-min.js" />

<script src="/{{ bower directory }}/underscore/underscore-min.js" />

<script src="/{{ bower directory }}/js-sequence-diagrams/build/sequence-diagram-min.js" />

також імпортуйте CSS, якщо ви плануєте використовувати намальовану тему:

Створення діаграм послідовності UML із простого тексту

Бібліотека діаграм послідовності JS дозволяє розробникам програмного забезпечення генерувати діаграми послідовності UML із простого тексту. Бібліотека дозволяє додавати назву діаграми та розміщувати нотатки для кількох учасників. Останній випуск використовує Snap.svg разом із Raphaël для малювання діаграм. Snap.svg є чистою реалізацією SVG і дозволяє використовувати стилі CSS, кращу підтримку шрифтів, анімацію тощо.

Експорт діаграми у SVG через JavaScript API

JS Sequence Diagrams надає функції для експорту діаграм у SVG через API JavaScript з відкритим кодом. Після створення діаграми API дозволяє користувачам завантажити її у форматі SVG у вибране місце. JS Sequence Diagrams містить кілька важливих класів CSS, які можна застосувати до діаграми SVG за допомогою snap.svg. Він містить класи послідовності для застосування до основного тегу SVG, клас заголовка для заголовка діаграми, клас актора для застосування до акторів, клас примітки для всіх приміток і клас сигналу для застосування до сигналів.

 Українська