• View
• Edit
• History
• Attach
• Print
• Backlinks

MermaidJs

Description

The recipe let you take advantage of the Mermaid.js scripting into PmWiki, allowing you to embed diagrams and charts into your pages.

Installation...

1. Put the recipe php fileΔ in the cookbook/ directory.
2. And enable the recipe in your Local Customizations by setting the configuration according to your needs and including the recipe script.

Since Mermaid.js is a fairly large set of javascript, you can access it through a content delivery network or choose to download and install it locally and define the $MermaidScriptUrl variable accordingly.

...using a CDN

$MermaidScriptUrl = "https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.js"; # recipe's default configuration
include_once("$FarmD/cookbook/mermaidjs.php");

This solution is ensuring you to always get the last stable version of the tool, with the requirement of an internet access available for the user.

...locally

A Mermaid.js sources archive may be downloaded from https://github.com/mermaid-js/mermaid/releases. You would then need to:

1. Extract it somewhere and copy/move the dist/ folder into a subfolder of the PmWiki's pub/ directory tree.
2. Define $MermaidScriptUrl variable:

$MermaidScriptUrl = "\$FarmPubDirUrl/<YOUR_MERMAID_DIST_FOLDER>/mermaid.min.js";
include_once("$FarmD/cookbook/mermaidjs.php");

Usage

The recipe is simply providing two markup definitions to enclose blocks of Mermaid.js own markup, such as:

(:mermaid:)
... <mermaid_markup_here> ...
(:mermaidend:)

or:

(:mermaid:) [@
 ... <mermaid_markup_here> ...
@]

You may refer to the official documentation site for the Mermaid.js syntax.

Change log / Release notes

• 2021-12-08 Initial release

If the recipe has multiple releases, then release notes can be placed here. Note that it's often easier for people to work with "release dates" instead of "version numbers".

Contributors

Recipe written by Dfaure

Comments

See discussion at MermaidJs-Talk?