ツールバー
ツールバーは画面上部に表示され、左グループと右グループの2つに分かれています。左グループにはノード操作・履歴・その他ユーティリティが、右グループにはパネル切り替えボタンが並んでいます。
左端の「ドキュメント一覧に戻る」ボタンは常に押せます。保存済みなら即座に戻り、未保存または保存中の場合は全画面オーバーレイで保存中メッセージを表示し、保存完了後に自動で戻ります。
ツール選択グループ
作業モードを切り替えます。アクティブなツールはハイライト表示されます。
| ボタン | 操作内容 |
|---|---|
| 選択ツール | ノードを選択・移動・リサイズします。何も選択していない状態で背景をドラッグするとキャンバスをパンできます。 |
| テキストボックス描画 | キャンバス上でドラッグして新しいテキストノードを作成します。作成後は即座に文字入力モードに入ります。 |
| 矩形描画 | キャンバス上でドラッグして新しい矩形ノードを作成します。 |
| コネクションツール | 2つのノードを繋ぐ接続線を引きます。始点のノードをクリックし、終点のノードをクリックして確定します。 |
ツールロック機能
テキスト・矩形・コネクションの各ツールはダブルクリックするとロック状態になります。ロック中はノード作成後も同じツールが継続して選択され、次々と同じ種類のノードを作成できます。もう一度ダブルクリックするか別のツールを選ぶとロックが解除されます。
操作グループ
| ボタン | 操作内容 |
|---|---|
| 切り取り | 選択中ノードをクリップボードにコピーして削除します。何も選択していないときはボタンが無効になります。 |
| コピー | 選択中ノードをクリップボードにコピーします。何も選択していないときはボタンが無効になります。 |
| 貼り付け | クリップボードのノードをマウスカーソル位置に貼り付けます。 |
| 削除 | 選択中のノードをすべて削除します。何も選択していないときはボタンが無効になります。 |
| 自動グループ化 | 自動グループ化のON/OFFを切り替えます。ONのとき、重なり合うノードを自動的にグループとして扱います。 |
履歴グループ
| ボタン | 操作内容 |
|---|---|
| 元に戻す(Undo) | 直前の操作を取り消します。取り消せる操作がないときは無効になります。 |
| やり直し(Redo) | Undoした操作を再実行します。Undoした履歴がないときは無効になります。 |
ユーティリティグループ
| ボタン | 操作内容 |
|---|---|
| 頂点連結 | 頂点連結のON/OFFを切り替えます。ONのとき、スナップ閾値内で共有頂点を持つ矩形系ノードは一体の頂点のように連動します。スマートスナップがOFFでも有効です。 |
| Fit View | すべてのノードが画面に収まるようにズームとスクロール位置を自動調整します。 |
| 新規ドキュメント | 現在の編集内容を消去して新しいドキュメントを開始します。実行前に確認ダイアログが表示されます。 |
| エクスポート | SVG・PNG・PDF形式でキャンバスをエクスポートするパネルを開きます。もう一度クリックすると閉じます。 |
| 設定 | UIテーマ(ライト/ダーク)と表示言語を変更するパネルを開きます。もう一度クリックすると閉じます。 |
パネルグループ
ツールバー右端のボタン群でパネルを切り替えます。アクティブなボタンはハイライト表示され、パネルの左辺をドラッグすると全パネル共通の幅を変更できます。幅はドキュメントに保存され、最小 300px、最大はウィンドウ幅の 50% です。
| ボタン | 操作内容 |
|---|---|
| プロパティパネル | 選択中のノードのプロパティ(フォント・色・サイズなど)を表示します。ノードが未選択のときはパネルは非表示になります。 |
| レイヤーパネル | すべてのノードの一覧をレイヤー順に表示します。順序の並べ替えや表示/非表示の切り替えができます。 |
| ドキュメント設定パネル | キャンバスのサイズ・単位・向きを設定します。コンテンツに合わせてキャンバスをリサイズする機能もあります。 |
| グリッド・スナップ設定パネル | グリッドの表示・間隔と、スナップ(グリッドへの吸着・ノードへの吸着)を設定します。 |
| アイコンライブラリパネル | GCP・Google・AWS・Cloudflare・Sakura Cloud・Twemoji・React Icons のアイコンを検索してキャンバスにドラッグ&ドロップできます。 |
キーボードショートカットでも多くの操作を行えます。詳細はキーボードショートカットのページを参照してください。