Arrow icon
See all demos

Petri Nets

A Petri net is a mathematical modeling language describing distributed systems. In this demo, we will look at such a distributed system described by a Petri net to illustrate data synchronization and transition.
Demo instructions
Manipulate places and transitions or adjust the arcs that connect them.

Made with JointJS+

The source code of this demo is available as part of the JointJS+ commercial license. Don't have a license yet? Start a trial and use the source code of this and many other demos for free, with no obligations, for 30 days.

Compatible with:

ReactAngularVueSvelteHTML5Salesforce Lightning

Made with JointJS+

All features required to build this demo are included in the commercial JointJS+ package. Don't have a license yet? Start a trial and build professional applications with ease.

Compatible with:

ReactAngularVueSvelteHTML5Salesforce Lightning

Made with JointJS

The source code of this demo is available in the JointJS open-source library which helps developers create simple visual applications in less time.

Compatible with:

ReactAngularVueSvelteHTML5Salesforce Lightning

Made with JointJS

All features required to build this demo application are included in our open-source library, JointJS. Download the package and create basic visual applications in no time.

Compatible with:

ReactAngularVueSvelteHTML5Salesforce Lightning

The role of JointJS in building an application containing a Petri Net

JointJS, a powerful diagramming library, helps developers and companies of any size build advanced visual applications and No-Code/Low-Code tools. It provides a wealth of ready-made demos and a wide range of prebuilt features that make creating applications containing diagramming studios such as Petri net a breeze.

We equip developers with all the needed features to save time and focus their energy elsewhere such as transitions and Petri net shapes.

New to this topic? Learn more about Petri net 👇

What is a Petri Net?

As stated above, Petri net is a mathematical modeling language describing distributed systems. It has a precise mathematical definition and graphical notation (like the one you see in the example above), which distinguishes it from other concepts like UML class diagrams or BPMN. The most common uses we will explore below include modeling artificial systems such as manufacturing systems and communication protocols.

Petri Net basics

We have already touched on the basic elements of a Petri net: places (represented by the circle) and transitions (represented by the rectangle). These are connected by arcs that allow data (tokens) to be synchronized based on certain rules. There are two types of places: input and output. Input places are those from which arcs lead to the transition, output places are, as expected, those to which arcs lead from the transition.

Places can contain any number of tokens (represented by dots) that can be fired from input places to output places via transitions, if and only if the transition is enabled – this happens when there are enough tokens in the input places. When the transition fires, it expends the required tokens from the input places and generates them at the output places. This process changes the state of the Petri net.

Common uses of Petri net

As Matthew O'Brien from the University of Pittsburgh says in his work, “Petri net can be used to describe and study information processing systems of various types”. There are many use cases where this modeling language can be of value, including:

  • data flow mapping,
  • communication protocol design,
  • modeling synchronisation mechanisms,
  • representation of state machines.

To learn more about how Petri net can be used, we recommend reading O'Brien's presentation summarizing the most common use cases.

Ready to take the next step?

Modern development is not about building everything from scratch. The JointJS team equips you with plenty of ready-to-use demo apps that can serve as a boilerplate and radically reduce your development time. Visit our Github profile to get the source code of the Petri net demo and learn from other diagramming enthusiasts.

Speed up your development with a powerful library