Render mermaid diagrams in wiki pages

Description

With this macro you can render mermaid diagrams in Trac wiki pages. ​mermaid is a JavaScript library that can render sequence diagrams, flowcharts and Gantt charts from text in a similar manner as markdown. The library itself is MIT licensed.

The current version of this macro uses mermaid version 0.6.0. An example of using this library:

{{{#!Mermaid
sequenceDiagram
A->> B: Query
B->> C: Forward query
Note right of C: Thinking...
C->> B: Response
B->> A: Forward response
}}}

Note that contrary to regular ​wiki processors, Mermaid is spelled with capital M. The code above yields the following diagram on the wiki page:

Mermaid live editor

You can use Mermaid live editor by double-clicking a chart. In the live editor you can:

1. preview Mermaid notation and
2. save the result directly to the Wiki page.

TracLink

In flow chart diagrams, it is possible to add TracLink to a box:

{{{#!Mermaid
%% Subgraph example
graph TB

    subgraph one
        a1(This is the text in the box)-->|label 1|a2
    end

    subgraph two
        b1((B1))-->b2((B2))
    end

    subgraph three
        c1>C1]-->c2{C2}
        subgraph four
            d4-->d5
            d4-->d4
        end
    end

    c1-.->d5
    b1-->a2
    a1==>b2

    %% A link to external URL
    click a1 "https://trac-hacks.org/wiki/MermaidMacro" "Tooltip for a callback"

    %% TracLink
    click b2 trac [[TracMermaid|This is a tooltip for a (Trac) link]]
}}}

This code will result in the following image:

In it, the top left box "This is the text in the box" and the box B2 are clickable.

See also:

• MscgenPlugin Add message sequence chart diagrams with mscgen to Trac wiki page
• PlantUmlMacro Render PlantUML diagrams in wiki pages
• TracBlockDiagPlugin Render blockdiag diagrams into Trac wiki pages
• WebSequenceDiagramPlugin Render UML diagrams on Trac wiki and ticket pages

Bugs/Feature Requests

Existing bugs and feature requests for MermaidMacro are here.

If you have any issues, create a new ticket.

defect	5 / 5
enhancement	1 / 3

Download

Download the zipped source from here.

Source

You can check out MermaidMacro from here using Subversion, or browse the source​ with Trac.

Installation

General instructions on installing Trac plugins can be found on the TracPlugins page.

Recent Changes

17355 by rjollos on 2019-04-04 05:24:26

Fix Error: int object has no attribute replace

Fixes #13546.

16903 by rjollos on 2017-10-20 03:20:21

TracMermaid 0.4.2: Fix AttributeError when resource.id not string

Fixes #13305.

16902 by rjollos on 2017-10-20 03:17:07

TracMermaid 0.4.1: Fix undefined variable

Require Trac >= 1.0.

Refs #13305.

(more)

Author/Contributors

Author: tkob-trac
Maintainer: tkob-trac
Contributors: