何ができるか マス目をなぞると部屋になり、ドアと窓を置くと壁に開口が空き、家具を並べると 3D の中に実寸で現れます。 自社サイトの物件ページや相談ページに、そのまま置ける形にしてあります。 ・間取りを描く ── 0.5 m のマス目をなぞって部屋を作ります。部屋名は 19 種類、建物の外形は 4〜16 m、階数は平屋と 2 階建てから選べます ・建具を置く ── ドア・引き戸・窓（腰窓／掃き出し窓）を壁の上に 0.25 m 刻みで。吊元と開く側も選べ、3D の壁には開口が空きます ・収納と階段 ── クローゼット・押入・玄関収納・階段の 4 種。3D では棚板まで組み立てます ・ベランダと玄関ポーチ ── 外壁の面に取り付けます。奥行き 0.5〜3.0 m、手すりの有無つき ・家具を実寸で置く ── 18 種類。ベッドは S / SD / D / Q、テレビは 43 / 55 / 65 / 75 インチから画面の幅を計算します ・広さを数字で見る ── 部屋ごとに面積（m²）と帖。家具と建具には 幅 × 奥行き × 高さ を出し、その場で打ち替えられます ・案を並べて比べる ── 案を 10 件まで持てます。複製して名前を変えれば見比べられます ・図を書き出す ── 間取り図・3D・両方を並べた 1 枚を PNG で。A4 横 1 枚に組み直して印刷（PDF 保存）もできます 見本 https://suminawa.dev/projects/floorplan で、マス目を塗って 3D で見るところまで試せます。 無料の見本には、建具・収納・ベランダ・家具の実寸・寸法表示・複数案・書き出しが入っていません（外形も 9 × 8 m の固定です）。そこから先がこの商品です。 置き方 embed/ の 3 ファイルを同じ階層に置き、ページに 5 行貼ります。 <link rel="stylesheet" href="./floorplan-simulator.css"> <div id="floorplan"></div> <script src="./floorplan.global.js"></script> <script defer src="./floorplan-3d.global.js"></script> <script>FloorplanSimulator.mount(document.getElementById("floorplan"));</script> WordPress のカスタム HTML にも貼れます。ビルドの道具は要りません。React と Next.js 向けの束も同梱しています。page/index.html はダブルクリックで開く単体ページなので、お客さまにお渡しする使い方もできます。描いた間取りはブラウザの中（localStorage）にだけ残り、外部のサーバーには何も送りません。 設定で変えられること 項目 内容 plan 最初に出す間取り（物件データの流し込み） readonly 見せるだけにする。物件ページ向け features.* 3D の有無（外すと three.js を読み込まず、gzip でおよそ 250 KB 軽くなります）、階数の上限、案の切替・書き出し・印刷 catalog.rooms ／ furniture ／ openings ／ sizes 部屋名・家具・建具・外形のプリセット scene.* 3D の中の色（壁・見切り・屋根・床・内装）と自動回転 labels 画面の文言。英語にもできます --fp-*（CSS） 間取り図と操作列の色・角丸・書体（18 個） 価格とライセンス 発売記念価格 ¥8,800（9 月 19 日 まで）。以降は ¥9,800 です。発売記念価格で買うと、その後の 1.x アップデートも無料で受け取れます。個人・組織ライセンスがあり、再配布・転売・同種商品化は禁止です。note の有料記事版も同価格です。購入後 14 日間、不具合のご連絡に対応します（hello@suminawa.dev）。 zip の中身 embed（貼る 4 ファイル）/ page（単体ページ）/ dist / src / styles / samples（間取りの JSON 3 つ）/ demo / README.ja.md / LICENSE.md / CHANGELOG.md / package.json ほか。