Table of Contents
Compatible with DokuWiki
- 2024-02-06 "Kaos" unknown
- 2023-04-04 "Jack Jackrum" yes
- 2022-07-31 "Igor" no
- 2020-07-29 "Hogfather" unknown
This plugin lets users create and edit diagrams in DokuWiki. In provides an integration with the online diagramming tool diagrams.net, previously known as draw.io.
Diagram Storage Modes
The plugin provides two different ways to store the resulting diagrams:
- mediafile mode When using this mode, diagrams are saved as SVG images as regular media files. That means storing older versions of files and applying ACL permissions for editors happens on a per diagram basis. The same diagram can be used on many pages. This is enabled by default.
- embed mode When using this mode, the actual SVG code is embedded directly into a wiki page using the
<diagram>syntax. Editing a diagram always edits the page it is embedded on (creating a new page version) and ACLs match that of the page.
Which modes are available to your users is configured in the plugin's configuration settings.
Please note that diagrams can not easily be transferred from one mode to the other.
Create a diagram
Creating a diagram differs depending on the used storage mode:
- mediafile mode Diagrams are created in the media manager, either the fullscreen version or the media manager popup window. Just select the right namespace and click on the
Create diagramlink. Next, enter the file name for the diagram in the dialog that appears. Do not use any special characters here. You will be redirected to diagrams.net where you can create your diagram. Clicking on the
Savebutton will take you back to your wiki.
- embed mode A new toolbar button allows you to insert a new diagram. Clicking the button will open the diagrams.net Editor and when saving the diagram is inserted at the current cursor position.
Insert a diagram
- mediafile mode Diagrams are inserted using the standard Image syntax
- embed_mode Additional parameters for the toolbar button inserted
<diagram>syntax can be used. Alignment can be picked via the
centerkeywords. Sizes can be given as
widthxheightin pixels. Eg.
<diagram center 300x200>.
Edit a diagram
Existing diagrams can always be edited from viewing a page that uses the diagram. The diagram will have a “Edit Diagram” button if the current user has the appropriate permissions to edit the diagram. This works for both storage modes.
Depending on the storage mode, edits can also happen elsewhere:
- mediafile mode In the fullscreen media manager in the
Viewtab, an “Edit Diagram” button will be displayed when a diagram image is selected
- embed mode When editing a page, the cursor can be positioned on the syntax of an embedded diagram, clicking the toolbar button will then edit this existing diagram instead of creating a new one
This plugin support the Prosemirror WYSIWYG Plugin for both modes. New diagrams can be inserted via the toolbar. Diagrams are shown within the editor (interactive mechanisms like links are disabled in the editor) on click their properties can be changed and the diagram editor can be opened.
The plugin works with SVGs by default. However SVGs created by diagrams.net use certain features (most notably multiline and formatted texts) that only work, when the SVG is displayed in a Webbrowser. This means that those features will be lost when exporting to PDF using the dw2pdf Plugin. Please note that this is not true when using the browser's “Print to PDF” mechanism.
To work around this, the Plugin can optionally save a PNG based cache file for each diagram on saving and use that cache file when exporting to PDF. Enable the
pngcache option in the configuration of the plugin to enable it. Please note that only diagrams saved after enabling this option will have PNG cache file. You will need to resave your existing diagrams to make use of that feature.
This plugin was inspired by a few other plugins that integrate diagrams.net/draw.io into DokuWiki. Below you can find a small feature comparison.
|SVG (PNG optional for PDF Exports)
|PNG (SVG with additional Plugin)
|Links in Diagrams
|Custom Diagrams Host
|Draft saving for Diagrams
The source code of the plugin is available at GitHub: cosmocode/dokuwiki-plugin-diagrams.
- Merge pull request #53 from dokuwiki-translate/lang_update_777_170430… (2024-01-08 15:33)
- translation update (2024-01-03 18:50)
- Version upped (2023-12-14 23:50)
- Less restrictive check if SVG is a diagram (2023-12-14 12:48)
- Version upped (2023-12-06 23:50)
- Fix links in diagrams (again) (2023-12-06 15:11)
- Version upped (2023-11-30 23:50)
- Fix warning (2023-11-30 16:47)
Bug reports and feature requests
Please refer to the Issue Tracker for reporting issues.