Biblioteca javascript simple para dibujar diagramas/circuitos/gráficos de componentes propios (con nodos de entrada y salida) y sus conexiones

Tengo la tarea de hacer una aplicación web HTML simple en Javascript (Angular) para que los visitantes puedan hacer su propio diseño de diagrama de componentes (circuito, gráfico) y conexiones entre estos componentes . Así que estoy buscando una biblioteca Javascript (simple) para lograr eso en lugar de escribir todo desde cero.

Es como diseñar un circuito eléctrico pero bastante más simple porque no necesito ninguna simulación de la corriente eléctrica o el comportamiento electrónico de los componentes. así que prefiero ser una biblioteca simple que pueda dibujar bonitos objetos y conexiones.

Los componentes serán en realidad unos pocos dispositivos predefinidos que tienen un número definido de nodos de entrada y salida. De modo que el usuario puede colocar cualquier cantidad de componentes (dispositivos) en el lienzo y puede conectar la salida de un componente a la entrada de otro componente en el lienzo y viceversa. La conexión es solo una línea directa entre 2 nodos (1 entrada y 1 salida) y cada nodo puede tener un máximo de 1 conexión. Pero algo de lógica comercial puede ser escrita en código por mí.

La personalización de los componentes es necesaria porque tendré componentes predefinidos donde los puertos de entrada/salida deberían tener una posición exacta (pero puedo vivir sin eso).

Además, la conexión (cables) entre nodos (puertos de entrada/salida) no podría ser simplemente una conexión directa de línea, sino que trate de no cruzar otras líneas: sea inteligente o al menos pueda editar su dirección .

He encontrado 2 bibliotecas prometedoras hasta ahora:

  1. GoJS https://gojs.net/latest/samples/dynamicPorts.html
    https://gojs.net/latest/samples/dataFlow.html
    Los ejemplos parecen algo que podría usar

    • + pros buena documentación
    • + pros buena personalización
    • - contra uso comercial autorizado
    • - contras biblioteca bastante robusta
  2. SimcirJS https://kazuhikoarase.github.io/simcirjs/

    • + pros pequeña biblioteca
    • + pros uso comercial gratuito
    • - contra pequeña documentación
    • - contras mala personalización

¿Conoces otras bibliotecas de Javascript para lograr este objetivo? Las bibliotecas pequeñas, fáciles de usar y bien documentadas son muy bienvenidas.

Respuestas (1)

si alguien está interesado, finalmente encontré y elegí mxGraph https://github.com/jgraph/mxgraph .

es:

  • ventajas bien documentadas
  • licencia gratuita profesional
  • pros bueno personalizado

biblioteca para mis propósitos