2025-01-13
#js 
乱数はデタラメすぎて、パターンづくりも面倒なとき、滑らかに変化する乱数ノイズが便利です。

パーリンノイズ(Perlin noise)のJavaScriptの実装し、1/2/3次元のデモを作りました。


「PerlinNoise1D DEMO」
src on GitHub
PerlinoNoise1Dクラスを new で生成して、noise機能を時間をパラメータに呼び出せばOK! import { PerlinNoise1D } from "https://code4fukui.github.io/PerlinNoise/PerlinNoise1D.js"; const noise = new PerlinNoise1D(); for (let i = 0; i < 1; i += 0.1) { console.log(noise.noise(i)) }


「PerlinNoise2D DEMO」
src on GitHub
noise.noise(i, j) と2次元で指定するPerlinNoise2D


「PerlinNoise3D DEMO」
src on GitHub
noise.noise(i, j, k) と3次元で指定するPerlinNoise3D

ノイズを使ったプログラムによるCG生成は、ちょっとの変更で大きく変わって楽しい!
いろんなものに使ってみたくなりますね。

links
- ピクセルなテクスチャーをつくろう!pixel-texture-makerとマイクラ風な木ライブラリ「voxel-trees」移植

Tweet
クリエイティブ・コモンズ・ライセンス
本ブログの記事や写真は「Creative Commons — CC BY 4.0」の下に提供します。記事内で紹介するプログラムや作品は、それぞれに記載されたライセンスを参照ください。
CC BY / @taisukef / アイコン画像 / プロフィール画像 / 「一日一創」画像 / RSS