Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/joleaf/obsidian-bpmn-plugin
A small BPMN viewer for obsidian notes.
https://github.com/joleaf/obsidian-bpmn-plugin
Last synced: 3 months ago
JSON representation
A small BPMN viewer for obsidian notes.
- Host: GitHub
- URL: https://github.com/joleaf/obsidian-bpmn-plugin
- Owner: joleaf
- License: mit
- Created: 2022-11-12T15:22:06.000Z (about 2 years ago)
- Default Branch: main
- Last Pushed: 2024-08-27T07:03:14.000Z (5 months ago)
- Last Synced: 2024-08-27T08:25:43.974Z (5 months ago)
- Language: TypeScript
- Size: 956 KB
- Stars: 24
- Watchers: 2
- Forks: 0
- Open Issues: 6
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Funding: .github/FUNDING.yml
- License: LICENSE
Awesome Lists containing this project
- awesome-bpmn-io - Obsidian BPMN Plugin - A BPMN Viewer / Editor based on bpmn-js for [Obsidian](https://obsidian.md/) (Apps)
README
# BPMN-Plugin for Obsidian [![GitHub tag (latest by date)](https://img.shields.io/github/v/tag/joleaf/obsidian-bpmn-plugin)](https://github.com/joleaf/obsidian-bpmn-plugin/releases) [![Release Obsidian Plugin](https://github.com/joleaf/obsidian-bpmn-plugin/actions/workflows/release.yml/badge.svg)](https://github.com/joleaf/obsidian-bpmn-plugin/actions/workflows/release.yml) [![Obsidian downloads](https://img.shields.io/badge/dynamic/json?logo=obsidian&color=%238b6cef&label=downloads&query=%24%5B%22bpmn-plugin%22%5D.downloads&url=https%3A%2F%2Fraw.githubusercontent.com%2Fobsidianmd%2Fobsidian-releases%2Fmaster%2Fcommunity-plugin-stats.json)](https://obsidian.md/plugins?id=bpmn-plugin)
This plugin lets you view BPMN diagrams interactively in your [Obsidian](https://www.obsidian.md) 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](https://github.com/bpmn-io/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:
| Parameter | Description | Values |
|----------------------|------------------------------------------------|-----------------------------------------------------------|
| url | The url of the *.bpmn file (required). | Relative/Absolute path, or as "[[*.bpmn]]" markdown link. |
| height | The height of the rendered canvas. | [200..1000] |
| opendiagram | Show a link to the *.bpmn file. | True/False |
| showzoom | Show the zoom buttons below the canvas. | True/False |
| enablepanzoom | Enable pan and zoom. | True/False |
| zoom | Set the zoom level. Default is 'fit-viewport'. | 0.0 - 10.0 |
| x | Set the x coordinate, if a zoom value is set. | 0 - ... (default: 0) |
| y | Set the y coordinate, if a zoom value is set. | 0 - ... (default: 0) |
| forcewhitebackground | Force a white background. | True/False |### Example
![Example](example/bpmn-plugin.gif)
## How to edit the BPMN
Just open the BPMN file in your obsidian vault and the BPMN will be editable in fullscreen mode.
### Features
- Token simulation
- Update properties
- Export SVG## 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](obsidian://show-plugin?id=bpmn-plugin)"
3. Click install
4. Toggle the plugin on in the **Community Plugins** tab### .. manually from this repo
1. Download the latest [release](https://github.com/joleaf/obsidian-bpmn-plugin/releases) `*.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