Three.js r153版本开启SAO后物体出现暗线，求解决方法

• 调整SAO核心参数
  提升采样数、优化半径和偏移值是最直接的解决方式，通过增加采样平滑噪点，缩小半径避免误判边缘：

  const saoPass = new THREE.SAOPass(scene, camera, {
    samples: 32, // 高于默认值，提升采样精度
    radius: 0.4, // 缩小遮蔽半径，减少跨面错误遮蔽
    bias: 0.6 // 调整偏移，降低低角度表面的误遮蔽
  });
  

• 确保深度纹理精度
  r153对深度纹理的处理逻辑有更新，强制使用高精度渲染并指定合适的深度纹理格式：

  // 初始化渲染器时开启高精度
  const renderer = new THREE.WebGLRenderer({
    precision: 'highp',
    antialias: true
  });
  // 给SAOPass指定高精度深度纹理
  saoPass.depthTexture = new THREE.DepthTexture(
    window.innerWidth, 
    window.innerHeight, 
    THREE.FloatType
  );
  

• 调整或禁用SAO模糊效果
  默认模糊可能放大深度差异导致暗线，尝试关闭模糊或微调模糊参数：

  const saoPass = new THREE.SAOPass(scene, camera, {
    blur: false, // 先关闭模糊验证问题来源
    // 若需保留模糊，调整参数
    blurKernelSize: 3,
    blurRadius: 3
  });
  

• 检查并修复模型几何问题
  模型的重叠顶点、重复面或异常法线会导致深度值异常，在建模软件中执行以下操作：

  • 合并重叠顶点
  • 清理重复面
  • 重新计算模型法线

• 升级Three.js版本
  r153的SAOPass可能存在已知bug，升级到r154及以上的稳定版本，大概率能修复这类兼容性问题。

内容的提问来源于stack exchange，提问作者Arnaud Coutant