Three.js 如何给模型的渲染进行优化?-灵析社区

我爱了你呢

如何给模型的渲染进行优化? 上图是我自己渲染出来的,下图是把模型上传到别的平台上渲染出来的,但是,很明显看出下图的更清晰一些,是因为加了阴影吗?还是别的什么?怎么样才能做到像图二一样。 ![这是我渲染出来的](https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20240917/1ac3b1fb0589c497e3c95c2eb8ab2740.png) (这是我渲染出来的) * * * ![这是别的平台渲染的](https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20240917/1479387f7697f26604cf65246dd7f5a0.png) (这是通过别的平台渲染出来的)

阅读量:158

点赞量:0

问AI
1、mesh的边缘线加上一些线条,可以增加轮廓感。"EdgesGeometry"(边缘几何体)+ "LineSegments"(线段)+ "LineBasicMaterial"(基础线条材质),可以实现。值得注意的是,如果线条太清晰,会使得模型像线稿图。 2、从three.js中找到一些示例发现,后期处理的AO环境光遮蔽 可以达到这种效果(边缘线有阴影)。 但是,因为后期处理的是实时的AO,所以可能会导致有比较多的噪点,需要再搭配后期处理的抗锯齿使用。 可是即便是这样,感觉效果还是不太行,可能跟光照的因素还是有比较大的。而且,两者叠加,对渲染性能要求比较高 。 如果可以,可以尝试使用glsl去写这种AO环境光遮蔽的效果,说不定会更好。可以看看这些glsl的示例:"https://www.shadertoy.com/results?query=ambient+occlusion&sor..." (https://link.segmentfault.com/?enc=kSj7eWH82k95JHonXbI9Rw%3D%3D.eIwIhgyV0YDnuwKDOvjp18YHy7H3Ea3CvRSu3mrBCKENgVXPOsSPA%2BOb6V%2FolCzCVj%2BVOaHYr4h%2BE99UUAVLIQHMy2LDtgeMtGGy6B0JiTktZ1JupLuQFEEJK0W9WRTk)