2026-09-23 13:32:14 +02:00
|
|
|
# BPMN-Vorschau
|
|
|
|
|
|
|
|
|
|
Zeigt eine `.bpmn`-Datei als Diagramm im Browser — offline, ohne PICTURE, ohne dass die Datei den Rechner verlässt.
|
|
|
|
|
Grundlage ist [bpmn-js](https://github.com/bpmn-io/bpmn-js), die Bibliothek hinter bpmn.io, lokal eingebettet.
|
|
|
|
|
|
|
|
|
|
## Benutzen
|
|
|
|
|
|
|
|
|
|
**Mit Python** (aus dem Workspace-Root) — öffnet die Vorschau direkt im Browser, auch für einen Entwurf:
|
|
|
|
|
|
|
|
|
|
```bash
|
2026-09-25 09:40:52 +02:00
|
|
|
python scripts/vorschau.py Prozessbibliothek/antrag-pruefen/antrag-pruefen.bpmn
|
2026-09-23 13:32:14 +02:00
|
|
|
python scripts/vorschau.py entwuerfe/antrag-pruefen.md # .md wird vorher umgewandelt
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
**Ohne Python:** `werkzeuge/vorschau/vorschau.html` im Browser öffnen (Doppelklick) und eine `.bpmn` hineinziehen
|
|
|
|
|
oder über „Datei öffnen …“ wählen. Das funktioniert auch mit einer aus Gitea heruntergeladenen Datei.
|
|
|
|
|
|
|
|
|
|
Mausrad zoomt, Ziehen verschiebt, „Einpassen“ zeigt das ganze Diagramm.
|
|
|
|
|
|
|
|
|
|
## Was die Vorschau zeigt — und was nicht
|
|
|
|
|
|
|
|
|
|
Sie zeigt, was **in der Datei steht**: Elemente, Lanes, Kanten mit genau den Anschlusspunkten, die `md_to_bpmn.py`
|
|
|
|
|
berechnet hat. Damit eignet sie sich, um Entwürfe vor der Freigabe und Modelländerungen im Review anzusehen.
|
|
|
|
|
PICTURE kann dieselbe Datei anders darstellen (eigene Schriften, eigene Behandlung von Anschlusspunkten). Der Import
|
|
|
|
|
in PICTURE bleibt deshalb der letzte Nachweis.
|
|
|
|
|
|
|
|
|
|
## Eingebettete Bibliothek
|
|
|
|
|
|
|
|
|
|
| | |
|
|
|
|
|
|---|---|
|
|
|
|
|
| Paket | `bpmn-js` 18.29.1 (npm), Datei `dist/bpmn-navigated-viewer.production.min.js` und `dist/assets/*.css` |
|
|
|
|
|
| Quelle | `https://registry.npmjs.org/bpmn-js/-/bpmn-js-18.29.1.tgz` |
|
|
|
|
|
| Integrität (npm) | `sha512-7M3O9LeHbV2ZW9xLXap8CMmIjR+iXWqiXrz7Rt1hE+DqLGhULuwOIgTsQGtXPGVUCrnrk4L38NVlc5R8thOHJw==` |
|
|
|
|
|
| Lizenz | MIT mit Auflage, siehe `bpmn-js/LICENSE` |
|
|
|
|
|
|
|
|
|
|
**Lizenzauflage:** Das bpmn.io-Wasserzeichen unten rechts im Diagramm darf nicht entfernt, verändert oder von
|
|
|
|
|
anderen Elementen überdeckt werden. Bedienelemente deshalb nie in die untere rechte Ecke der Zeichenfläche legen.
|
|
|
|
|
|
|
|
|
|
Die Bibliothek lädt nichts aus dem Netz nach; die Adressen darin sind XML-Namensräume und der Link des Wasserzeichens.
|
|
|
|
|
Das Font-Paket `bpmn-font` wird nur vom Editor gebraucht und fehlt bewusst.
|
|
|
|
|
|
|
|
|
|
## Aktualisieren
|
|
|
|
|
|
|
|
|
|
1. Neue Version bei npm nachsehen, Tarball laden und die `integrity` aus `https://registry.npmjs.org/bpmn-js/<version>`
|
|
|
|
|
gegen die Prüfsumme des geladenen Archivs prüfen.
|
|
|
|
|
2. Die vier Dateien in `bpmn-js/` ersetzen (`LICENSE` auf geänderte Auflagen lesen).
|
|
|
|
|
3. `python -m pytest -q` — `scripts/vorschau.py` lehnt eine Bibliothek ab, die `<script`/`</script` enthält und damit
|
|
|
|
|
nicht sicher eingebettet werden kann.
|
|
|
|
|
4. Eine Vorschau erzeugen und im Browser ansehen; Tabelle oben nachziehen. Eigener Pull Request.
|
