Drain Cover Generator

概要

既製品のドレンカバーが合わない、サイズ感を変えたい、髪の毛・ゴミの捕集効率を上げたい——そんなときに、自分の浴室の寸法に合わせて 1 枚だけ 3D プリントできるよう設計しました。

👆 上の埋め込みは実際に動くツールです。スライダーを動かして試せます。フル画面で開く →

特徴

スライダー 1 本ずつで形状が即時反映されます。難しい CAD の知識は不要です。

🎛

パラメトリック

外径・厚み・凹みサイズ・メッシュ寸法を全てスライダーで調整。リアルタイムに 3D 形状へ反映。

👁

ブラウザ 3D ビュー

Three.js による回転・ズーム・パン。スマホでも 1 本指回転 / 2 本指でズーム & パン対応。

🕳

同心円リング状メッシュ

底面と側壁にケージ状の排水穴を生成。穴サイズと桟幅を独立に制御。

⛰

ヘアキャッチャー（オプション）

凹みの中央に網目付きのキャップ状凸部を追加。ヘアキャッチャー機能を高めます。

🧱

多様体 STL

Manifold-3D による CSG 統合で、スライサー（Bambu Studio など）で警告の出ない閉曲面メッシュを出力。

📐

自動配置

凹みが深くても最深部が常に Y=0 に乗るよう自動リフト。スライサーで床面に置きやすい座標で出力。

使い方

浴室の既存ドレンを採寸して、3 ステップで STL ができます。

採寸

既存の排水口蓋の外径と凹み直径を測ります。深さは「水がどれだけ溜まる空間が欲しいか」で決めます（通常 30–60 mm 程度）。

パラメータ調整

サイドパネルのスライダーを動かすと、3D ビューが即時更新されます。下記のパラメータ一覧を参考にしてください。上部の埋め込みデモでも操作を試せます。

STL ダウンロード & 3D プリント

「⬇ STL ダウンロード」を押すと、現在の形状の STL ファイルが生成されます。スライサー（Bambu Studio / PrusaSlicer / Cura など）にドラッグして印刷してください。

パラメータ説明

各スライダーが形状のどの部分に対応するかを断面図で示します。

カテゴリ	パラメータ	範囲	初期値	説明
基本寸法	outerD	50 – 250 mm	150 mm	蓋の外径。実際の排水口の縁に乗る大きさ。
基本寸法	thickness	2 – 20 mm	5 mm	外周リムの厚み。剛性を確保したい場合は 4 mm 以上推奨。
凹み	holeD	10 – 230 mm	125 mm	凹みの内径。外径と差をとった分が外周リムの幅になります。
凹み	holeDepth	0.5 – 100 mm	40 mm	凹みの深さ。厚みを超えると下方にドレンチューブとして突き出ます。
排水メッシュ	barW	0.5 – 10 mm	1.5 mm	桟（リブ）の幅。狭いほど開口率が上がり水通りが良くなります。
	slotSize	1 – 40 mm	8 mm	メッシュ穴の代表サイズ。髪の毛キャッチ用途なら 3–6 mm 推奨。
	meshOn	ON / OFF	ON	OFF にするとソリッドな円盤になります（排水機能なし）。
ヘアキャッチャー（オプション）	bumpOn	ON / OFF	OFF	凹み中央に網目付きの凸キャップを追加。ヘアキャッチャー強化用。
	bumpD	5 – 100 mm	25 mm	ヘアキャッチャーの直径。底面はこの直径でくり抜かれます。
	bumpH	1 – 50 mm	8 mm	ヘアキャッチャーの高さ。凹み深さよりも低めに設定すると清掃しやすい。

Tip： パラメータの組み合わせによっては「凹み深さが厚みより深い」ケースになります。この場合は外周リムの下に円筒状のドレンチューブが自動で生成され、既存の排水口にすっぽり入る形になります。

3D プリント推奨設定

PLA / PETG / ABS など一般的なフィラメントで印刷可能です。浴室で使うなら耐熱・耐湿性のある PETG または ASA を推奨します。

項目	推奨値	備考
フィラメント	PETG / ASA	浴室の湿度・温度を考慮。PLA は変形リスクあり
レイヤー厚	0.2 mm	メッシュ細部を出すなら 0.16 mm でも可
ノズル径	0.4 mm	標準。0.2 mm は桟幅 1.0 mm 以上で安定
インフィル	20% – 40%	桟がメインなのでインフィルは控えめで OK
プリント向き	凹みを上に	底面が大きく安定。サポート最小限
サポート	必要に応じて	凹み深さが深い場合のみ。通常は不要

非多様体（non-manifold）警告について： Manifold-3D ライブラリで CSG 統合してから出力するので、Bambu Studio などの厳格なスライサーでも警告は出ないはずです。万一警告が出る場合は、桟幅 (barW) を少し広げるか穴サイズ (slotSize) を少し変えて再出力してみてください。

技術スタック

ビルド不要・依存関係なしの Pure HTML 構成です。

🌐

Three.js r128

ブラウザ 3D 描画。CDN から直接ロード。

🔧

Manifold-3D 3.0

WASM ベースの CSG エンジン。多様体な STL を出力。

📦

Pure HTML / JS

1 ファイル完結。GitHub Pages でそのまま配信。

概要

特徴