Home

Awesome

BPMN-Plugin for Obsidian GitHub tag (latest by date) Release Obsidian Plugin Obsidian downloads

This plugin lets you view BPMN diagrams interactively in your Obsidian notes with an bpmn code-block. Furthermore, a BPMN modeler lets you edit your BPMNs directly in Obsidian. The plugin is based on the bpmn-js library.

NEW Feature: Token Simulation!

How to use (CodeBlock)

  1. Add a valid *.bpmn file to your vault
  2. Add the BPMN diagram to your note:
```bpmn
url: [[my-diagram.bpmn]]
```

Parameter

You can customize the view with the following parameters:

ParameterDescriptionValues
urlThe url of the *.bpmn file (required).Relative/Absolute path, or as "[[*.bpmn]]" markdown link.
heightThe height of the rendered canvas.[200..1000]
opendiagramShow a link to the *.bpmn file.True/False
showzoomShow the zoom buttons below the canvas.True/False
enablepanzoomEnable pan and zoom.True/False
zoomSet the zoom level. Default is 'fit-viewport'.0.0 - 10.0
xSet the x coordinate, if a zoom value is set.0 - ... (default: 0)
ySet the y coordinate, if a zoom value is set.0 - ... (default: 0)
forcewhitebackgroundForce a white background.True/False

Example

Example

How to edit the BPMN

Just open the BPMN file in your obsidian vault and the BPMN will be editable in fullscreen mode.

Features

Install ..

.. automatically in Obsidian

  1. Go to Community Plugins in your Obsidian Settings and disable Safe Mode
  2. Click on Browse and search for "BPMN"
  3. Click install
  4. Toggle the plugin on in the Community Plugins tab

.. manually from this repo

  1. Download the latest release *.zip file.
  2. Unpack the zip in the .obsidan/plugins folder of your obsidian vault

How to dev

  1. Clone this repo into the plugin folder of a (non-productive) vault (.obsidian/plugins/)
  2. npm i
  3. npm run dev
  4. Toggle the plugin on in the Community Plugins tab

Donate

<a href='https://ko-fi.com/joleaf' target='_blank'><img height='35' style='border:0px;height:46px;' src='https://az743702.vo.msecnd.net/cdn/kofi3.png?v=0' border='0' alt='Buy Me a Coffee at ko-fi.com' />