timeline
使いどころ
Use a タイムライン when…
01
Product release histories
02
Company milestone slides
03
Anything chronological without dependencies
構文の基本
The minimal syntax
Copy this and you have a working タイムライン. Build from here.
timeline.mmd
timeline title Mermaid milestones 2014 : Initial release 2018 : Sequence + Gantt 2022 : ELK renderer 2025 : Block, C4, layout API
よく使うパターン
Patterns worth memorizing
Multiple events per year
`2024 : event A : event B` puts both events in the same column.
Sections
`section Era` groups years and applies a band color.
Mix dates and labels
You can use any string before the `:` — months, quarters, eras.
ハマりどころ
The things that will trip you up
Mermaid silently ignores misspellings — these are the failures we see most.
- 01
No dependency arrows; for that, use Gantt.
- 02
Long events overflow vertically; split into multiple rows.
- 03
Date sorting is left-to-right by source order, not by parsed value.
関連する図