THREE.js：Cubemapの1つの顔のみの画像を変更しますか？

Question

最初の6枚の低品質画像がロードされてキューブマップに表示されるキューブマップを使用してパノラマを表示しようとしています。これは簡単に行うことができます

var urls = [ 
'path/to/low-q-pos-x.png', 
'path/to/low-q-neg-x.png', 
'path/to/low-q-pos-y.png', 
'path/to/low-q-neg-y.png', 
'path/to/low-q-pos-z.png', 
'path/to/low-q-neg-z.png' 
], 

cubemap = THREE.ImageUtils.loadTextureCube(urls); 

次に、高品質の6イメージが読み込まれます。 私がここでやろうとしているのは、高画質の画像が読み込まれると直ちに低画質の画像に置き換えられ、高品質の画像が1つずつ適用されるということです。 loadTextureCubeを毎回使用することはオプションですが、キューブフェースを交換するより直接的な方法はありますか？

Answer 1

あなたはスカイボックス画像を変更したいと思います。

CubeTextureを新規にロードしてください。

var newTexture = new THREE.CubeTextureLoader().load(urls, onLoadCallback); 

次に、スカイボックスに新しいテクスチャを割り当てます。古いテクスチャが適切に処分されていることを確認するためのコンソールへの

var oldTexture = skybox.material.uniforms.tCube.value; 

skybox.material.uniforms.tCube.value = null; 
oldTexture.dispose(); // important! 

skybox.material.uniforms.tCube.value = newTexture; 

タイプrenderer.info。

three.js r.76