Simon Willison's Weblog: mermaid

Mermaid Gantt diagrams are great for displaying distributed traces in Markdown

2024-07-16T22:10:33+00:00

Mermaid Gantt diagrams are great for displaying distributed traces in Markdown

Bryce Mecum demonstrates how Mermaid gantt diagrams can be used to render trace information, such as the traces you might get from OpenTelemetry. I tried this out in a Gist and it works really well - GitHub Flavored Markdown will turn any fenced code block tagged mermaid containing a gantt definition into a neat rendered diagram.

Tags: markdown, mermaid

Datasette table diagram using Mermaid

2022-02-14T19:43:15+00:00

Datasette table diagram using Mermaid

Mermaid is a DSL for generating diagrams from plain text, designed to be embedded in Markdown. GitHub just added support for Mermaid to their Markdown pipeline, which inspired me to try it out. Here’s an Observable Notebook I built which uses Mermaid to visualize the relationships between Datasette tables based on their foreign keys.

Via @simonw

Tags: dsl, github, visualization, datasette, observable, mermaid