インストール - Mermaid - 版の履歴

Wiki: /* 使用方法 */

2024-11-12T12:43:21Z

使用方法

Wiki: /* 概要 */

2024-11-12T12:28:11Z

概要

← 古い版		2024年11月12日 (火) 21:28時点における版
12行目:		12行目:
	* アプリケーションのアーキテクチャ図		* アプリケーションのアーキテクチャ図
	* データベース設計書作成		* データベース設計書作成
			* データベース構造の視覚化
	<br>		<br>
	特に、Gitベースのドキュメント管理との相性が良く、GitHubやGitLab等でも標準でサポートされている。<br>		特に、Gitベースのドキュメント管理との相性が良く、GitHubやGitLab等でも標準でサポートされている。<br>

Wiki: /* 概要 */

2024-11-12T12:24:27Z

概要

@@ 1行目: / 1行目: @@
 == 概要 ==
+Mermaidは、テキストベースでダイアグラムを作成できるJavaScriptベースのライブラリである。<br>
 <br><br>

Wiki: ページの作成:「== 概要 ==

== Mermaidのインストール == ==== Node.jsのインストール ==== Node.jsのインストールは、インストール - Yarnのページを参照すること。

==== Mermaidのインストール ==== `npm`コマンドを使用して、mermaindをインストールする。
# グローバルインストールする場合 npm install -g @mermaid-js/mermaid-cli
mermaind…」

2024-11-12T12:20:25Z

ページの作成:「== 概要 == == Mermaidのインストール == ==== Node.jsのインストール ==== Node.jsのインストールは、インストール - Yarnのページを参照すること。 ==== Mermaidのインストール ==== <code>npm</code>コマンドを使用して、mermaindをインストールする。 # グローバルインストールする場合 npm install -g @mermaid-js/mermaid-cli mermaind…」

新規ページ

== 概要 ==

 

== Mermaidのインストール ==
==== Node.jsのインストール ====
Node.jsのインストールは、[[インストール_-_Yarn#NordJS|インストール - Yarn]]のページを参照すること。 
 
==== Mermaidのインストール ====
<code>npm</code>コマンドを使用して、mermaindをインストールする。 
# グローバルインストールする場合
npm install -g @mermaid-js/mermaid-cli
 
mermaindは、以下に示すディレクトリにインストールされる。 
/<Nodeのインストールディレクトリ>/bin
/<Nodeのインストールディレクトリ>/lib/node_modules/@mermaid-js
 

== 使用方法 ==
 

== 画像形式に変換 ==
==== mermaid-cliを使用する場合 ====
# 基本的な使用方法
mmdc -i <入力するMermaidファイル>.mmd -o <出力する画像ファイル>.png

# 背景色を指定する場合
mmdc -i <入力するMermaidファイル>.mmd -o <出力する画像ファイル>.png -b white

# 画像サイズを1920x1080で出力する場合
mmdc -i <入力するMermaidファイル>.mmd -o <出力する画像ファイル>.png -w 1920 -H 1080

# 画像サイズを3840x2160で出力する場合
mmdc -i <入力するMermaidファイル>.mmd -o <出力する画像ファイル>.png -w 3840 -H 2160

# 基本サイズの2倍
mmdc -i <入力するMermaidファイル>.mmd -o <出力する画像ファイル>.png -s 2

# 基本サイズの3倍
mmdc -i <入力するMermaidファイル>.mmd -o <出力する画像ファイル>.png -s 3
 
==== Node.jsでスクリプトを生成する場合 ====
<code>npm</code>コマンドを使用して、mermaind-puppeteerをインストールする。 
# グローバルインストールする場合
npm install mermaid puppeteer
 
<syntaxhighlight lang="js">
const mermaid = require('mermaid');
const fs = require('fs');

mermaid.initialize({ startOnLoad: true });
mermaid.render('mqtt-flow', mermaidDefinition, (svgCode) => {
// SVGをPNGに変換するロジック
});
</syntaxhighlight>
 

{{#seo:
|title={{PAGENAME}} : Exploring Electronics and SUSE Linux | MochiuWiki
|keywords=MochiuWiki,Mochiu,Wiki,Mochiu Wiki,Electric Circuit,Electric,pcb,Mathematics,AVR,TI,STMicro,AVR,ATmega,MSP430,STM,Arduino,Xilinx,FPGA,Verilog,HDL,PinePhone,Pine Phone,Raspberry,Raspberry Pi,C,C++,C#,Qt,Qml,MFC,Shell,Bash,Zsh,Fish,SUSE,SLE,Suse Enterprise,Suse Linux,openSUSE,open SUSE,Leap,Linux,uCLnux,Podman,電気回路,電子回路,基板,プリント基板
|description={{PAGENAME}} - 電子回路とSUSE Linuxに関する情報 | This page is {{PAGENAME}} in our wiki about electronic circuits and SUSE Linux
|image=/resources/assets/MochiuLogo_Single_Blue.png
}}

__FORCETOC__
[[カテゴリ:RHEL]][[カテゴリ:SUSE]][[カテゴリ:Raspberry_Pi]][[カテゴリ:PinePhone]]