Prompt : CGにおけるSPH法を理解するためのコードをhtmlとJavaScriptで書け。

CGにおけるSPH法を理解するためのインタラクティブなシミュレーションを作成します。SPH法（Smoothed Particle Hydrodynamics）の学習用インタラクティブシミュレーションを作成しました。 **このシミュレーションの特徴:** 🔬 **SPH法の核心要素を実装** - **密度計算**: Poly6カーネル関数を使用 - **圧力力**: Spikyカーネルの勾配で計算 - **粘性力**: ラプラシアンカーネルで速度の拡散を計算 - **境界条件**: 壁との衝突処理 ⚙️ **リアルタイム調整可能なパラメータ** - 重力、粘性、密度、圧力係数 - スムージング半径（粒子の影響範囲） 🎮 **インタラクティブ操作** - マウスで粒子をドラッグ可能 - 粒子の追加・削除 - シミュレーションの開始・停止 **SPH法の理解ポイント:** 1. **カーネル関数**: 粒子間の相互作用を滑らかに計算 2. **密度から圧力**: 状態方程式で圧力を求める 3. **力の合成**: 圧力力・粘性力・重力を合計 4. **数値積分**: オイラー法で位置と速度を更新 パラメータを調整しながら、SPH法の物理的な挙動を直感的に理解できます！

マウスによる外力機能を追加しました！🖱️✨ **新しい機能:** 🎮 **外力モード（デフォルト）** - **左クリック + ドラッグ**: マウス周辺の粒子に力を与える - **視覚的フィードバック**: 影響範囲の円と力の方向を表示 - **動的な力**: マウスの移動速度と方向に応じて力が変化 🔧 **操作モード** - **モード切り替えボタン**: 外力モードとドラッグモードを切り替え - **右クリック**: 常にドラッグモード（粒子を直接移動） - **マウスホイール**: 外力の影響範囲をリアルタイム調整 ⚙️ **カスタマイズ可能なパラメータ** - **外力強度**: 10-200の範囲で調整可能 - **影響範囲**: 20-80の範囲で調整可能 **操作方法:** - **左クリック**: 外力を与える（赤い円が表示される） - **右クリック**: 粒子をドラッグ - **マウスホイール**: 影響範囲調整 - **モードボタン**: 外力/ドラッグモード切り替え これで流体に様々な外力を与えて、SPH法の動的な挙動をより詳しく観察できるようになりました！