天空的添加可以采用天空盒的方式:这种方法原理其实就是小学的数学课上的拆解正方体,把正方体的六个面拆成个平面图形,六张正方形图片
用法就是:加载六张图片,给threejs场景添加这个天空盒背景,实现方式其实非常简单,
在initThree的函数中添加(加载threejs场景的基本东西的方法,灯光,渲染器,摄像机等等)
//添加天空
var urls = [
'/stactic/skybox/right.png',
'/stactic/skybox/left.png',
'/stactic/skybox/top.png',
'/stactic/skybox/bottom.png',
'/stactic/skybox/front.png',
'/stactic/skybox/back.png',
]
var cubeLoader = new THREE.CubeTextureLoader();
this.scene.background = cubeLoader.load(urls)
这里的天空盒的六张图片,获取的方法是:
在gitee或者github上面搜索threejs天空盒素材,会有一些大佬们把天空盒素材放在上面,各位友友们可以去上面挑选自己想要的天空素材哦~
这里奉上我使用的天空盒素材的百度网盘的链接:
通过百度网盘分享的文件:skybox
链接:https://pan.baidu.com/s/12f51350VcEYoUzsRlMI24w?pwd=qx08
提取码:qx08