Three.jsで雪を降らせる

公開日: : プログラミング , ,

WebGL Advent Calender 16日目の記事です。

何番煎じかわからないですが、この季節ですのでThree.jsの入門用として雪っぽいのを降らせようと思います。

Three.jsで雪を降らせる

スクリーンショット 2014-12-14 20.44.05

デモ

基本的に通常のThree.jsでオブジェクトを表示させる時と同じで簡単です。

PointCloudMaterialに色とサイズとテクスチャを渡してマテリアルとしています。(いつのまにか名前が変わってました。)

ちなみにテクスチャは見えにくいですがこんな感じです↓

particles

これでPointCloudを生成してパーティクルを追加しています。(いつのまにかこれも名前がParticleSystemから変更されていました。)

 

また、FogExp2でフォグを設定して、遠くのパーティクルを指定した色に近ずけて、霞んで見えるようにしています。


あとはこのPointCloudのy軸中心回転とパーティクルのy軸ベロシティをうまく調整して、縦に落ちる早さや横の動きをアニメーションループで回すだけです。

詳細のコードは長いのでこちらに貼っておきます。

おわりに

すごい簡素な説明になってしまいましたが、ゆらゆら散る桜とかキラキラ光る粒子などいろいろな応用がきいて楽しいので是非試してみてください。

 

ad

  • このエントリーをはてなブックマークに追加
  • Pocket

関連記事

大学でプログラミングを学ぶということ

高校生の頃からPCでゲームをやったり、動画を見たりするのが好きだった。 受験を勉強頑張って

記事を読む

便利なGitの拡張

Gitのバージョン管理は便利ですよね。GitHubだったりGitLabなど利用している方も多

記事を読む

#RECRUIT_CODE を解いてみた

解読できる学生求む!ターミナルに残された暗号 #RECRUIT_CODE リクルートホール

記事を読む

Three.jsとD3.jsで日本の日別降水量を日本地図上にビジュアライズ

久しぶりの更新となりましたが、そろそろ自分の制作物でもちょろっと紹介しようかなと思います。

記事を読む

Sublime Text 3のTex環境の導入

情報系の学生は論文やレポートを書くときに欠かせないのがTexです。最近はWordでレポートなどを書く

記事を読む

便利なGitの設定

今回は、Git関連第2弾ということでGitの設定について紹介したいと思います。 ちなみにM

記事を読む

Sublime Text 3 導入

Mac Book Proに新しくしたので、ついでにSublime Text 2からSublime T

記事を読む

ad

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

ad

  • chanpu(チャンプ)

    IT系勤務のエンジニア 使用言語はC, Java, JavaScript, Swift, PHP, Perl, Python. 普段はiOS, Android, Webのアプリケーションを作っています。 趣味は料理, イラスト, ギター, ランニング
Raspberry Pi 2と Node.js で温湿度センサーの値を取得する

前々回はPythonを使って温湿度センサーの値を取得しましたが、今回は

Raspberry Pi 2 に Node.js をインストールする

Raspberry Pi にNode.jsをインストールする方

Raspberry Pi 2 と温湿度センサーで部屋の温度を取得する

今回は、温湿度センサー(DHT11)を使って、部屋の温度を取得してみよ

Raspberry Pi 2 Model B の初期セットアップ 続

前回から間が空いてしまいましたが、SSH接続、IPの設定周りの設定方法

Raspberry Pi 2 Model B の初期セットアップ

もてあましていたRaspberry Piをセットアップしたので紹介した

Sublime Text 3のTex環境の導入

情報系の学生は論文やレポートを書くときに欠かせないのがTexです。最近

卒論発表の時に注意するべき3つのこと

あけまして、おめでとうございます。チャンプです。 そろそ

Three.jsで雪を降らせる

WebGL Advent Calender 16日目の記事です。

Evernote Penultimateを使ってみた。

 Evernote Penultimate こんにちは、ponp

Office for iPad,iPhoneを試しに使ってみた

Office for iPad,iPhone どうもponpuで

→もっと見る

PAGE TOP ↑