間取り図作成
無料の間取り図作成ツール:壁を描いてドア・窓・家具を配置、寸法と面積(m²・坪)を自動計算、3D表示も。共有リンクで家族に送れます。登録不要、データ送信なし。
- 坪数を自動計算
- ドア・家具を配置
- 3Dで室内を歩く
- リンクで共有
間取り図はこのブラウザ(localStorage)に自動保存され、アップロードはされません。端末を変える前や閲覧データを消す前に「JSON 書き出し」でバックアップしてください。
🔒 計算はすべてブラウザ内で行われ、データがサーバーに送信されることはありません。
こんなときに使えます
- 物件探し・住宅購入:間取り図や実測をもとに平面図を描き、坪数や家具が入るかどうかを確認できます。
- リフォーム・引っ越し前の計画:ベッドやソファ、収納を図面上に置いていろいろな配置を試してから、購入するサイズを決められます。
- 設計者や家族との相談:「共有リンクをコピー」で送れば、相手は開くだけで同じ図面と 3D 表示を見られます。
- 賃貸・シェアハウスの募集:部屋の間取りと広さを描いて、「PNG 書き出し」した画像を募集投稿に使えます。
使い方
- 「長方形の部屋」でドラッグして部屋を作るか、「壁を描く」で点を順にクリックします。描画中は長さ(cm)を入力して Enter でも確定できます。壁が一周つながると、右側に面積と坪数が自動で表示されます。
- 左のパーツからドアや窓を選び、壁をクリックすると配置できます。家具はクリックで画面中央に置かれ、選択してドラッグで移動、四隅で大きさ変更、丸いハンドルで回転。右のパネルで正確な数値も入力できます。
- 「3D」で立体表示し、一人称視点に切り替えると室内を歩けます。完成したら「PNG 書き出し」で画像に、「JSON 書き出し」でバックアップし、あとで「JSON 読み込み」で続きを編集できます。
使用例
最初に表示されるサンプルは 6 m × 4 m のワンルーム(壁厚 12 cm)です。右のパネルには「空間 1」として、中心線面積 24.00 m²(7.26 坪)、室内有効面積 22.81 m²(6.90 坪)、周長 20.00 m と表示されます。有効面積は各壁の厚みの半分 6 cm ずつを引いた 5.88 m × 3.88 m です。
同じ部屋の左の壁から 2.5 m の位置に厚さ 10 cm の間仕切り壁を、上下の端を壁の中心線に合わせて追加すると、自動で 2 部屋に分かれます。空間 1 は中心線 10.00 m²(3.03 坪)、有効 9.27 m²(2.81 坪)、周長 13.00 m。空間 2 は中心線 14.00 m²(4.24 坪)、有効 13.15 m²(3.98 坪)、周長 15.00 m。2 部屋の中心線面積の合計は 24.00 m² のままです。
「部屋をすばやく作成」で 1000 × 1000 cm、壁厚 15 cm の空間を作ると、中心線面積 100.00 m²(30.25 坪)、室内有効面積 97.02 m²(29.35 坪)になります。壁が厚いほど 2 つの面積の差が大きくなります。
結果の見方
- 中心線面積は壁の中心で囲んだ広さで、日本の広告に載る専有面積(壁芯面積)と同じ考え方です。室内有効面積は壁の内側で実際に使える床の広さで、登記簿の内法面積に近く、床材やラグの購入、家具が入るかの確認に使えます。
- 数値は小数点以下 2 桁に四捨五入して表示します。たとえば 10 m² は 3.025 坪なので 3.03 坪と表示されます。合計行は各空間の面積を足してから換算しており、画面上の坪数を足したものではありません。
- 周長は中心線を一周した長さで、巾木や廻り縁の長さの目安になりますが、実際の室内の周長は角ごとに壁厚の半分ずつ短く、ドアの幅も引いていません。
- 面積パネルに空間が出てこない場合、その壁はつながっていません。壁の端点どうしが重なっていること(描画時に近くの端点へ自動吸着します)、間仕切り壁の端が別の壁の中心線上にあることを確認してください。
仕組みと計算方法
- 寸法はすべて cm で保存し、壁は中心線と厚みで表します。描画中、既存の端点が画面上 12 ピクセル以内にあればそこへ接続し、スナップがオンなら角度を 15° 刻み、長さを選んだ間隔(1・5・10・50 cm)に合わせます。
- 閉じた空間の検出:壁を T 字の接合部と交差部で分割し、0.5 cm 以内の端点を同じ点とみなし、片側だけつながった壁を繰り返し取り除きます。次に各点の壁を角度順に並べ、常に同じ側へ曲がりながら一周たどり、面積が正になる輪を 1 つの空間とします。面積は座標を交差に掛け合わせる靴ひも公式(ガウスの面積公式)で求めます。
- 室内有効面積:空間の各辺を、その壁の厚みの半分だけ内側へずらし、隣り合う線の交点を新しい頂点として再び靴ひも公式で計算します。壁が空間より厚く、辺の向きが反転する場合は「計算できません」と表示します。
- 坪数 = m² ÷(400/121)で、当サイトの単位換算ツールと同じ係数です。1 m² = 10,000 cm²。
- 3D 表示は初めて開いたときに three.js を読み込み、ドアや窓の位置で壁を上下左右に分けて開口部を作ります。一人称視点では体を半径 22 cm の円柱として衝突判定し、床から始まり高さ 180 cm 以上のドアは通れますが、窓は通れません。
注意点と制限
- 壁は直線のみで、曲面の壁には対応していません。斜めの壁は描けますが、面積は頂点を結んだ形で計算します。
- 外周とつながらず部屋の中に独立して立つ壁(4 枚の壁で描いた柱など)は、外側の部屋の面積から引かれません。間仕切り壁が中心線まで届かず壁の表面で止まっている場合も、部屋は分割されません。
- 有効面積は柱やパイプスペース、家具を差し引きません。面積は計画用の目安で、正式な測量や登記の面積の代わりにはなりません。
- 1 つの図面は 1 フロアのみです。図面は 1 つのブラウザの localStorage にあり、サイトデータを消すと失われます。3D 表示には WebGL 対応のブラウザが必要です。
よくある質問
坪数はどう換算していますか?
1 坪 = 400/121 m²(約 3.3058 m²)として、坪数 = m² ÷ 3.3058 で計算します。6 m × 4 m の部屋は 24 m² で約 7.26 坪です。壁の中心線で測った面積と、壁の厚みを引いた室内の有効面積の両方を表示します。
不動産の資料の面積と違うのはなぜ?
マンションの登記面積は壁の内側、広告の専有面積は壁の中心線で測るなど基準が資料によって異なり、バルコニーや共用部分の扱いも違います。このツールは描いた壁に囲まれた空間だけを計算します。家具が置ける広さを知りたいときは「室内有効面積」を見てください。
描いた間取りはどこに保存されますか?
変更するたびにこのブラウザの localStorage に自動保存され、ページを閉じても残りますが、サーバーには送信されません。閲覧データの削除、シークレットウィンドウ、別の端末では表示されないため、大事な図は「JSON 書き出し」でバックアップしてください。
スマホでも使えますか?
使えます。空いている所を 1 本指でドラッグして移動、2 本指でズーム、選択した家具はドラッグで動かせます。壁はタップごとに点が追加され、描き終えたら「壁の描画を終了」を押します。複雑な間取りはパソコンの方が編集しやすいです。
間取り図を家族や設計者に見せるには?
「共有リンクをコピー」を押すと、壁・ドア・窓・家具が圧縮されてURLの「#」以降に入り、相手は同じ間取り図を開いて3D表示にも切り替えられます。この部分はサーバーに送信されません。画像だけでよければ「PNGで保存」を使ってください。
部屋の寸法を正確に測るには?
メジャーやレーザー距離計で壁の内側の縦と横(cm)を測り、ドアや窓は幅と壁の角からの距離を測ります。壁を描くときは長さを入力して Enter を押せば確定できます。
実際に使える部屋の広さ(坪数)もわかりますか?
壁で部屋を囲むと、中心線面積と室内有効面積(壁の厚みを差し引いた広さ)が同時に表示されます。実際に使える広さに近いのは室内有効面積です。
描いた間取り図は印刷できますか?
「PNG 書き出し」で画像として保存すれば印刷できます。図には寸法と縮尺が表示されるので、実際の空間と照らし合わせやすくなります。
参考資料
- 地籍測量實施規則 — 臺北市法規查詢系統(內政部發布之地籍測量實施規則)
- Canvas API — MDN Web Docs
- WebGL: 2D and 3D graphics for the web — MDN Web Docs