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.
If you liked this post, you should subscribe to the blog feed , mailing list , or facebook page and follow my thoughts on twitter about software development or web design and social media . Check also my book on model-driven engineering .
Be sociable, share!