JointJS is a complete toolkit for building fully interactive diagramming and modeling applications that run in modern browsers. JointJS core library is open source. A commercial toolkit, Rappid, is available, that implements all the aspects of a diagramming application. A full feature set, documentation, the library itself and other useful information can be found on our site at http://jointjs.com. A sample demo application is located at http://jointjs.com/rappid.
JointJS follows MVC architecture design and the programmer usually works with models, not views (as it is with graphics libraries). These models (elements and links) build up a graph which is rendered on the screen using browser native SVG (but it is possible to use HTML inside elements too). When the user interacts with the SVG document, models are updated accordingly. By listening to events triggered on the graph, the programmer can respond to all changes and perform custom actions. Graphs can be serialized to/from JSON format with single function call.
Ready-to-use shapes are available for well-known diagrams (ERD, Org chart, FSA, UML, PN, DEVS, and others) and new shapes can be either defined in a declarative fashion reusing existing SVG documents or programmatically rendered.
Commercial plugins implement a wide range of UI components such as Stencil (element palette), Command manager (undo/redo), Selection, Clipboard, Halo (element tools), Inspector, Paper scroll & pan, auto layouts and much more. We’re now finishing testing for our Channel plugin that synchronizes graphs between server and client (possibly multiple clients) which effectively implements real-time collaboration.
ICREA Research Professor at Internet Interdisciplinary Institute (UOC). Leader of the SOM Research Lab focusing on the broad area of systems and software engineering