Mermaid Viewer

ライブプレビュー

即座にMermaidコードを図としてレンダリングし、手動でのレンダリングステップを排除し、より迅速な反復のために視覚的フィードバックを合理化します。

AI支援コーディング

「Generate with GPT-4」ボタンで自然言語の説明をMermaid構文に変換し、図の作成を高速化し、新規ユーザーの学習曲線を短縮します。

スマートエクスポート

図をSVG、PNG、JPG、PDF、またはMarkdown形式でエクスポートし、DPI制御とテーマ選択が可能です。これにより、ドキュメントやプレゼンテーション用に高品質な資産が作成できます。

スマートデバッグ

リアルタイムで構文エラーをハイライトし、自動修正提案を行います。これによりコード品質が向上し、図作成中のフラストレーションが減少します。

リアルタイムコラボレーション

仲間とライブエディタリンクを共有し、同時編集と即座の視覚更新を可能にします。複雑な図プロジェクトでアジャイルなチームワークを促進します。

プライバシー第一

データはブラウザ内にローカルで保存され、図は外部サーバへ送信されません。これによりユーザーのプライバシーが保護され、データセンシティブなワークフローにも準拠します。

無登録

ユーザーはアカウントを作成せずにすぐに図を作成できます。摩擦を減らし、即時にアクセス可能で、迅速なプロトタイプ作成に適しています。

• 学生：Mermaid Viewer をオンラインで無料で使用し、学術フローチャートやタイムラインを作成し、サインアップ不要で即座にプレビューします。
• 開発者：Mermaid Viewer VSCode プラグインを統合して、コードエディタ内で図を直接レンダリングし、ドキュメントを強化します。
• プロジェクトマネージャー：Mermaid Viewer から高解像度 PNG または SVG のガントチャートと git グラフを無料でエクスポートし、迅速に共有します。
• コラボレーティブチーム：Mermaid Viewer のオンラインでライブ編集リンクを共有し、リアルタイム協働でステートダイアグラムを書き合わせます。

図を保存するにはどうすればいいですか？

Mermaid Viewerでは、ユーザーがエディタから直接作品をダウンロードできます。図を作成した後、「Export」ボタンをクリックし、SVG、PNGまたはPDFなどのフォーマットを選択します。各フォーマットは保存前に解像度、DPI、ライトテーマまたはダークテーマをカスタマイズでき、ファイルを保存・アーカイブやプレゼンテーション用に準備できます。

チームと図を共有するにはどうすればいいですか？

図を共有するには、Mermaid Viewerが生成したユニークな共有リンクをコピーするだけです。このリンクをメール、チャットまたはコラボレーションプラットフォームに貼り付けます。リンクを持つ受信者はブラウザで図を開き、権限が与えられれば編集でき、好きな形式でダウンロードできます。インストールは不要です。

どのような種類の図をサポートしていますか？

Mermaid Viewerは完全にMermaidと互換性のある幅広い種類の図をサポートしています。フローチャート、シーケンス図、クラス図、ステート図、ER図、ガントチャート、円グラフ、要件図、Gitグラフ、C4図、マインドマップ、タイムライン図などがあります。各図は標準のMermaid構文に従い、エディタで即座にレンダリングされます。

何かをインストールする必要がありますか？

オンラインMermaid Viewerを利用するには、インストールは不要です。レンダリング、編集、エクスポート機能はすべてウェブブラウザ内で完結し、ローカルエディタやプラグインは必要ありません。ユーザーはMermaid Viewerウェブサイトにアクセスするだけで、Windows、macOS、Linux、モバイルなどどのデバイスでもエディタにアクセスできます。

高品質な図をエクスポートするにはどうすればいいですか？

高解像度のエクスポートは「Export」オプションを選択し、SVG、PNG、PDFなどのフォーマットを選ぶことで実現します。エディタではDPI設定の調整やライトモードとダークモードの選択が可能で、ブランドやプレゼンテーションの要件に合わせられます。プレミアムプランでは高解像度PNGが透かしなしで提供され、JPGやSVGなどの追加フォーマットも利用できます。

リアルタイムで図を共同編集できますか？

Mermaid Viewerはリアルタイムでコラボレーションできるツールを提供します。ライブ編集リンクを送ることで、複数のユーザーが同時に同じ図を編集できます。変更はすべての参加者に即座に反映され、バージョンの衝突を防ぎ、共同作業をスムーズにします。

私のデータはサーバーに保存されますか？

Mermaid Viewerはプライバシーを重視して設計されています。図のデータやコードはすべてユーザーのブラウザセッション内に留まります。プラットフォームは、ユーザーが有料プランのバージョン履歴機能を使って図を保存することを明示的に選択しない限り、ユーザー生成コンテンツを保存しません。

VS Code で Mermaid Viewer をどう使うのですか？

Mermaid Viewerは公式拡張機能を通じてVS Codeと統合されます。インストールすると、拡張機能によりエディタ内で直接Mermaid図をプレビューでき、入力するとリアルタイムにプレビューが更新されます。また、複数フォーマットへのエクスポートやオンラインプラットフォームと同じAI生成機能の活用も可能です。

Mermaid Viewer は、Mermaid コードを書いて即座にライブプレビューを確認でき、図を共有し、SVG/PNG/Markdown へエクスポートできるオンライン図形エディタです。ご登録は不要です。

• エディタパネルに Mermaid シンタックスを貼り付けまたは入力すると、右側のプレビュー領域で入力と同時に図が描画され、瞬時に可視化されます。
• 「Generate with GPT‑4」ボタンを使用すると、自然言語の説明を Mermaid コードに変換できます。生成結果を直接編集したり、手動で微調整したりできます。
• エクスポートパネルでテーマと DPI 設定を適用します。ライトモードまたはダークモードを選択し、SVG または PNG の解像度を指定してから「Export」をクリックすると画像がダウンロードされます。
• 「Share」ボタンをクリックして図を共有します。リンクや埋め込みコードをコピーして、協力者が共同編集またはライブ図を閲覧できるようにします。
• オフラインやローカルサーバーで作業している場合は、Windows、macOS、Linux 用の Mermaid Viewer アプリをダウンロードしてください。バイナリを起動し、同じエディタインターフェースを使用できます。
• シンタックスハイライトと自動修正提案をリアルタイムで確認できます。エラーはエディタ内でフラッシュし、エクスポート前に解決できます。