一
ソフトウェア概要
このソフトウェアは、江戸幕府 全15代将軍(1603〜1867年)の系譜を
インタラクティブな樹形図として可視化するWebアプリケーションです。
将軍の直系継承だけでなく、御三家・御三卿・正室・側室まで含めた 徳川家の全体像を一覧できる歴史資料ビューアーとして機能します。
将軍の直系継承だけでなく、御三家・御三卿・正室・側室まで含めた 徳川家の全体像を一覧できる歴史資料ビューアーとして機能します。
15
代の将軍
264
年の幕政(1603-1867)
40+
登録人物数
5
人物カテゴリ
二
主な機能
インタラクティブ系譜図
SVGで描画された系譜図上で、ノード(人物)をクリックすると右側に詳細情報が表示されます。
人物詳細パネル
生没年・在職年数・官位・略伝・主な功績・関連人物など、豊富な歴史情報をサイドバーで確認できます。
表示フィルター
「将軍系統」「御三家」「全表示」の3モードを切り替え、目的に合わせて関係図を絞り込めます。
ズーム&パン操作
+/-ボタンや Ctrl+ホイールでズームイン・アウト。ドラッグでスクロールできます。
ホバーツールチップ
ノードにマウスを重ねると、名前・生没年・在職期間のクイック情報が即座に表示されます。
関連人物ナビゲーション
詳細パネル内の「関連人物」リストをクリックすることで、親子・師弟関係を辿ることができます。
三
使い方の流れ
STEP 1
フィルター選択
上部ボタンで表示する系統(将軍・御三家・全体)を切り替える
STEP 2
ズーム調整
+/-で全体を俯瞰または詳細に拡大して見やすい倍率に調整
STEP 3
ノードをクリック
知りたい人物のカードをクリックすると右サイドバーに詳細が表示
STEP 4
関連人物を辿る
詳細パネルの「関連人物」リンクから親子関係を連続して確認
四
人物カテゴリと配色
人物はその役割に応じて5つのカテゴリに分類され、それぞれ異なる色で表示されます。
創始者
初代 徳川家康
征夷大将軍
2〜15代将軍
御三家
尾張・紀伊・水戸
御三卿
田安・一橋・清水
正室・側室
篤姫・和宮 など
五
接続線の種類
| 線の種類 | 色・スタイル | 意味 |
|---|---|---|
| 直系 | 青色・実線 | 将軍家内の父子による直接継承 |
| 継承 | 金色・破線 | 御三家など傍系からの将軍継承(例:吉宗・家茂・慶喜) |
| 傍系 | 赤色・破線 | 血筋が直系でない継承関係 |
| 御三家 | 緑色・破線 | 尾張・紀伊・水戸の藩主家の親子関係 |
| 御三卿 | 黄土色・破線 | 田安・一橋家の親子関係 |
| 婚姻 | 紫色・点線 | 将軍と正室・側室の婚姻関係 |
六
収録主要人物(一部抜粋)
| 人 物 | カテゴリ | ハイライト情報 |
|---|---|---|
| 徳川 家康 | 創始者 | 江戸幕府開府(1603)、関ヶ原の戦い勝利、大坂の陣 |
| 徳川 家光 | 3代将軍 | 参勤交代制度化、鎖国体制完成、島原の乱鎮圧 |
| 徳川 吉宗 | 8代将軍 | 享保の改革、目安箱設置、御三卿創設 |
| 徳川 家斉 | 11代将軍 | 在職50年・子女55名、化政文化全盛期 |
| 徳川 慶喜 | 15代将軍 | 大政奉還(1867)、幕府最後の将軍 |
| 徳川 光圀 | 御三家 | 水戸黄門、「大日本史」編纂開始 |
| 天璋院 篤姫 | 正室 | 大奥最高権力者、江戸城無血開城に貢献 |
| 和宮 親子内親王 | 正室 | 孝明天皇の妹、公武合体の象徴 |
七
技術仕様
外部ライブラリ・フレームワーク不要の純粋なWebフロントエンドで動作します。
HTML5
CSS3(CSS Variables)
Vanilla JavaScript (ES6+)
SVG(インライン描画)
Google Fonts(Noto Serif/Sans JP)
サーバー不要(静的ファイル)
| 項目 | 仕様 |
|---|---|
| 描画エンジン | SVG(2500×1220px 仮想キャンバス) |
| ズーム範囲 | 20%〜300%(初期値 75%) |
| 操作方式 | クリック選択・ドラッグパン・ホイールズーム・ボタン操作 |
| レスポンシブ | 768px以下でサイドパネルが下部に移動 |
| アニメーション | CSS Keyframes(家紋浮遊・選択グロー・パネルフェード) |