问题
I'm currently running Chrome v31 and antialiasing seems to not be working at all. No errors in either browsers.
Possibly relevant code:
var renderer = new THREE.WebGLRenderer( { antialias: true } );
In Safari it renders fine:
vs Chrome:
回答1:
It seems to be a rendering issue with Chrome, perhaps you have the 32 bit Chrome installed?
You can do two things to increase the quality. First set a renderer attribute
renderer.shadowMapType = THREE.PCFSoftShadowMap; // options are THREE.BasicShadowMap | THREE.PCFShadowMap | THREE.PCFSoftShadowMap
and then you can also increase the shadowmap size of your light with:
light.shadowMapWidth = 1024; // default is 512
light.shadowMapHeight = 1024; // default is 512
as seen in the issue here: Quality of Three.js shadow in Chrome/MacOS?
“ I believe that this depends on the browser and system you are using. As far as i know, Firefox doesn't support antialiasing right now at all. Also it may be dependant on your graphics card and drivers. For example, i don't get antialiasing in Chrome on my old mid 2009 MacBook Pro, but i do get antialiasing on my newer late 2012 machine.
Also, you may consider using the FXAA shader to do the antialiasing as a postprocessing step. You can read about postprocessing here. ”
Read more: Antialiasing not working in Three.js
来源：https://stackoverflow.com/questions/20916396/three-js-antialiasing-not-working-on-chrome