本篇文章主要讨论Three.js中的渲染机制，以及在部分场景中透明的物体渲染不正确，渲染顺序错误等问题。国内好像很少有人有讨论这方面的问题，stackoverflow以及github倒是很多。在本文的最后将会贴出参考文章的地址。此外，如果本文观点有任何错误，欢迎各位指出，一起学习进步，谢谢！
Three.js的渲染机制
three的渲染器是基于webGL的。它的渲染机制是根据物体离照相机的距离来控制和进行渲染的。对于透明的物体，则是按照从最远到最近的顺序进行渲染。也就是说，它根据物体的空间位置进行排序，然后根据这个顺序来渲染物体。
如何控制渲染顺序？
1.设置
renderer.sortObjects = false;
这样，物体的渲染顺序将会由他们添加到场景中的顺序所决定。适合大部分场景。
2.设置
renderer.sortObjects = true;
并且给特定的物体设置object.renderOrder 指定它的渲染顺序。
默认
renderOrder = 0；
3.遍历设置
material1.depthWrite = false;
material2.depthWrite = false;
对于透明物体
如果发现场景中的透明物体显示有问题，例如旋转摄像机的时候会出现闪烁等问题。可以尝试以下几种方法：
1.设置
material.transparent = false;
注意：不透明物体将会优先渲染。所以这也可以作为控制渲染顺序的一个方法。
2.设置
material.alphaTest = 0.1;
自己尝试改变不同的alpha测试值，以适合你自己的场景。
3.尝试改变sortObject和depthWrite的值等等。
创建两个场景
可以控制某个物体”始终显示在最前面”，同样可以控制渲染顺序。因为应用场景不多，不做介绍。不过具体可参考
这一篇文章
