タイムラインとは？
タイムライン図は時間軸に沿ってイベントを時系列で表示し、イベントの順序と関係を簡単に把握できるようにします。プロジェクト計画、歴史文書、製品ロードマップ、時間的関係の理解が重要なあらゆるシナリオに不可欠です。タイムラインは、時間の経過に伴うイベントの明確で直線的な物語を提供します。
編集とプレビュー
Mermaid構文でタイムラインを作成し、変更を即座に確認。
Example
Timeline example
A Mermaid timeline showing when example code, PNG previews, and alt text are added.
Mermaid code
timeline
title Mermaid Editor Release Timeline
2026-05-01 : Add example code
: Render PNG preview
2026-05-03 : Add image alt text
: Improve SEO content
2026-05-05 : Publish pages一般的なユースケース
製品ロードマップ
タイムラインに沿って計画中の機能、リリース、マイルストーンを視覚化。ステークホルダーとチームメンバーに開発の優先順位を伝達。
プロジェクトマイルストーン
主要なプロジェクトイベント、成果物、締め切りを追跡。プロジェクトの進捗と今後のマイルストーンの明確な概要を提供。
歴史的ドキュメント
企業の歴史、技術の進化、あらゆる年代記を表示。時間の経過に伴うイベントの魅力的なビジュアルナラティブを作成。
リリースノート
ソフトウェアバージョンとその主要機能を時系列で文書化。ユーザーが製品の進化を理解するのを支援。
主な機能
時間区分
日付、四半期、カスタムテキストなどのラベルで時間区分を定義し、イベントを時系列に整理。
1期間に複数イベント
同じ時間区分に複数のイベントをグループ化し、同時進行のアクティビティや関連項目を表示。
タイトルとセクション
全体タイトルとセクションヘッダーを追加し、コンテキストを提供してタイムラインを論理グループに整理。
自動レイアウト
Mermaidがタイムライン上のイベントを自動的に間隔を空けて配置し、最適な可読性を実現。
ベストプラクティス
一貫した時間スケールを使用
タイムライン全体で時間間隔を一貫させる。明確に示さない限り、日と年を混在させない。
重要なイベントを強調
最も重要なマイルストーンを強調。すべてのイベントに同じ視覚的な重みを持たせる必要はない。
ラベルを簡潔に
イベントには短く説明的なラベルを使用。詳細は付随するドキュメントで提供。
関連イベントをグループ化
セクションを使用して関連イベントをグループ化し、テーマとフェーズを理解しやすくする。
他のダイアグラムタイプを探す
フローチャート
ノードと方向矢印でプロセス、ワークフロー、アルゴリズムを視覚化。ビジネスプロセスやデシジョンツリーに最適です。
シーケンス図
異なるアクターやシステム間の時系列でのインタラクションを文書化。APIドキュメントやシステム設計に最適です。
クラス図
クラス、属性、関係でオブジェクト指向システムをモデル化。ソフトウェアアーキテクチャ設計に不可欠です。
ステート図
システムやアプリケーションの状態遷移を表現。ライフサイクル状態やワークフローのモデリングに最適です。
ガントチャート
タスクと依存関係でプロジェクトのタイムラインを計画・追跡。プロジェクト管理やスケジューリングに最適です。
ER図
エンティティと関係でデータベーススキーマを設計。データベースモデリングやドキュメント作成に最適です。
ユーザージャーニー
タッチポイント全体のユーザー体験とインタラクションをマッピング。UXデザインやカスタマージャーニーマッピングに最適です。
Gitグラフ
Gitのブランチ戦略やコミット履歴を視覚化。バージョン管理ワークフローの説明に役立ちます。
マインドマップ
アイデアの整理、ブレインストーミング、階層的なビジュアル構造の作成に。計画立案やナレッジマネジメントに最適です。
円グラフ
円形チャートでデータの比率分布を表示。パーセンテージやマーケットシェアの分析に最適です。
カンバンボード
ワークフローの段階ごとにタスクを列に整理。アジャイルプロジェクト管理やタスク追跡に最適です。
象限チャート
2軸グリッド上に項目をプロットして比較・優先順位付け。機能の優先順位付けや戦略分析に最適です。
サンキーダイアグラム
ノード間のフロー量を比例矢印で視覚化。エネルギーフロー、予算配分、コンバージョンファネルに最適です。
XYチャート
カスタマイズ可能な軸を持つ棒グラフと折れ線グラフを作成。データ視覚化やトレンド分析に最適です。
ブロックダイアグラム
行と列に配置されたブロックで構造化レイアウトを構築。システムアーキテクチャやコンポーネント概要に最適です。
アーキテクチャ図
サービスアイコンと接続を使用してクラウドやシステムアーキテクチャを設計。インフラストラクチャドキュメントに最適です。
パケットダイアグラム
ネットワークプロトコルのパケット構造とビットレベルのフィールドレイアウトを視覚化。ネットワークプロトコルドキュメントに最適です。