Mermaidエディタ

Mermaidの構文を記述して、ライブフローチャート、シーケンス、またはクラスダイアグラムプレビューを表示。SVG、PNG、またはJPEGとしてエクスポートできます。

テーマ
100%
ダイアグラムエンジンをロード中...

Mermaidフローチャートエディタについて

エディタにMermaidダイアグラム構文を記述して、フローチャート、シーケンスダイアグラム、クラスダイアグラム、またはその他のチャートタイプのレンダリング結果をリアルタイムで更新できます。テンプレートを読み込んで素早く開始し、ダイアグラムをSVG、PNG、またはJPEGとしてエクスポートするか、後で編集するために構文をコピーします。

このツールについて

テキストを使用してダイアグラムを記述するライブMermaidダイアグラムエディタ。フローチャート、シーケンスダイアグラム、クラスダイアグラムなどを編集する際に、レンダリング結果をリアルタイムで確認し、最後にSVG、PNG、またはJPEGとしてエクスポートできます。

使い方

  1. テンプレート（フローチャート、シーケンス、クラスなど）を選択してサンプルMermaid構文を読み込むか、独自の構文を記述します。
  2. 編集すると、ダイアグラムプレビューが自動的に更新されます。
  3. 「画像をエクスポート」をクリックしてダイアグラムをSVG、PNG、またはJPEGとしてダウンロードするか、「構文をコピー」をクリックしてMermaidコードをコピーします。
  4. 構文にエラーがある場合、最後に有効なダイアグラムが表示されたままになり、修正できます。

主な用途

使いこなすヒント

よくある質問

Mermaid構文がサポートしているダイアグラムタイプは何ですか？

フローチャート、シーケンスダイアグラム、クラスダイアグラム、状態ダイアグラム、エンティティ関係ダイアグラム、その他複数のダイアグラムタイプをサポートしています。各タイプのサンプル構文を読み込むにはテンプレートを選択してください。

編集中に構文エラーが発生するとどうなりますか？

エディタは最後に有効にレンダリングされたダイアグラムを表示し続けるため、編集がある程度進んでいてもプレビューが表示されたままになり、エラーを修正するときに作業が見えたままです。

エクスポートする形式を選ぶべきですか：SVG、PNG、またはJPEG？

SVGはベクトル形式で、あらゆるズームレベルでもシャープですが、ドキュメント向けに理想的です。PNG と JPEGはラスター形式で、チャットアプリやスライドデッキでの共有に適しており、SVGをサポートされない環境向けです。

ダイアグラムをコードと一緒にバージョン管理に保存できますか？

はい。Mermaidダイアグラムはプレーンテキスト構文で書かれているため、.mmdソースを直接gitにコミットして、他のコードファイルのように変更を追跡できます。

ダイアグラム構文はサーバーに送信されてレンダリングされますか？

いいえ。ダイアグラムはブラウザ内でクライアント側でレンダリングされます。構文とダイアグラムコンテンツはどこにもアップロードされません。

Mermaid構文を記述してライブフローチャート、シーケンス、またはクラスダイアグラムプレビューを表示。SVG、PNG、またはJPEGとしてエクスポート可能。無料、登録不要。