techty https://blog.hatena.ne.jp/techty/ techtyの日記 https://techty.hatenablog.com/ p5.js 作品 Generative Art p5.jsを使って「オーロラ」を描くプログラムを作ってみました。 黒い影が「山」、白い点が「星」、緑と紫の線が「オーロラ」を表現しています。 デモページとソースコードは以下にあります。 よかったら見てみてください。 editor.p5js.org 上記のようなオーロラを描く仕組みは単純です。 １．黒色のキャンバスを用意する ２．山のラインを決める ３．山のラインより上の部分を紫色で塗る ４．紫色で塗った部分を緑色で上塗りする ５．白い点をランダムに配置する これだけです。 山のラインを決めるときには「パーリンノイズ」という手法を使っています。 パーリンノイズとは簡単に言うと「なめらかな乱数生成… 190 <iframe src="https://hatenablog-parts.com/embed?url=https%3A%2F%2Ftechty.hatenablog.com%2Fentry%2F2019%2F05%2F27%2F151415" title="p5.js　オーロラ - techtyの日記" class="embed-card embed-blogcard" scrolling="no" frameborder="0" style="display: block; width: 100%; height: 190px; max-width: 500px; margin: 10px 0px;"></iframe> https://cdn-ak.f.st-hatena.com/images/fotolife/t/techty/20190527/20190527131053.png Hatena Blog https://hatena.blog 2019-05-27 15:14:15 rich https://techty.hatenablog.com/entry/2019/05/27/151415 1.0 100%