如何详细解析Three.js中drawBuffers的示例应用？

本文共计1505个文字，预计阅读时间需要7分钟。

目录+原因+历程+原生的使用+基本流程+灵光不现+使用WebGLMultipleRenderTargets+原因+深度裁剪离实现之后，似乎会使得效果走样，变得严重要重。+我意识到，这是因为裁剪这个环节，并没有详细的讲解，只有只这个字。

目录

• 原因
• 历程
• 原生的使用
• 基本流程
• 灵光乍现
• 使用WebGLMultipleRenderTargets

原因

深度剥离实现之后，似乎会使得走样严重起来。 我意识到，这是因为 剥离这个过程，并没有什么讲究，只要是深度小于等于就剔除了，这样很可能就导致了，原本平滑的差值过渡出现了断层，突变。 简单的解决办法就是增顶点数。

一番搜寻weight oit算法的demo,但是只找到了用原生webgl写的,传送门。在费了几个日夜之后，终于看懂了，但是，还要把它用three实现。一般来说，没有使用编译的框架，应该可以直接使用原生，但是业务场景不允许。

我当然为此goole了一番，但是只找到一个教我如何在three里使用原生Texture的方法， 算是解决了一个困境。

遇到的下一个困境就是，直接用原生的上下文进行一系列缓冲区和纹理的绑定操作是徒劳的， 因为three的renderer.render里面会有他的一套处理。 到这里我就意识到了，没法混用。