threejs 踩坑进行中

656 阅读1分钟
1.因为环境光、环境贴图和设置物体材质的颜色等,造成模型的颜色出现色差

'convertSRGBToLinear'是一个用于将 sRGB 颜色空间中的颜色值转换为线性颜色空间中的颜色值的功能函数。Three.js中的材质渲染使用的是线性颜色空间,而图像文件和屏幕显示一般使用sRGB颜色空间。因此,需要在渲染之前对颜色进行sRGB到线性空间的转换,才能得到正确的颜色效果。

new THREE.Color('#ffffff').convertSRGBToLinear()

2.在控制台里打印数据,material内的一些参数的数值已经更新成功了,但是页面没有作出响应。

在threejs中数值更新后页面没有重新渲染。

    if(object.name == 'stationary_ladle_1') {
        object.material = new THREE.MeshStandardMaterial({
            color: 0x020202,
            metalness: 0.0,
            roughness: 0.6,
            envMapIntensity: 1.0,
        })
        console.log(object,'frame')
    }
    //调用该Mesh所属Geometry的computeVertexNormals()方法重新计算顶点法向量
    //以确保更新材质属性后能正确渲染。
    object.geometry.computeVertexNormals()
3.版本不能混着用

如 125版本的BufferGeometryUtils.js 不能搭配 149版本GLTFLoader.js 一起使用

threejs官方文件包所有版本:github.com/mrdoob/thre…

threejs官网:Three.js – JavaScript 3D Library (threejs.org)

4.模型下沉

controls.target.set( 0, 1.4, 0 );