关于 Three.js 的 Face culling 与 Material 的 side 问题

想详细了解 Face culling 与 Material 的 side 属性的关系。

体验该链接:http://threejs-outsidelook.os...

当设置以下剔除模式时,就会实时把 Mesh 的正面剔除:

renderer.setFaceCulling(THREE.CullFaceFront, THREE.FrontFaceDirectionCCW)

可是为什么反面却会显示呢?材质默认是应用在正面的 THREE.FrontSide

new THREE.Material({
    side: THREE.FrontSide
})

默认状态下,下面的平面绕Y轴旋转180度后,是不可见的。而上述案例的背面为什么又是可见的呢?

// 剔除模式默认是 THREE.CullFaceBack,但即使设置为 CullFaceNone,却依然不可见。
renderer.setFaceCulling(THREE.CullFaceNone, THREE.FrontFaceDirectionCCW)

var planeGeometry = new THREE.PlaneGeometry(10, 10)
var planeMaterial = new THREE.Material({ color: 0xff0000 })
var plane = new THREE.Mesh(planeGeometry, planeMaterial)
scene.add(plane)
阅读 6.5k
1 个回答

问下,解决了吗,我也遇到这个情况,设置THREE.CullFaceNone是没有效果的

已经解决了哈,在设置render渲染模式为CullFaceNone之前,对材质material也需要同时设置双面贴图
new Material({side:THREE.DoubleSide})

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题