Node.js API для создания & преобразования интерактивных диаграмм

Библиотека с открытым исходным кодом для Node.js, позволяющая преобразовывать текст в диаграмму, а также управлять различными типами диаграмм в среде Node.js.

Что такое библиотека Pintora?

Пинтора упрощает создание диаграмм. Этот гибкий инструмент на JavaScript позволяет без усилий преобразовывать текст в диаграммы, будь то работа в браузере или Node.js. Вдохновлённый Mermaid.js и PlantUML, Пинтора предоставляет надёжный и простой в использовании метод создания диаграмм. Он бесшовно интегрируется в различные среды разработки, делая его универсальным вариантом для разных проектов. Hikerpig разработал библиотеку Pintora, чтобы помогать создавать разнообразные диаграммы, такие как блок‑схемы, диаграммы последовательностей и диаграммы классов. Если вы разработчик или технический писатель, желающий добавить диаграммы в свои документы, презентации или технические спецификации, этот инструмент для вас. Что делает эту библиотеку особенной, так это её способность помогать вам создавать пользовательские визуализации с широким набором параметров настройки.

С помощью библиотеки Pintora вы можете без усилий настраивать цвета, шрифты, анимацию и другие элементы, чтобы создавать визуализации, которые не только эстетически привлекательны, но и соответствуют вашему бренду и эффективно передают ваше сообщение. Она меняет подход разработчиков программного обеспечения к созданию удивительных визуализаций данных. Это открытый исходный код, который регулярно обновляется, постоянно улучшаясь и предоставляя помощь сообщества. Ее простой синтаксис легко понять и использовать, что делает её подходящей для людей с разным уровнем технических навыков. Вы можете персонализировать внешний вид диаграмм, изменяя цвета, формы и другие визуальные характеристики в соответствии с вашими потребностями. Библиотека Pintora является популярным выбором для многих, желающих улучшить визуализацию данных, благодаря широкому набору функций, удобному API и современному дизайну.

Previous Next

Начало работы с Pintora

Рекомендуемый способ установки библиотеки Pintora — использование NPM. Пожалуйста, используйте следующую команду для беспроблемной установки.

Установить Pintora через NPM

 npm install pintora 

Создание диаграммы последовательности в Node.js

Библиотека Pintora с открытым исходным кодом очень проста в использовании, предлагая бесшовный способ преобразования текстовых описаний в яркие диаграммы внутри приложений Node.js. Всего лишь с несколькими строками кода разработчики могут создавать и управлять диаграммами последовательностей с помощью библиотеки Pintora. Диаграмма последовательности иллюстрирует, как объекты взаимодействуют в определённом порядке. Ниже приведён пример, где определена диаграмма последовательности, демонстрирующая взаимодействие двух участников. Синтаксис задаёт сообщения, обменянные между ними, и Pintora генерирует соответствующий SVG внутри приложений Node.js.

Как создать диаграмму последовательности в приложениях Node.js?

const { renderToSvg } = require('pintora');

const sequenceDiagramDefinition = `
sequenceDiagram
    participant Alice
    participant Bob
    Alice->>Bob: Hello Bob, how are you?
    Bob-->>Alice: I am good, thanks!
`;

// Render the sequence diagram to SVG
const svg = renderToSvg(sequenceDiagramDefinition);

// Output the SVG
console.log(svg);
 

Настройка диаграмм в приложениях Node.js

Библиотека Pintora полностью поддерживает широкие возможности настройки различных типов диаграмм. Библиотека упрощает разработчикам работу с различными элементами диаграмм, такими как слои, шаблоны, страницы, фигуры и соединители, внутри их собственных приложений Node.js. Они могут изменять цвета, формы и другие визуальные элементы в соответствии со своими потребностями. Ниже приведён пример, показывающий, как разработчики могут настраивать блок‑схему с помощью библиотеки Node.js.

Как настроить блок-схему в приложениях Node.js?

const { renderToSvg } = require('pintora');

const customizedFlowchartDefinition = `
flowchart TD
    style A fill:#f9f,stroke:#333,stroke-width:4px;
    style B fill:#bbf,stroke:#333,stroke-width:4px;
    A[Start] --> B{Is it working?}
    B -->|Yes| C[Great]
    B -->|No| D[Fix it]
    D --> A
`;

// Render the customized flowchart to SVG
const svg = renderToSvg(customizedFlowchartDefinition);

// Output the SVG
console.log(svg);

 

Создание и редактирование диаграммы классов в Node.js

Открытая библиотека Pintora предоставляет полный набор функций для создания и управления диаграммами классов в приложениях Node.js. Диаграммы классов используются для описания структуры системы, показывая её классы, атрибуты и отношения. Следующий пример демонстрирует, как создать диаграмму классов. Диаграмма определяет два класса, Animal и Dog, вместе с их атрибутами и методами. Класс Dog наследуется от класса Animal, что обозначено нотацией <|--.

Как создать диаграмму классов в приложениях Node.js?

const { renderToSvg } = require('pintora');

const classDiagramDefinition = `
classDiagram
    class Animal {
        +String name
        +int age
        +void eat()
    }
    class Dog {
        +String breed
        +void bark()
    }
    Animal <|-- Dog
`;

// Render the class diagram to SVG
const svg = renderToSvg(classDiagramDefinition);

// Output the SVG
console.log(svg);

 
 Русский