抗锯齿在 Three.js 中不起作用 [英] Antialiasing not working in Three.js

问题描述

我是 Three.js 的新手，最近开始大量使用它.我真的很喜欢它，我创造了一些令人难以置信的东西.但是，我不确定为什么但是将抗锯齿设置为 true 时我看不出有什么区别.

I am new to three.js and have starting working with it a lot recently. I really enjoy it and I have created some incredible things. However, I'm unsure why but when setting antialiasing to true I see no difference.

 renderer = new THREE.WebGLRenderer({ antialiasing: true });

我已经搜索了可能的解决方案，但我似乎无法找到或理解为什么这不起作用.为了使抗锯齿工作，我是否缺少或需要某些东西?

I have searched for possible solutions, yet I can't seem to find or understand why this doesn't work. Is there something I am missing or need to in order to get antialiasing to work?

帮助我解决此问题的链接:https://github.com/mrdoob/three.js/blob/master/examples/webgl_materials_normalmap2.htmlhttps://github.com/mrdoob/three.js/tree/master/examples/js

Links that helped me fix this issue: https://github.com/mrdoob/three.js/blob/master/examples/webgl_materials_normalmap2.html https://github.com/mrdoob/three.js/tree/master/examples/js

这需要一些挖掘，但three.js的开发人员已经涵盖了它！

It took some digging but the developers for three.js have it covered!

推荐答案

您在 WebGLRenderer 构造函数的参数对象中使用的属性名称不正确.根据文档，属性的名称应该是'antialias'，不是 'antialiasing'.

The property name you are using in the argument object of the WebGLRenderer constructor is incorrect. According to the documentation, the name of the property should be 'antialias', not 'antialiasing'.

我在适用于 Mac 操作系统的 Google Chrome 中对其进行了测试，在一个以旋转立方体为特色的演示中，边缘渲染明显平滑.

I tested it in Google Chrome for Mac OS and there was a noticeable smoothing in the rendering of edges in a demo featuring a spinning cube.

这篇关于抗锯齿在 Three.js 中不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！