Drawio

draw.io bietet umfangreiche Zeichenmöglichkeiten für Prozessflussdiagramme, Infografiken und andere Visualisierungen auf einer Wikiseite. Beschreibende Grafiken wie Organigramme oder Flussdiagramme können direkt auf einer Wikiseite erstellt werden.

Ein Diagramm erstellen

So fügen Sie ein Diagramm mit VisualEditor ein:

1. Erstellen oder wählen Sie eine Seite, auf der Sie eine Zeichnung einfügen möchten.
2. Wählen Sie Einfügen > Magisches Wort im visuellen Editor.
3. Wählen Sie das magische Wort drawio.
4. Klicken Sie auf Fertig. Dies öffnet ein Dialogfeld. Geben Sie einen Namen für Ihre Zeichnung ein.
5. Klicken Sie auf Einfügen.
   
   

   draw.io auf der Seite einbinden
   Hiermit wird das Tag {{#draw.io:Name_des_Flussdiagramms}} in Ihren Quellcode eingefügt.
6. Speichern Sie die Seite.
7. Klicken Sie auf Bearbeiten, um den draw.io-Editor zu öffnen. Um die Arbeitsfläche zu vergrößern, wechseln Sie optional über die Kopfleiste in den Vollbildmodus.
   
   
   
   
8. Klicken Sie in draw.io auf Speichern, um Ihre Zeichnung zu speichern. Das so entstandene Diagramm wird als png-Datei im Datei-Namensraum gespeichert und bei weiteren Bearbeitungen versioniert.
9. Klicken Sie in draw.io auf Beenden, um den draw.io-Editor zu schließen.

• 

  Bearbeitungsmodus

• 

  Gespeichertes Flussdiagram

Ein Diagramm bearbeiten

Ein bestehendes Diagramm kann jederzeit abgeändert werden. Klicken Sie hierzu auf den Bearbeiten-Link oberhalb des Diagramms im Lesemodus der Seite.

Über PNG und SVG Dateien

In BlueSpice werden draw.io-Diagramme immer im PNG-Format gespeichert. Das Erstellen von SVG-Formaten ist derzeit nicht möglich. Wenn Sie Ihr Wiki in-house installiert haben (also nicht in der Cloud arbeiten), können Sie über eine Zusatzerweiterung die SVG-Unterstützung aktivieren.

Import von bestehenden Diagrammen

Visio-Diagramme

Dateien mit der Endung .vsdx können Sie direkt in draw.io importieren und weiter bearbeiten. Erstellen Sie hierzu auf einer Seite ein leeres draw.io-Diagramm. Speichern Sie das leere Diagramm und gehen Sie dann in den Bearbeitungs-Modus von draw.io. Dort wählen Sie Datei > Importieren von > Gerät. Anschließend können Sie das importierte Diagramm in draw.io bearbeiten.

Importieren einer vsdx-Datei

SVG-Dateien

Wenn Sie eine SVG-Datei in den BlueSpice draw.io-Editor importieren, wird sie automatisch in das PNG-Format umgewandelt und ist somit nicht mehr bearbeitbar und auch nicht als SVG-Datei im Wiki gespeichert. Als Alternative zum Import in draw.io sollten Sie daher die SVG-Datei in das Wiki hochladen und auf einer Wiki-Seite einbetten. Die Versionierung der Datei kann hier dann entsprechend nicht direkt im Wiki geschehen. Aktualisierte Version der SVG-Datei müssten dann jeweils entsprechend über die Datei-Seite durch erneutes Hochladen aktualisiert werden.

Verwenden von draw.io mit Imagemaps

draw.io erstellt eine versionierte PNG-Datei im Namensraum File. Dies bedeutet, dass jede Änderung des Flussdiagramms, die durch Speichern abgeschlossen wurde, eine neue, aktualisierte Version dieser PNG-Datei erzeugt. Sie können diese Datei jetzt auf einer anderen Seite in Ihr Wiki integrieren oder eine Image-Map erstellen.

Hinweis: Es ist nicht möglich, ImageMapEdit zusammen mit dem Drawio-Tag auf derselben Seite zu verwenden, sodass Sie hierfür separate Seiten erstellen müssen.

Verwandte Themen

• draw.io support
• mediawiki.org/wiki/Extension:DrawioEditor
• Referenz:DrawioEditor
• Anja Ebersbach, draw.io für MediaWiki und BlueSpice - Kollaborativ erstellte Zeichnungen, BlueSpice News & KnowHow vom 13. Februar 2020. (german)