YouTube

Got a YouTube account?

New: enable viewer-created translations and captions on your YouTube channel!

Japanese subtitles

← Transparency and three js

Get Embed Code
2 Languages

Showing Revision 1 created 03/11/2014 by Fran Ontanaya.

  1. 有効的な透明処理の方法を導き出せました
  2. Zバッファを使い
    不透明なオブジェクトを最初に形成する
  3. 次に描かれる透明なオブジェクトとブレンディングする
  4. ブレンディングには追加の計算時間がかかるので
    必要な時だけオンにしてください
  5. そして透明なオブジェクトは視点からの距離に応じて
    遠いものから順に形成する
  6. カメラやオブジェクトが動けば
    フレームごとに必要になります
  7. このアルゴリズムはthree.jsに組み込まれているので
  8. マテリアルを設定すれば透明なオブジェクトを描けます
  9. パラメータは2つです
    このopacityはブレンディングの透明度を表します
  10. 透明処理のパラメータをtrueに設定します
  11. このようにすれば透明処理が実行できるのですが
  12. まだ少し問題点が残ります その1つは相互貫通です
  13. 透明なブロックが2つあり
    片方がもう片方をすり抜けています
  14. カメラを動かして周りから見て
    ブロックの位置をスライドさせてください
  15. 中心の点はカメラからの距離を測るために
    それぞれつけられています
  16. デモを動かしたら何が問題なのかを見ていきましょう