ThreeJs 实际透明物体问题

ThreeJs 实际透明物体问题
1-透明容器,FBX,自带透明材质
2-threejs创建的圆柱体,赋予的蓝色透明材质
3.水下气泡,Point物体,给予PointMaterial,贴上透明贴图
4,唯一不需要透明的筒盖

  • 之前没加气泡时的处理是
    外面透明容器:遍历子物体时设置每一个mesh禁用深度写入:child.material.depthWrite=false;
    然后对于内部的水圆柱的材质:默认,depthWrite和depthTest都为true。

  • 加上气泡后出了点问题,最终的处理方式:
    最开始气泡渲染优先级很高,连筒盖都挡不住它,直接【禁用深度写入depthWrite=false】
    然后的问题是旋转时看到两种情况,一种是这个:在某些角度会出现,其他角度是最上面那个图的情况,最上面那个才是我想要的效果
    ThreeJs 实际透明物体问题
    刚开始我以为这种是不正确的,水的蓝色都看不到了,以为是内部的水柱的渲染层级不够高,把容器的renderOrder设置为1后(降低优先级),结果360°都是这种看不清后面的效果了,原来看不清里面和后面是因为容器没渲染好的问题,不是因为容器优先级太高,最终操作是提高容器渲染优先级,renderOrder=-1,同时三个透明物全部禁用深度写入,效果完成,现在去优化一下气泡动画。。。。。