Three.js_解決諜影閃爍重影模型的方法

Three.js_解決諜影鋸齒閃爍重影模型的方法

像素點重疊問題

問題展示

解決后效果

解決方法

renderer = new THREE.WebGLRenderer({
  antialias: true,
  logarithmicDepthBuffer: true,
});

設置logarithmicDepthBuffer屬性為true, 便可以處理這個問題

logarithmicDepthBuffer, 官方解釋: 是否使用對數深度緩存。如果要在單個場景中處理巨大的比例差異，就有必要使用, 默認是false。 使用了會帶來額外的開銷, 但是效果會變好.

原因

渲染器渲染時有個特點, 距離越遠的物體精度越低, 因此, 在遠處, 多個材質可能集中在一個像素點上, 產生各種不正常現象, 這也叫z-fight.

那么, 運用了logarithmicDepthBuffer( 對數深度緩存 )后, 處理了這種情況, 具體怎么處理的, 目前我也還不明白, ^_, 留個問題, 以后處理

總結: 如果要在單個場景中處理巨大的比例差異，就有必要使用logarithmicDepthBuffer : true