DEMOS
DOCS
FEATURES
DOWNLOAD
PURCHASE
CONTACT
BLOG

jsPlumb Toolkit

The jsPlumb Toolkit is a wrapper around the open source jsPlumb library that provides several key pieces of functionality:

The Toolkit version of jsPlumb has the Community version as a dependency. The current version of the Toolkit is 1.4.5, which bundles version 2.4.3 of the Community edition.

Getting Started

The best place to get started familiarising yourself with the architecture of the Toolkit is to read through the documentation on one of the example applications - either the Database Visualizer or the Flowchart Designer. Then, with your licensed copy of the Toolkit, you can use Grunt to create a clone of one of these apps and start hacking away.

You can also use Grunt to create an empty application if you'd prefer to start with a basic skeleton.

Alternatively, you might like to start with the documentation. The Data Model and Basic Concepts pages are the best places to start looking around. In a nutshell, the Toolkit uses a directed graph as its core data structure. Every app that has a need for jsPlumb - which is to say a need for the ability to connect entities - can be thought of in terms of a directed (or undirected) graph.

jsPlumb Community Edition

The Toolkit edition is a wrapper around the Community Edition, and while most direct interaction with the Community edition of jsPlumb is abstracted for you, settings related to UI appearance are generally piped straight through to the underlying Community edition used to render your content.

These pages are recommended reading:

  • Basic Concepts - Gives you a primer on the basic UI types used in the Community Edition. When rendering content in the Toolkit you will want to be aware of the different types available and how they can be configured.
  • Configuring Defaults - Explains the default settings available to jsPlumb. These can be used when rendering content in the Toolkit.
  • Styling via CSS - You will almost certainly want to read this page. It shows you how you can use CSS to style the jsPlumb view.

...in fact it is recommended to read all of the Community edition documentation, just to familiarise yourself, but these pages will cover the most important things.