Der neue Weg, um zu forken. Wenn es dir nicht gefällt, mach es besser: Mermaid gantt++

2026-10-27 Build Gernot Glawe

Mit Mermaid kann man ja hervorragende Diagramme machen.

Deswegen habe ich, wie hier beschrieben, einfach ein Go-Fork gemacht.

Jetzt fehlten mir aber bei dem Mermaid-gantt verschiedene Elemente. Dann hab ich’s einfach dazugebaut.

megaproaktiv proudly presents: Sammelvorgänge, Abhängigkeitspfeile und Vorgänge in einer Zeile.

Zuerst nachprogrammieren und dann verbessern.

Weil ich Mermaid gerne benutze, um Diagramme zu bauen (wie Flowcharts, Kandiagramme und Sequenzdiagramme), mir das Rendern mit Mermaid aber zu langsam ist, habe ich gmaid gebaut: einen Go-Nachbau der Mermaid-Diagramme.

Das Wichtigste für das Weiben, also Codieren mit Modellen, Sind gute Tests. Und hier hatte ich einen hervorragenden Test, weil wir in einem Projekt viele mermaid-Diagramme gebaut haben und ich damit wusste, wie die erzeugten PNGs, also Images, aussehen.

Ich habe dann alle Daten anonymisiert, weil es ja nur um das Layout geht, und habe dann alle Wörter ersetzt mit gleich langen Wörtern aus Herr der Ringe. Das klappte wirklich sehr gut, und so war gmaid geboren. Ich benutze nur noch gmaid.

Jetzt mache ich gerade eine Projektplanung, und das Gant-Diagramm mache ich dann gerne mit mermaid. Also jetzt neu mit G-Mate

Jetzt fehlen mir aber drei Dinge bei dem Mermaid-Kantendiagramm. Die habe ich einfach nachgebaut.

Und dabei die Bilder des guten alten MS-Projekt als Inspiration genommen.

Die Dinge sind:

ein Sammelvorgang
eine Abhängigkeitsverlinkung zwischen Vorgängen, die durch Pfeile dargestellt wird
dass ich in einer Zeile mehrere Vorgänge anzeigen kann, nicht nur untereinander

Das alles gibt es jetzt in gmaid. Also ist es sozusagen Mermaid++.

Mehrere Vorgänge in einer Zeile.

  section Carry the Ring (one line)
    Amon Hen   :r1, after lorien, 8d
    &Emyn Muil :r2, 2026-03-10, 8d
    &Marshes   :r3, 2026-03-18, 8d
    &Black Gate :r4, 2026-03-26, 8d

Verlinkungspfeile

  Council of Elrond        :done, council, 2026-01-01, 7d
  Form the Fellowship      :active, form, after council, 10d
  link council FS form

Alles zusammen

gantt
    title Quest to Destroy the One Ring
    dateFormat YYYY-MM-DD
    axisFormat %b %d
    tickInterval 1month

    section Fellowship
    Fellowship of the Ring   :summary, fs, 2026-01-01, 2026-03-15
    Council of Elrond        :done, council, 2026-01-01, 7d
    Form the Fellowship      :active, form, after council, 10d
    Depart from Rivendell    :milestone, depart, after form, 0d

    section March to Mordor
    Pass of Caradhras        :crit, caradhras, after depart, 12d
    Mines of Moria           :crit, moria, after caradhras, 14d
    Lothlorien respite       :lorien, after moria, 10d

    section Carry the Ring (one line)
    Amon Hen   :r1, after lorien, 8d
    &Emyn Muil :r2, 2026-03-10, 8d
    &Marshes   :r3, 2026-03-18, 8d
    &Black Gate :r4, 2026-03-26, 8d

    section Mount Doom
    Climb Mount Doom         :climb, 2026-04-03, 9d
    Destroy the One Ring     :milestone, crit, destroy, after climb, 0d
    Fall of Barad-dur        :fall, after destroy, 3d

    link council FS form
    link form FS depart
    link depart FS caradhras
    link caradhras FS moria
    link moria SS lorien
    link lorien FS r1
    link r4 FS climb
    link climb FS destroy
    link destroy FF fall

Und so siehts aus:

Source auf GitHub

gmaid