フラクタル地形生成webシミュレーション-山肌や岩肌が生成できる!

Pocket

サイトツールです。

上の埋め込み内でも使えますが、うまく動かない・大きなページで使いたいというときは、元のフラクタル地形シミュレーションページへ(新しいタブで開きます)。

\当サイトではリンク広告を利用しています。/

フラクタル地形とは?

フラクタル地形とは、自己相似的なパターンを持ち、どの拡大縮小スケールでも自然のような凹凸や形状を再現できるコンピューター生成の地形です。

自然界に見られる山脈・谷・丘などの地形はランダムではありますが、完全な無秩序ではありません

このような「規則の中にある不規則さ」を表現するのに、フラクタル(自己相似)やノイズ関数(特にパーリンノイズ)が使われます。

このビジュアライザでは、以下の要素が組み合わされて地形が描かれています:

  • 正弦波と余弦波による周期的なパターン
  • パーリンノイズによる自然なゆらぎ
  • グリッド全体にわたって高さを計算し、3Dの地形として描画

これにより、ランダムながらも自然に見える風景をリアルタイムに生成できます。

ツールの使い方

このツールは、Webブラウザで簡単に使えるインタラクティブなビジュアライザです。操作もシンプルで、視覚的にも楽しく学べます。

操作方法:

  1. 画面中央のスライダー
     「再帰レベル(resolution)」を調整することで、地形の細かさが変わります。
     - 数値が大きいほど地形が細かく(高解像度)
     - 小さいほど荒く(低解像度)
  2. 3Dビュー(Canvas部分)
     - マウスのドラッグで視点を自由に回転可能
     - 地形を上下・左右・斜めから観察できます
  3. 再描画
     スライダーを動かすと、新しい解像度で地形が再生成されます。固定パターンではなく、毎回ランダムに近い地形が表示されるのが特長です。

📌 まとめ

  • フラクタル地形は、自然界のような複雑でリアルな凹凸を模倣するコンピューターグラフィックス技術
  • このツールでは、p5.jsWEBGL 機能を活用し、3D地形をリアルタイム生成・描画
  • スライダーで再帰レベル(地形の解像度)を変更可能
  • マウス操作で視点を自由に変えられるインタラクティブな体験が可能
  • 描画には TRIANGLE_STRIP を使用し、効率的にメッシュ地形を表現

フラクタルやノイズ、3D描画の世界は非常に奥が深いので、ぜひこのシミュレーションを入口にして、さらに探索してみてください。

\当サイトではリンク広告を利用しています。/
サイトツール