Three.js r85で何が変わったのか
2017/05/08
  • このエントリーをはてなブックマークに追加

はじめに


月次リリースのはずが前回のリリースから3ヶ月も開いてしまってますが、噂によると今回はたまたま時間の掛かるものがあっただけで月次リリースを止めるわけではないそうです。個人的にはリリースはいつも今回くらいの間隔でいいんじゃないかと思いますが。

ということで今回もThree.jsのr85のリリースノートを適当にまとめます。

要点


なんやらいろいろと更新されましたとしかまとめようがないんですが、r83で突然消されたbower.jsonが結局復活したのが個人的ハイライトです。

コードの変更点


以下、r85のリリースノートの要約です。

バグフィックス


Clock
  • performanceオブジェクトのないnode.js環境下でも動作するようになりました。(#10732
  • getDeltaの最初の呼び出しで必ず0が返るようになりました。(#10962
ParametricGeometry
法線が面と面が接している部分で法線が期待通りにならない不具合が修正されました。(#11056
Skeleton
glTFローダーのアニメーションの不具合が修正されました。(#10754

追加


パッケージ
Polymerなどでbowerが使用されているということで、r83で削除されたbower.jsonが復活しました。(#10431
ArrayCamera
これまでWebVRで両眼用の画像を作成するためにVREffectを使用していましたが、複数のカメラを引数として渡すため描画が二回行われる結果になっていました。この問題に対応するためにカメラのリストを管理するArrayCameraと、それを継承したWebVRCameraが追加されました。(#10927
FileLoader
  • setRequestHeader()が追加されました。(#10708
  • エラー発生時にmanager.itemEnd()が呼ばれるようになりました。(#11125
Matrix3
Matrix4にあってMatrix3になかったメソッドがいろいろ追加されました。(#10801#11080
LineLoop
描画にgl.LINE_LOOPを使用するLineLoopが追加されました。(#10643
Material
カラーバンディングを低減するためにditheringパラメーターが追加されました。(#11076
TextureLoader
テクスチャの読み込み完了を検知できるようになりました。(#10829
WebGLRenderer
  • Ambient Occulusion、Roughness、Metalnessをそれぞれ一枚の画像のRGBで表すOcclusionRoughnessMetalnessマップに対応しました。(#10693
  • WebGLRenderListクラスを新しく作成して、描画処理の一部を移動しました。(83e97451957df7
  • lose_context拡張機能に対応していないブラウザ(IE11、Edge)のためのチェックが追加されました。(#11055
  • シーン内のすべてのマテリアルのシェーダーを事前にコンパイルするcompile()メソッドが追加されました。(#10960
WebGLRenderTarget
デバッグに使えるようにnameプロパティが追加されました。(#10304

削除


Matrix4
multiplyToArrayがdeprecatedになりました。(d8f7ccf
MultiMaterial
Deprecatedになりました。(#10931#11220
WebGLRenderer/WebGLState
setColor*()、setDepth*()、setStencil*()メソッドが削除されました。(dc7af39

変更


-
C.prototype = {...} が Object.assign(C.prototype, {...}); になりました。(#10637#10648
BoxHelper
setFromObject()が追加され、update()は引数を取らなくなりました。(#11171
ExtrudeGeometry
BufferGeometryを継承するようになりました。(#10908#10921#10947
Geometry
toJSON()の出力形式が {.., "data":{"vertices":..., "normals":..., "faces":...}} から {.., "vertices":..., "normals":..., "faces":...} に変更されました。(#10657
ImageLoader
エラー発生時にmanager.itemEnd()が呼ばれるようになりました。(#11125
WebGLRenderer
  • attributesが新しく作成されたWebGLAttributesに移動されました。(380de1aa55ecbe7301fa4
  • getCurrentRenderTarget()がgetRenderTarget()に改名されました。
WebGLRenderer/ShaderChunk
面光源シェーダーがリファクタリングされました。(#11169#11232

Examples


いろいろと修正されているようですが、とりあえず新しく追加されたサンプルだけ紹介します。

webgl_geometry_text_shapes
読み込んだフォントで平面にテキスト描画するサンプルです。
webgl_loader_gltf2
glTF2ローダーのサンプルです。PBRとか使えます。かっこいい。
webgl_materials_texture_canvas
右上のキャンバスに描画したものをそのままテクスチャとして使用するサンプルです。これまでも普通にできていたはずなので、なにが見どころなのかは分かりません・・・
webgl_buffergeometry_instancing2
インスタンシングのサンプルです。