Three.js 学习之路

Posted 2020-10-15 JiSight

天空盒子的使用

1.THREE.js下使用天空盒子的最简单方法是使用cubetxture来设置scene的background属性。

和其他游戏引擎一样，天空盒子需要六张拼合好的图片。

2.在THREE.js里cubetxture是一个6个长度的图片数组,贴图顺序依次是：左右上下前后。

3.示列代码：

　　var skyboxs = ["Left.png","Right.png","Up.png", "Down.png","Front.png", "Back.png"]；

　　var textureCube = new THREE.CubeTextureLoader().load(skyboxs);

　　textureCube.format=THREE.RGBFormat;

　　scene.background = textureCube;

4.在移动端使用过程中可能偶尔会遇到切换天空盒子后场景背景变为纯色背景色了，安卓设备和苹果设备的渲染应该有所不同，尝试修改camera.far属性，苹果设备要小一些才可以修复这个问题