フローチャートエディター：図形、矢印、はい／いいえのラベルをブラウザでそのまま。
図はお使いのブラウザで描かれ、どこにも送信されません。
エディターでできること
ISO 5807 の記号、図形を自動でよけて辺にくっつく矢印、判断の出口に付く「はい／いいえ」のラベル。「+」ボタンは次の図形をつないだ状態で置き、「自動整列」は図全体を並べ直します。図は作業中にブラウザーへ自動保存され、PNG・SVG・PDF や Mermaid コードとしてダウンロードできます。
フローチャートを Word や Google Docs に入れるには
- Word 2019 と Microsoft 365：SVG。普通の画像と同じように挿入すれば、どの倍率でも鮮明です。
- Google Docs と古い Word：300 dpi の PNG。幅で「A4、Word の既定の余白」か「US Letter」を選ぶと、画像が本文の幅にぴったり収まります。
- LaTeX：図の大きさに合わせた PDF。\includegraphics で挿入してもぼやけません。
- いちばん速いのは、「ダウンロード」ウィンドウの「画像をコピー」から文書に Ctrl+V する方法です。
ここでダウンロードした PNG と SVG には図そのものが入っています。ファイルをシートにドラッグして戻せば、続けて編集できます。
フローチャートの記号と意味
名前は図形パネルと同じです。最初の 5 つはほとんどの授業の課題で使い、残りは ISO 5807 に沿った図で使います。
| 図形 | 名前 | 使う場面 |
|---|---|---|
| 開始 / 終了 | アルゴリズムの開始と終了、サブルーチンの入口と出口。 | |
| 処理 | 計算や任意の処理：代入、演算、命令。 | |
| 判断 | 条件の判定。ひし形には「はい」と「いいえ」の 2 つの出口があります。 | |
| 入力 / 出力 | 媒体を問わないデータの入力と出力。 | |
| サブルーチン | 別に定義したサブルーチンや関数の呼び出し。 | |
| 準備 | ループの準備：i = 1 のような初期値の設定。 | |
| ループ始端 | ループの上端。同じ名前の「ループ終端」と対になります。 | |
| ループ終端 | ループの下端。終了条件はどちらかの端に書きます。 | |
| 結合子 | 線の中断。同じラベルの結合子から矢印が続きます。 | |
| ページ間結合子 | 別のページへの移動。教科書で使われますが、ISO 5807 には通常の結合子しかありません。 | |
| コメント | 図形への注記。破線で図形とつなぎます。 | |
| 手操作入力 | キーボードなどから手で入力するデータ。 | |
| 手作業 | 人が行う作業。 | |
| 書類 | 紙のデータ：印刷物、用紙、報告書。 | |
| 表示 | 画面に表示するデータ。 | |
| 記憶データ | 媒体を問わない保存データ。 | |
| 内部記憶 | 主記憶上のデータ。 | |
| 順次アクセス記憶 | テープのように順に読む媒体上のデータ。 | |
| 直接アクセス記憶 | ディスクのように直接アクセスできる媒体上のデータ。 | |
| パンチカード | パンチカード上のデータ。 | |
| せん孔テープ | 紙テープ上のデータ。 | |
| 並列処理 | 同時に進む処理の開始または終了。 | |
| 省略 | 図の一部を省略した箇所。 |
ISO 5807 に沿ったフローチャート
パネルの「ISO 5807」スタイルは、規格どおりの図形の比率にします。高さ a、幅 1.5a、a は 15～30 mm、文字は 10～14 pt、矢印の先は流れに逆らう線だけか、すべての線に付けます。このスタイルでは図形が文字に合わせて大きくなりません。文字が収まらないときはヒントが知らせます。
ヒントのアイコンは、図が規格から外れている箇所を示します。出口が 2 つ未満の判断、ラベルのない出口、入口や出口のない図形、開始や終了がないことなどです。
Mermaid コードから図を作る
チャットボットに Mermaid コードでフローチャートを描いてもらい、回答をまるごと、コードの前後の文章ごと貼り付けてください。「コードを貼り付け」ボタンでも、シート上の Ctrl+V でもかまいません。図形・矢印・ラベルが取り込まれ、配置は自動で行われます。逆方向は「ダウンロード」ウィンドウの「Mermaid コードをコピー」です。
キーボード
- Enter — 図形の文字を編集
- Ctrl + Enter — 文字の入力を終えて次の図形を置く
- Ctrl + ←↑→↓ — その方向につないだ図形を追加
- ←↑→↓ — 選択したものを移動
- Shift + ←↑→↓ — 大きな幅で移動
- Ctrl + Z, Ctrl + Shift + Z — 元に戻す・やり直す
- Ctrl + D — 複製
- Delete — 削除
- Space + ドラッグ — シートを動かす
- Ctrl + マウスホイール — 拡大・縮小
アルゴリズムそのものをコードで確かめるなら Python の実行環境.
よくある質問
透かしは入りますか？
入りません。PNG・SVG・PDF は透かしなしでダウンロードでき、登録も不要です。
図はどこに保存されますか？
お使いのブラウザーの中だけです。サーバーには何も送られません。空き容量が足りないときや、サイトを長く開いていないときにブラウザーがサイトのデータを消すことがあるので、大切な図はファイルでダウンロードしてください。「ダウンロード」ウィンドウか「保存した図」の「図のファイルをダウンロード」です。
スマートフォンで使えますか？
使えます。図形は指でドラッグ、シートは何もない所をドラッグ、拡大縮小は 2 本指です。ダブルタップで文字の入力、長押しで操作メニューが開き、図形は下のパネルにあります。
ISO 5807 に沿ったフローチャートはどう作りますか？
「ISO 5807」スタイルを選び、サイズ a とフォントを設定して、ヒントで図を確認します。レポートや論文には 300 dpi の PNG か SVG をダウンロードしてください。
PDF の文字を選択できないのはなぜですか？
PDF では文字をアウトラインで描いているので、当サイトのフォントがない環境でも同じ見た目になります。選択できる文字が必要なら、「文字をテキストのまま残す」にチェックを入れて SVG をダウンロードしてください。
図形の中にはどの言語で書けますか？
サイトのどの言語でも書けます。右から左へ書く文字や中国語・日本語の文字も使えます。Noto フォントが文字に合わせて読み込まれます。ウルドゥー語はナスターリク体ではなくナスフ体で表示します。ナスターリク体のフォントは 1 MB を超えるためです。絵文字やほかの文字体系の文字は、PNG ではシステムのフォントで描かれ、PDF には入りません。「ダウンロード」ウィンドウでお知らせします。
図はどのくらい大きくできますか？
上限はありません。図形 200 個と矢印 300 本の図でも、遅いスマートフォンで滑らかに動きます。ドラッグ中は矢印を簡単な折れ線で描き、図形を離したときに正確な経路を引き直します。
無料ですか？
はい、完全に無料で登録も不要です。ツールはすべてブラウザー内で動作します。ファイルがサーバーに送られないため、サーバーはCPUも通信量も使いません。料金をいただく理由がないのです。ウォーターマークはなく、ファイルのサイズや数の制限もありません。