1. Productos
  2.   Diagrama
  3.   Node.js
  4.   Pintora
 
  

API de Node.js para crear y convertir diagramas interactivos

Biblioteca de Node.js de código abierto para convertir texto a diagrama y gestionar varios tipos de diagramas dentro del entorno Node.js.

¿Qué es la biblioteca Pintora?

Pintora simplifica la creación de diagramas. Esta herramienta flexible de JavaScript le permite convertir texto en diagramas sin esfuerzo, ya sea que esté trabajando en un navegador o en Node.js. Inspirado en Mermaid.js y PlantUML, Pintora ofrece un método fiable y fácil de usar para crear diagramas. Se integra sin problemas en diferentes entornos de desarrollo, lo que lo convierte en una opción versátil para varios proyectos. Hikerpig desarrolló la biblioteca Pintora para ayudar a crear una variedad de diagramas, como diagramas de flujo, diagramas de secuencia y diagramas de clases. Si es desarrollador o redactor técnico y desea añadir diagramas a sus documentos, presentaciones o especificaciones técnicas, esta herramienta es para usted. Lo que hace especial a esta biblioteca es su capacidad para ayudarle a crear visualizaciones personalizadas con una amplia gama de opciones de personalización.

Usando la Biblioteca Pintora, puedes ajustar sin esfuerzo colores, fuentes, animaciones y otros elementos para diseñar visualizaciones que no solo son visualmente atractivas, sino que también coinciden con tu marca y transmiten tu mensaje de manera eficaz. Está cambiando la forma en que los desarrolladores de software crean increíbles visualizaciones de datos. Es de código abierto y se actualiza regularmente para mejorarla continuamente y ofrecer ayuda de la comunidad. Su sintaxis simple es fácil de comprender y usar, lo que la hace adecuada para personas con diferentes habilidades técnicas. Puedes personalizar el aspecto de tus diagramas cambiando colores, formas y otras características visuales para adaptarlas a tus necesidades. La Biblioteca Pintora es una opción popular para muchas personas que desean mejorar sus visualizaciones de datos, gracias a su amplia gama de funciones, una API fácil de usar y un diseño moderno.

Previous Next

Primeros pasos con Pintora

La forma recomendada de instalar la Biblioteca Pintora es usando NPM. Por favor, utiliza el siguiente comando para una instalación sin problemas.

Instalar Pintora vía NPM

 npm install pintora

Crear diagrama de secuencia en Node.js

La biblioteca de código abierto Pintora es muy fácil de manejar, ofreciendo una forma fluida de transformar descripciones textuales en diagramas vívidos dentro de aplicaciones Node.js. Con solo un par de líneas de código, los desarrolladores pueden crear y gestionar diagramas de secuencia usando la biblioteca Pintora. Un diagrama de secuencia ilustra cómo los objetos interactúan en una secuencia particular. El siguiente ejemplo muestra cómo se define un diagrama de secuencia para ilustrar la interacción entre dos participantes. La sintaxis especifica los mensajes intercambiados entre ellos, y Pintora genera el SVG correspondiente dentro de aplicaciones Node.js.

¿Cómo crear un diagrama de secuencia dentro de aplicaciones 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);

Personalizar diagramas dentro de aplicaciones Node.js

La biblioteca Pintora admite completamente la amplia personalización de varios tipos de diagramas. La biblioteca facilita a los desarrolladores de software operar diversos elementos de diagramas, como capas, maestros, páginas, formas y conectores dentro de sus propias aplicaciones Node.js. Pueden modificar colores, formas y otros elementos visuales para adaptarlos a sus necesidades. Aquí hay un ejemplo que muestra cómo los desarrolladores pueden personalizar un diagrama de flujo usando la biblioteca Node.js.

¿Cómo personalizar un diagrama de flujo dentro de aplicaciones 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);

Crear y editar diagramas de clase dentro de Node.js

La biblioteca de código abierto Pintora ha proporcionado funcionalidad completa para crear y gestionar diagramas de clases dentro de aplicaciones Node.js. Los diagramas de clases se utilizan para describir la estructura de un sistema mostrando sus clases, atributos y relaciones. El siguiente ejemplo muestra cómo crear un diagrama de clases. El diagrama define dos clases, Animal y Perro, junto con sus atributos y métodos. La clase Perro hereda de la clase Animal, como indica la notación <|--.

¿Cómo crear un diagrama de clases dentro de aplicaciones 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);
 Español