30 open-source projects similar to projectstorm/react-diagrams, ranked by how many features they have in common. Compare stars, activity and what each one does to find the best React Diagrams alternative.
This project is a React-based framework for constructing interactive, node-based visual interfaces. It provides a platform for building canvases where users define, connect, and organize logical processes, data pipelines, or complex workflows through a graphical interface. By utilizing a modular component architecture, it enables the development of low-code environments, visual programming tools, and interactive diagramming applications. The framework distinguishes itself through a declarative approach where state changes automatically synchronize with the visual representation of nodes and e
LogicFlow is an SVG-based flowchart editing framework and visual graph editor used for building customizable business process diagrams. It serves as a customizable diagramming engine for rendering business process models, entity relationship diagrams, and unified modeling language charts. The system is characterized by a plugin-based architecture that allows developers to define specialized graphical elements and register pluggable modules. A distinctive feature is its overlay system, which positions standard HTML components on top of the SVG canvas to create interactive menus and control pan
GoJS is a JavaScript diagramming library and canvas-based visualization engine used to build interactive flowcharts, organizational charts, and network diagrams. It functions as a data-driven framework that binds JavaScript data models to visual elements, enabling bidirectional synchronization between the underlying data and the graphical representation. The library features a comprehensive graph layout engine capable of automatically arranging nodes into trees, grids, circles, or force-directed layouts. It distinguishes itself through a template-based system for generating visual parts and a
Joint is a JavaScript library for building interactive visual diagrams and flowcharts using Scalable Vector Graphics. It provides a programmable environment for creating an interactive SVG canvas with integrated support for zooming, panning, and touch gesture controls. The framework includes a component system for defining custom shapes and programmatic elements within a vector-based coordinate system. It features a JSON-based diagram serializer for saving and loading diagram states, as well as automated layout algorithms and relationship mapping to render nodes and edges. The library covers
Diagram Maker is a web-based library designed for building interactive graph visualization and data modeling tools. It provides a framework for rendering node and link structures, allowing users to create custom editing environments where complex data relationships can be visualized and manipulated directly in the browser. The library utilizes a modular, plugin-driven architecture that enables developers to extend the core editing functionality to meet specific requirements without altering the underlying source code. It manages the application state through a centralized, immutable store, en
Cytoscape.js is a JavaScript library designed for rendering interactive node-link diagrams and analyzing complex network structures directly within a web browser. It functions as a comprehensive framework for building responsive graph interfaces, providing the tools necessary to visualize relational datasets and manage hierarchical data models. The library distinguishes itself through a modular architecture that supports custom layout algorithms and rendering styles, allowing for the integration of physics-based engines to organize complex network structures automatically. It utilizes an even
This library is a declarative React component toolkit for constructing interactive, node-based diagramming interfaces and flow charts. It provides the foundational UI elements required to render draggable nodes and scalable vector graphics paths within a web browser, enabling the creation of complex visual editors and data flow representations. The library distinguishes itself through a strictly stateless architecture that relies on external state management. By utilizing a controlled input pattern and component injection, it decouples diagram logic from data storage, allowing developers to m
Vue Flow is a TypeScript library for building interactive node-based editors and flowcharts. It provides the core infrastructure for creating diagrams where users can drag, select, and connect nodes with edges, supporting pan and zoom navigation of the canvas. The library offers extensive control over graph behavior and appearance, including the ability to customize connection lines, define custom edge types, and configure zoom constraints and viewport defaults. It includes built-in components like a minimap for navigation, zoom controls, and a fit-view button, along with features for node re
GulfOfMexico is a framework for building interactive, node-based visual programming environments within web browsers. It provides the necessary components to construct directed graph editors where users define application logic and data processing pipelines by connecting visual nodes on a coordinate-based canvas. The library enables the creation of drag-and-drop interfaces that synchronize visual representations with underlying functional data flows. By mapping input and output ports to specific behaviors, developers can build environments that allow for the construction of complex workflows
This project is an AI-powered visual canvas and collaborative whiteboard framework. It functions as a customizable vector drawing engine and a tool for converting hand-drawn interface sketches and wireframes into functional code using artificial intelligence. The system distinguishes itself through the integration of AI agents that can read, modify, and generate visual diagrams directly on the canvas. It also provides a node-based workflow editor for building automation pipelines and data processing flows by connecting multimodal components. The platform covers a broad range of capabilities,
Flowy is a JavaScript library designed for building interactive, drag-and-drop flowchart interfaces. It enables the creation of canvas-based environments where users can arrange blocks to design custom logic sequences, decision trees, and visual process maps. The library provides a structured approach to diagramming by organizing elements into a hierarchical parent-child tree. It features coordinate-based snapping logic to ensure blocks automatically align into organized layouts during user interaction. To support complex system configurations, the tool includes event-driven callback hooks th
Gephi is an open-source desktop application for visualizing and analyzing large-scale network graphs. It provides an interactive platform for exploring complex relational data, combining hardware-accelerated rendering with real-time layout controls and a plugin-based modular architecture. The platform distinguishes itself through its ability to handle networks of up to 100,000 nodes and 1,000,000 edges using a custom OpenGL rendering engine, enabling smooth real-time interaction. It includes a force-directed layout engine with real-time adjustment, a dynamic filter pipeline for selecting node
Beautiful React Diagrams is a component library for building interactive node-based visualizations and flowcharts within React applications. It provides a framework for rendering custom visual schemas where nodes and links are managed through a centralized state, ensuring a single source of truth for complex layouts. The library distinguishes itself through a flexible rendering pattern that allows for the injection of custom user-defined components into node and port placeholders. It enforces structural integrity by validating connections against predefined schemas and provides granular contr
jsoncrack.com is a JSON data visualization tool and interactive graph viewer that transforms JSON and other structured data formats into visual tree diagrams. It functions as a data syntax validator and a structured data converter for transforming information between JSON, YAML, XML, and CSV formats. The project includes a JSON schema generator that produces schema definitions and language-specific type definitions based on provided structured data. These capabilities automate type safety and ensure data integrity through schema generation. The tool provides broader capabilities for structur
vis is a JavaScript data visualization library used to render interactive networks, timelines, and graphs directly in the web browser. It functions as a relational data mapper and browser-based charting tool, turning complex structured data into dynamic visual patterns to expose entity relationships. The library provides specialized tools for force-directed network graphs, where relational data is represented as interactive nodes and edges. It also includes an interactive timeline component for plotting chronological events and time intervals on a scalable temporal axis. The project covers b
Freeplane is a Java-based mind mapping software and knowledge management system used to create hierarchical visual maps and interconnect ideas. It serves as a visual information organizer that transforms text-based notes into navigable spatial maps to facilitate non-linear thinking processes. The application features a swing-based visual canvas for rendering interactive concept maps and complex node-based layouts. It utilizes an XML-based document organizer to serialize map structures and node attributes into hierarchical files for persistent storage. The tool covers several core capability
React Grid Layout is a draggable and resizable grid system for React that organizes components into a coordinate-based layout. It functions as a responsive layout manager and a serialized grid state engine, providing the tools necessary to create user-customizable workspaces where interface elements can be moved and resized. The system distinguishes itself through breakpoint-driven layout mapping, which adjusts grid configurations based on container width. It utilizes a serialized state model to convert spatial positions and dimensions into data formats for saving and restoring user layouts,
Pentaho Kettle is an enterprise ETL data integration platform designed to extract, transform, and load data between disparate sources and target databases. It functions as a metadata-driven orchestrator that utilizes a visual workflow designer to create and manage complex sequences of data tasks and transformation pipelines. The system is distinguished by its distributed data processing engine, which executes workloads across clusters of server nodes to increase throughput. It employs a plugin-based architecture, allowing the platform to be extended via external JAR files to provide connectiv
Drawnix is a digital whiteboarding and visual diagramming application centered around an infinite canvas. It provides a workspace for freeform sketching, interactive brainstorming, and the creation of structured visual documentation. The platform distinguishes itself by supporting both manual drawing and the automatic generation of diagrams from markup text and mermaid syntax. It utilizes a plugin architecture that allows for the integration of custom modules to extend drawing behaviors and application features. The toolset includes brush-based annotations, image insertion, and a coordinate
Unit is a visual programming system and graph-based integrated development environment used to build functional software by connecting state machines and primitive operations. It serves as a node-based logic editor and state machine orchestrator that transforms visual program specifications into standalone JavaScript files for deployment as static websites. The system distinguishes itself through a visual compiler that can render program bundles into active websites and perform bi-directional graph inspection, allowing a live rendered application to be converted back into its original visual
gridstack.js is a JavaScript grid layout library and responsive dashboard framework used to create interactive interfaces with draggable and resizable elements. It functions as a drag-and-drop layout manager and a JSON-serializable layout engine, allowing user-defined interface states to be persisted and restored. The library distinguishes itself through a touch-enabled grid interface and a responsive system that automatically adjusts item placement based on screen breakpoints. It features a collision-based layout engine that manages overlapping coordinates to shift or swap elements, alongsid
vue-grid-layout is a draggable and resizable grid system for Vue.js that enables users to customize the placement and size of interface elements. It functions as a dynamic widget orchestrator and a state-persistent layout manager, allowing for the creation of customizable dashboard interfaces where components can be arranged and sized according to user preference. The system operates as a responsive dashboard framework that automatically adapts grid arrangements based on viewport size and supports right-to-left text directions. It provides the ability to capture and serialize grid positions a
GraphQL Voyager is a schema visualizer and data model explorer that provides an interactive graph representation of a GraphQL API. It serves as a documentation tool for inspecting types and fields by transforming schema introspection data into a visual interface. The tool maps the relationships between different types and fields, allowing for the analysis of complex data models and their connections. Users can filter the visual representation to remove deprecated fields or wrapper classes and use a dedicated information panel to examine technical specifications for specific data types.
Lorien is a cross-platform vector drawing application built with Godot. It functions as a vector graphics editor and a pressure-sensitive sketchbook for creating freehand drawings and geometric shapes. The application features an infinite canvas whiteboard with a boundless workspace, infinite zoom, and coordinate grids. It supports drawing tablets through pressure sensitivity to vary stroke thickness and opacity, and it includes a system for exporting drawings into the standardized SVG format. The software provides tools for vector sketch creation and brush stroke editing, managed via a comm
Cayley is a graph database engine designed for storing and querying interconnected data using a quad-based data model. It functions as an RDF quad store, managing information through subjects, predicates, objects, and labels. The system features a modular graph store architecture with pluggable backends, allowing it to swap between in-memory storage and various external persistent databases. It includes a GraphQL-inspired API and a dedicated data visualizer for the interactive exploration of nodes and edges. Query capabilities cover bidirectional path traversal and multi-syntax execution usi
ComfyUI-LTXVideo is a generative framework and ComfyUI custom node extension for synthesizing high-fidelity video. It utilizes a latent diffusion and transformer-based system to create cinematic clips from text, image, and audio inputs, providing a modular interface for precise control over subject behavior and temporal consistency. The tool distinguishes itself with production-grade capabilities, including the generation of High Dynamic Range video in linear formats such as ARRI LogC3. It supports multimodal synchronization for audio-driven animation and lip-syncing, and allows for the creat
Golden Layout is a framework-agnostic UI container and web window layout manager designed to organize application interfaces into a flexible grid of draggable and resizable multi-pane windows. It functions as a hierarchical grid system that arranges page elements into a tree of nested rows and columns to create complex professional interfaces. The system acts as a multi-window workspace orchestrator, allowing components to be detached from the main layout into independent native browser windows. It also serves as a serializable layout engine that captures the arrangement of user interface com
mxgraph is a client-side graph visualization tool and JavaScript diagramming library. It functions as an SVG-based drawing framework used to create and render interactive diagrams directly within a web browser. The library enables the development of custom diagramming tools, such as network maps and flowcharts, by providing the means to draw and manipulate visual data structures. It focuses on client-side data visualization, allowing for the representation of complex node and edge relationships without requiring server-side rendering.
Dockview is a UI framework for building complex, desktop-like interfaces featuring dockable layout components, interactive tab grouping, and a cross-platform panel system. It provides the tools necessary to create environments with draggable tabs, split-views, and customizable panel arrangements. The system is distinguished by its multi-window layout manager, which allows panels to be detached into separate browser windows for multi-monitor setups. It further supports a state-persistent architecture that saves and restores the exact position and configuration of views across different user se