Артефакты с SSAO в Three.js только на MacBook Pro (Retina)
В настоящее время я использую шейдер SSAO, представленный в примерах Three.js. Он отлично работает на большинстве моих машин, за исключением моего MacBook Pro Retina. MBP прекрасно отображал SSAO до нескольких недель назад (возможно, после обновления прошивки на MBP).
В своем нынешнем виде MBP отображает сцены SSAO с огромным количеством мерцающих артефактов по всему экрану, например:
Этот же код прекрасно воспроизводится на других машинах. Я видел эту проблему на других MBP, поэтому я уверен, что это не единственная проблема.
Помимо обновления прошивки, я ничего не изменил на этом MBP между его работой и появлением артефактов (код тот же).
Если я уберу эффект SSAO, то сцена получится идеально.
Есть идеи?
4 ответа
Я исправил проблему, изменив свойство "near" объекта камеры на значение больше 1. До сих пор не знаю, почему это исправляется, но теперь SSAO отлично работает на Retina MacBook.
У меня была точно такая же проблема на MacBook Pro без сетчатки, так что, похоже, это ошибка в графическом драйвере NVidia. Одна вещь, которая, кажется, влияет на поведение, является смешиванием материала. Я получаю лучшие результаты, если для глубины смешивания материалов установлено значение THREE.NoBlending:
// depth
var depthShader = THREE.ShaderLib[ "depthRGBA" ];
var depthUniforms = THREE.UniformsUtils.clone( depthShader.uniforms );
depthMaterial = new THREE.ShaderMaterial( { fragmentShader: depthShader.fragmentShader, vertexShader: depthShader.vertexShader, uniforms: depthUniforms } );
depthMaterial.blending = THREE.NoBlending; //add this
Кроме того, установка ближней плоскости камеры, по-видимому, оказала влияние на рендеринг.
Тот факт, что это происходит во всех браузерах Retina Macbook, но, похоже, работает на других устройствах (отлично выглядит на Chromebook Pixel), предполагает, что это может быть ошибка драйвера для OSX. Может быть, есть способ обойти это в WebGL, но я бы порекомендовал подать отчет об ошибках в Apple по крайней мере.
Я думаю, что нужно учитывать устройство PixelRatio. Посмотрите на этот пример http://uihacker.blogspot.gr/2013/03/javascript-antialias-post-processing.html