在Three.js中对mesh使用”z-index” 不遮挡

一次业务需要中，需要让场景中的一部分mesh不受场景遮挡限制，类似于透视穿墙效果，就是能隔着墙看到墙后面的物体，也有点类似于css中对页面元素做z-index的操作，比如下图透视外挂的原理：

Three.js

根据THREE.JS文档提示：只需要修改mesh.renderOrder属性

mesh.renderOrder=99;

但根据我具体实现后，却发现根本没有作用，后来在网上查了，需要对mesh的material.depthTest属性设置为false
比如:

mesh.material.depthTest=false;

这样设置就有用了。

参考issues：https://github.com/mrdoob/three.js/issues/3212

Babylon.js

如果您使用的是babylonjs引擎：则只需要设置mesh.renderingGroupId，比如：

mesh.renderingGroupId=99;

babylonjs不需要设置其他属性。

另外提示：即便修改了这个属性，如果您用射线拾取场景中的模型做击中效果，射线击中反馈的数组中，还是按照正常的场景进行深度计算，也就是说如果需要透视显示的模型在场景中设置了mesh.renderOrder=99，同时出现在墙的后面，射线拾取的仍然是墙体，而并非墙后面的模型。