間取り図PDFをAIに渡すだけで自分の家を3D化する手順書｜Claude Code / Codex用

このタスクの本質

間取り図PDF → 3Dモデルの変換は、画像解析AIに丸投げするのではなく、「図面を人間と同じように読んで、座標テーブルに転記し、コードで3Dシーンを生成する」 というアプローチを取ります。理由は次のとおりです。

• 日本の住宅図面（特に一条工務店）は910mmモジュールのグリッドに完全に乗っている。グリッド番号を数えるだけで座標が確定するため、画像から寸法を推定するより圧倒的に正確
• 既存のAI自動変換ツール（FloorplanToBlender3d、CubiCasa5K等）は欧米の間取りで学習されており、日本の図面記号・尺モジュールでの精度が低い
• 生成スクリプトを経由することで、後から一部だけ修正・再生成が容易になる

使用ツール

作業フロー

図面PDF
  ↓ ① pdftoppmで200dpi PNG化 + 4分割クロップ
図面画像（精読可能な解像度）
  ↓ ② グリッド番号で壁・建具・部屋を座標テーブルに転記
座標テーブル（Pythonコード内）
  ↓ ③ generate_scene.py 実行
シーンJSON（{nodes, rootNodeIds}形式）
  ↓ ④ pascal-editorにLoad Build
ブラウザ3Dモデル
  ↓ ⑤ 2D/3D表示を図面と突き合わせて差分修正（2〜3周）
完成

品質基準（これを満たすまで完成としない）

1. 全部屋の位置・広さが平面図と一致（帖数の検算が合う）
2. 全開口部（窓・ドア）が図面の位置・サイズと一致
3. 屋根形状が立面図4面すべてと一致
4. 外装の色・素材が立面図（カラー）と一致
5. 図面に描かれている設備（キッチン・浴槽・トイレ等）が配置されている

1-1. 必要なコマンドの確認とインストール

# バージョン確認
node --version    # v20以上が必要
python3 --version # 3.9以上が必要
bun --version     # 未インストールなら次のコマンド

Bunが未インストールの場合:

# macOS / Linux
curl -fsSL https://bun.sh/install | bash

# Windows (PowerShell)
powershell -c "irm bun.sh/install.ps1 | iex"

pdftoppm（poppler）が未インストールの場合:

# macOS
brew install poppler

# Ubuntu / Debian
sudo apt install poppler-utils

# Windows: https://github.com/oschwartz10612/poppler-windows/releases からダウンロード

1-2. 3Dエディタのクローンとセットアップ

重要: ユーザーのプロジェクトリポジトリの 外側 にクローンしてください。中に置くとgitが入れ子になります。

cd ~/Documents
git clone --depth 1 https://github.com/pascalorg/editor.git pascal-editor
cd pascal-editor
bun install    # 数分かかる。node_modulesは1GB超になる

1-3. 開発サーバー起動

cd ~/Documents/pascal-editor
bun run dev    # → http://localhost:3002 で起動

バックグラウンド実行し、curl -s -o /dev/null -w "%{http_code}" http://localhost:3002 が200を返すまで待機してください。

1-4. 作業ディレクトリの作成

mkdir -p ~/Documents/floorplan-3d

つまずきポイント

• bun install が失敗する場合、Node v20未満の可能性。nodebrew/nvm等でv20以上に切り替える
• ポート3002が使用中なら lsof -ti:3002 | xargs kill -9 で解放
• WebGPU非対応ブラウザ（古いSafari等）では表示されない。Chrome最新版を推奨

2-1. PDFの構成を把握する

まずPDFの各ページに何が描かれているかを一覧化します。

# 全ページのテキストから図面種別を抽出
for i in $(seq 1 $(pdfinfo ~/Desktop/図面.pdf | grep Pages | awk '{print $2}')); do
  echo "=== Page $i ==="
  pdftotext -f $i -l $i ~/Desktop/図面.pdf - 2>/dev/null | grep -E "平面図|立面図|電気|矩計|配置図|仕上表" | head -3
done

一条工務店の図面PDFの典型的な構成:

2-2. 精読可能な解像度で画像化

重要: デフォルトの低解像度PNGでは寸法線や記号が読み取れません。必ず200dpiで書き出してください。

cd ~/Documents/floorplan-3d
# 平面図（ページ番号は2-1で特定したもの）
pdftoppm -f 3 -l 3 -r 200 -png ~/Desktop/図面.pdf plan
# 立面図
pdftoppm -f 4 -l 4 -r 150 -png ~/Desktop/図面.pdf elev
# 電気図面
pdftoppm -f 2 -l 2 -r 200 -png ~/Desktop/図面.pdf elec

2-3. 4分割クロップして読む

200dpiの全体画像（3300×2300px程度）をそのまま読むと、AIの画像認識では細部が潰れます。必ず4分割して2倍に拡大してから読んでください。

from PIL import Image
im = Image.open('plan-03.png')
# 図面本体の領域を推定クロップ（余白・図枠を除く）
body = im.crop((350, 100, 2150, 2150))
bw, bh = body.size
quadrants = {
 'nw': (0, 0, bw//2+100, bh//2+100),
 'ne': (bw//2-100, 0, bw, bh//2+100),
 'sw': (0, bh//2-100, bw//2+100, bh),
 'se': (bw//2-100, bh//2-100, bw, bh),
}
for k, box in quadrants.items():
    c = body.crop(box)
    c.resize((c.width*2, c.height*2), Image.LANCZOS).save(f'plan-{k}.png')

各象限を Read ツールで画像として読み込み、記号・寸法・室名を読み取ります。

3-1. 910mmモジュール（尺モジュール）が最重要

日本の在来工法・一条工務店の図面は、910mm（3尺）のグリッドに完全に乗っています。図面の外周に X0 X1 X2 ... Y0 Y1 Y2 ... という通り芯番号が振られており、これが910mmピッチです。

つまり、寸法を測る必要はありません。グリッドを数えるだけです。

座標変換は単純です。

M = 0.91  # 1グリッド = 910mm = 0.91m
def p(mx, my):
    return [mx * M, -my * M]   # 北をマイナスZにする（pascal-editorの座標系）

3-2. 検算式（転記ミスの早期発見）

読み取ったグリッド数が正しいか、図面に書かれた面積表と突き合わせます。

• 建物寸法の検算: 10,010mm = 11グリッド × 910、8,190mm = 9グリッド × 910
• 床面積の検算: グリッドマス数 × 0.8281㎡（0.91² = 0.8281）
• 帖数の検算: グリッドマス数 ÷ 2（例: 9マス = 4.5帖）

図面の「延床面積 69.66㎡ / 21.07坪」のような記載と一致すれば転記成功です。

3-3. 一条工務店の図面記号の読み方

建具記号（窓・ドア）

一条の窓記号は J JK JF VS などの記号 + 4桁数字で構成されます。数字は 幅×高さを尺貫法または実寸で表現 しています。

重要: 数字から寸法を推定する際、確信が持てないものは図面の建具表（別ページにあることが多い）で確認してください。推定値を使う場合は、その旨をユーザーに報告します。

設備記号

図面の線種

• 太い実線: 壁（外壁は特に太い）
• 細い一点鎖線: 通り芯（グリッド線）
• 破線: 上部にあるもの（吊戸棚・下がり天井・小屋裏）
• ハッチング（斜線）: 土間・タイル・デッキなどの床仕上げ違い

3-4. 電気図面の読み方（コンセント・スイッチ・照明）

電気図面は平面図に赤字で設備が重ねて描かれています。位置と高さの両方が読み取れます。

電気設備を3Dに反映する方法

pascal-editorでは、コンセント・スイッチは 壁に取り付くitem として配置できます。

# 壁付けアイテムの配置例
# wallId で壁を指定し、wallT (0〜1) で壁上の位置、position[1] で高さを指定
{
  "type": "item",
  "parentId": "<wall_id>",
  "wallId": "<wall_id>",
  "wallT": 0.35,                     # 壁の始点から35%の位置
  "position": [0.35 * wall_length, 0.25, 0],   # [壁沿い距離, 高さ, 壁からのオフセット]
  "asset": {
    "id": "power-outlet",
    "src": "/items/power-outlet/model.glb",
    "thumbnail": "/items/power-outlet/thumbnail.webp",
    "dimensions": [0.12, 0.12, 0.03],
    "attachTo": "wall",
    ...
  }
}

利用可能なGLBアセットは ~/Documents/pascal-editor/apps/editor/public/items/ を ls して確認してください。照明系は ceiling-light ceiling-lamp circular-ceiling-light floor-lamp などがあります。

注意: コンセントは1軒で50〜80箇所あるため、全部配置すると視認性が落ちます。ユーザーに「全部配置するか、主要なものだけにするか」を確認してください。

3-5. 図面読み取りの落とし穴（実際にハマったもの）

4-1. pascal-editorのシーンJSON仕様

シーン全体は {"nodes": {id: node}, "rootNodeIds": [...]} という形式です。

座標系: メートル単位、Y-up（Yが高さ）、右手系。2D座標は [x, z] で、北が −Z 方向。

ノード階層: site → building → level → 壁・床・部屋・屋根・家具

ID規則（重要）: IDは型プレフィックス必須です。間違えるとインポートが拒否されます。

4-2. 生成スクリプトのテンプレート

~/Documents/floorplan-3d/generate_scene.py として作成します。以下は実際に動作した完全なテンプレートです。座標テーブル部分（壁・窓・部屋の定義）だけをユーザーの図面に合わせて書き換えてください。

#!/usr/bin/env python3
"""間取り図 → pascal-editor シーンJSON 生成

座標系: メートル, Y-up。x = 東(+), z = 南(+)（北 = -z）
モジュール座標 (mx, my): グリッド番号。my は北向きに増加
変換: x = mx * M, z = -my * M
"""
import json

M = 0.91       # 1モジュール = 910mm（メーターモジュールなら 1.0）
EXT_T = 0.16   # 外壁厚
INT_T = 0.12   # 間仕切壁厚
WALL_H = 2.40  # 天井高（一条標準 2400）

nodes = {}

def p(mx, my):
    return [round(mx * M, 4), round(-my * M, 4)]

def add(node):
    nodes[node["id"]] = node
    return node["id"]

def base(id_, type_, name, parent, **extra):
    n = {"object": "node", "id": id_, "type": type_, "name": name,
         "parentId": parent, "visible": True, "metadata": {}}
    n.update(extra)
    return n

LEVEL = "level_1f"

# ============ 壁 ============
# 【向きの規約・重要】進行方向の左手が屋外になる順序で描く
# （back面 = 左手側 = exterior 扱いのため。逆だと外装が室内側に付く）
walls = []
def wall(id_, s, e, t, name):
    walls.append((id_, s, e, t, name))

# 外周壁（グリッド座標で指定。ここをユーザーの図面に合わせて書き換える）
wall("wall_ext_s",  (11, 1), (0, 1),  EXT_T, "外壁 南")
wall("wall_ext_e",  (11, 8), (11, 1), EXT_T, "外壁 東")
wall("wall_ext_n",  (0, 8),  (11, 8), EXT_T, "外壁 北")
wall("wall_ext_w",  (0, 1),  (0, 8),  EXT_T, "外壁 西")
# 間仕切壁
wall("wall_p1", (0, 5.5), (2, 5.5), INT_T, "浴室 南")

wall_children = {w[0]: [] for w in walls}

# ============ 開口部（窓・ドア）============
# dist = 壁の start からの中心距離[m]
def window(id_, wall_id, dist_m, width, height, center_y, wtype="sliding", name=""):
    add(base(id_, "window", name or id_, wall_id,
             position=[round(dist_m, 4), round(center_y, 4), 0],
             rotation=[0, 0, 0], wallId=wall_id,
             width=width, height=height,
             windowType=wtype, openingKind="window"))
    wall_children[wall_id].append(id_)

def door(id_, wall_id, dist_m, width, height, dtype="hinged", name=""):
    add(base(id_, "door", name or id_, wall_id,
             position=[round(dist_m, 4), round(height / 2, 4), 0],
             rotation=[0, 0, 0], wallId=wall_id,
             width=width, height=height, doorType=dtype))
    wall_children[wall_id].append(id_)

# 例: 南面の大開口（start が X11 なので dist は X11 からの距離）
window("window_main", "wall_ext_s", (11 - 5.65) * M, 2.51, 2.15, 0.05 + 2.15/2,
       "sliding", "大開口スライディング")
door("door_entrance", "wall_ext_n", 1.5 * M, 0.98, 2.30, "hinged", "玄関ドア")

# ============ 壁ノードの登録 ============
EXT_TILE = {"properties": {"color": "#3d4045", "roughness": 0.65, "metalness": 0.05}}
for wid, s, e, t, name in walls:
    extra, front, back = {}, "unknown", "unknown"
    if wid.startswith("wall_ext_"):
        extra["exteriorMaterial"] = EXT_TILE
        front, back = "interior", "exterior"
    add(base(wid, "wall", name, LEVEL,
             start=p(*s), end=p(*e), thickness=t, height=WALL_H,
             children=wall_children[wid],
             frontSide=front, backSide=back, **extra))

# ============ 床スラブ ============
outline = [(0, 1), (11, 1), (11, 8), (0, 8)]
add(base("slab_floor", "slab", "1階床", LEVEL,
         polygon=[p(*pt) for pt in outline], holes=[], holeMetadata=[],
         elevation=0.02, thickness=0.2, autoFromWalls=False))

# ============ ゾーン（部屋）============
zone_defs = [
    ("zone_ldk", "LDK (22.42帖)", [(0,1),(8,1),(8,8),(0,8)], "#f59e0b"),
]
for zid, name, poly, color in zone_defs:
    add(base(zid, "zone", name, LEVEL,
             polygon=[p(*pt) for pt in poly],
             autoFromWalls=False, boundaryWallIds=[],
             spaceRole="room", roomNumber="", enclosureStatus="auto",
             floorFinish="", wallFinish="", ceilingFinish="",
             ceilingHeight=WALL_H, occupancy="",
             clearDimensionPolicy="none", color=color))

# ============ 屋根 ============
# 【重要】roof-segment は必ず roof ノードの子にする
PITCH = 19.29   # 3.5寸勾配 = atan(3.5/10)。4寸なら21.8、5寸なら26.57
PI = 3.14159265
SOLAR_TOP = {"properties": {"color": "#1f2630", "roughness": 0.3, "metalness": 0.25}}
ROOF_EDGE = {"properties": {"color": "#2a2d31", "roughness": 0.5, "metalness": 0.1}}
DARK_TILE = {"properties": {"color": "#3d4045", "roughness": 0.65, "metalness": 0.05}}

def rseg(id_, name, mx0, mx1, my0, my1, rot, pos_y, wall_h, **extra):
    cx, cz = (mx0 + mx1) / 2 * M, -(my0 + my1) / 2 * M
    return add(base(id_, "roof-segment", name, "roof_1",
                    position=[round(cx, 3), pos_y, round(cz, 3)], rotation=rot,
                    width=round((mx1 - mx0) * M, 3), depth=round((my1 - my0) * M, 3),
                    roofType="shed", pitch=PITCH, wallHeight=wall_h, overhang=0.25,
                    wallThickness=0.1, deckThickness=0.1, shingleThickness=0.05,
                    children=[], **extra))

# shed（片流れ）は local -Z 側が高い。rotation=PI で南向きに反転
rseg("rseg_main", "大屋根", 0, 11, 0.5, 5.75, 0.0, 2.40, 0.10)
rseg("rseg_north", "北下屋", 0, 11, 5.75, 8.5, PI, 2.40, 0.62)

add(base("roof_1", "roof", "屋根", LEVEL, position=[0,0,0], rotation=0,
         topMaterial=SOLAR_TOP, edgeMaterial=ROOF_EDGE, wallMaterial=DARK_TILE,
         children=["rseg_main", "rseg_north"]))

# ============ 家具・設備 ============
# 【重要】asset.thumbnail が必須。無いとインポート拒否される
ITEM_IDS = []
def item(id_, asset_id, dims, offset, mx, my, ry=0.0, scale=(1,1,1), name=""):
    ITEM_IDS.append(id_)
    add(base(id_, "item", name or asset_id, LEVEL,
             position=[round(mx*M, 3), 0, round(-my*M, 3)],
             rotation=[0, ry, 0], scale=list(scale), children=[],
             asset={"id": asset_id, "name": name or asset_id, "category": "furniture",
                    "thumbnail": f"/items/{asset_id}/thumbnail.webp",
                    "src": f"/items/{asset_id}/model.glb",
                    "dimensions": dims, "offset": offset,
                    "rotation": [0,0,0], "scale": [1,1,1]}))

HPI = 1.5708  # 90度
item("item_kitchen", "kitchen", [2.5,1.1,1], [0,0,0], 5.5, 5.85, 0, (1.08,1,0.75), "キッチン")

# ============ 階層 ============
add(base(LEVEL, "level", "1階", "building_1", level=0, height=3.0,
         children=[w[0] for w in walls] + ["slab_floor"]
                  + [z[0] for z in zone_defs] + ["roof_1"] + ITEM_IDS))
add(base("building_1", "building", "自邸", "site_1",
         position=[0,0,0], rotation=[0,0,0], children=[LEVEL]))
add(base("site_1", "site", "敷地", None,
         polygon={"type": "polygon",
                  "points": [p(-3,-3), p(14,-3), p(14,14), p(-3,14)]},
         children=["building_1"]))

graph = {"nodes": nodes, "rootNodeIds": ["site_1"]}
import os
out = os.path.expanduser("~/Documents/floorplan-3d/my-house.json")
with open(out, "w", encoding="utf-8") as f:
    json.dump(graph, f, ensure_ascii=False, indent=1)
print(f"nodes: {len(nodes)} -> {out}")

4-3. 家具アセットの一覧を確認する

ls ~/Documents/pascal-editor/apps/editor/public/items/

主要なアセットと標準寸法 [幅, 高さ, 奥行]:

dimensions はアセット固有の値なので上表のとおりに指定し、実際のサイズ調整は scale で行います（例: 幅1,800mmのカップボードなら scale=(0.9, 1, 0.5)）。

5-1. シーンの生成とインポート

cd ~/Documents/floorplan-3d && python3 generate_scene.py

ブラウザで http://localhost:3002 を開き、次の手順でインポートします。

1. 左サイドバーの 歯車アイコン（設定）をクリック
2. SAVE & LOAD セクションの Load Build をクリック
3. 生成した my-house.json を選択
4. スキーマ検証ダイアログが出る → エラーがなければ Replace current scene

AIが自動でこれを行う場合: chrome-devtools MCPが使える環境なら、Load Build ボタンのuidに対して upload_file を実行することでファイル選択ダイアログを経由せず直接インポートできます。ブラウザ操作MCPがない場合は、ユーザーに手動操作を依頼してください。

5-2. 検証の2軸

5-3. 修正ループ

差分を見つけたら generate_scene.py の座標テーブルを修正 → 再生成 → 再インポート、を繰り返します。2〜3周は必ず必要です。

チェックリスト:

• 全部屋の位置・広さが平面図と一致しているか
• 帖数の検算が合っているか
• 窓・ドアの位置とサイズが図面どおりか
• 立面図に描かれていない窓を付けていないか（頻出ミス）
• 屋根の勾配・段差・軒の出が立面図4面と一致しているか
• 外壁・屋根の色がカラー立面図と一致しているか
• 設備（キッチン・浴槽・トイレ・洗面台）が図面の位置にあるか
• 設備の出っ張り・向きが図面どおりか

カメラ操作（AIがスクリプトで操作する場合）

// ズーム
const canvas = document.querySelector('canvas');
const r = canvas.getBoundingClientRect();
canvas.dispatchEvent(new WheelEvent('wheel', {
  clientX: r.left + r.width/2, clientY: r.top + r.height/2,
  deltaY: 120, bubbles: true, cancelable: true   // 正=ズームアウト
}));

回転は画面下部の Orbit Left / Orbit Right ボタン（45°刻み）を使うのが確実です。ポインタイベントでのドラッグ回転は座標計算が煩雑になります。

すべてのエクスポートは 設定（歯車）→ EXPORT セクションから行えます。

発展: さらに精度を上げるには

1. 電気設備の配置 — Step 3-4の電気図面の読み方に従い、コンセント・スイッチ・照明を壁付けitemとして配置
2. 下がり天井の再現 — CH=2200 などの記載がある部屋は ceiling ノードで個別に天井を作る
3. 敷地・外構 — 配置図から敷地形状・駐車場・アプローチをslabとfenceで追加
4. 太陽光パネルの分割表現 — solar-panel ノードで実際の枚数・配列を再現
5. 家具の実物寸法化 — 実際に購入する家具のサイズでscaleを調整すれば、家具配置シミュレーションになる