Gojs React screenshot

Gojs React

Updated: 7 May 2025
249 Stars

A set of React components to manage GoJS Diagrams, Palettes, and Overviews

Overview

The gojs-react package by Northwoods Software provides an intuitive way to integrate GoJS diagrams with React applications. By introducing tailored components like ReactDiagram, ReactPalette, and ReactOverview, it streamlines the process of implementing dynamic and interactive visualizations. This integration is beneficial for developers looking to leverage the powerful capabilities of GoJS while maintaining the robust state management and component-driven architecture that React offers.

This package aims to simplify the setup of diagrams by providing examples and clear guidelines for usage. It emphasizes the easy installation process via NPM or CDN and outlines essential component properties that allow for customization and flexibility in creating complex visual representations.

Features

  • Ease of Installation: Integrate gojs-react easily through NPM or use it via CDN, ensuring quick setup for your React applications.

  • Component Diversity: Provides three essential components - ReactDiagram, ReactPalette, and ReactOverview - to address various diagramming needs.

  • Custom Initialization: The initDiagram, initPalette, and initOverview props allow users to define custom functions for initializing diagrams, enhancing control over the setup process.

  • CSS Class Support: Offers the divClassName prop for adding custom CSS classes, ensuring easy styling and layout alignment within your application.

  • Flexible Data Handling: Through optional props like nodeDataArray, linkDataArray, and modelData, users can manage complex data structures effortlessly while ensuring performance.

  • State Management: The skipsDiagramUpdate prop enhances performance by allowing components to bypass updates when necessary, optimizing render cycles.

  • Model Change Notifications: With the onModelChange prop, get immediate feedback when GoJS transactions complete, promoting responsive and interactive UIs.

By combining these features, gojs-react makes it easier for developers to create feature-rich, interactive diagrams in their React applications.