Рендеринг нескольких сцен с использованием только 1 с использованием SSAO [Three.js]
Продолжая экспериментировать с Three.js, я натолкнулся на другую стену, на которую не могу перелезть.
Я пытаюсь создать фоновую сцену (в которой есть слово) под сценой переднего плана, которая имеет эффект постобработки SSAO. На фоновую сцену не должна применяться постобработка.
Я пробовал несколько подходов (используя маски и т. Д.), И я просто не могу это взломать. Основная проблема, которую я вижу, заключается в том, что фон сцены SSAO непрозрачен, поэтому фоновая сцена не отображается. Я до сих пор не убежден, что даже если проблема прозрачности будет решена, все будет работать так, как ожидалось.
Вот так все должно выглядеть без SSAO постобработка: http://jsfiddle.net/uJbPe/1/
И вот как это выглядит в настоящее время с включенной постобработкой SSAO: http://jsfiddle.net/7hfdC/6/
Есть идеи, что я делаю не так?
2 ответа
Вы можете использовать маскирующий проход, чтобы это произошло. Я считаю, что это правильный подход к проблеме. Вашему исходному коду понадобятся некоторые дополнения, чтобы сделать это возможным.
Сначала вам нужно создать цель рендеринга с включенным буфером трафарета для передачи в композитор эффектов для использования. Информация в буфере трафарета позволяет выполнять маскирование.
renderTargetParameters = { minFilter: THREE.LinearFilter, magFilter: THREE.LinearFilter, format: THREE.RGBAFormat, stencilBuffer: true };
renderTarget = new THREE.WebGLRenderTarget( window.innerWidth, window.innerHeight, renderTargetParameters );
composer = new THREE.EffectComposer( renderer, renderTarget );
Далее, я бы порекомендовал, чтобы ваши фоновые и передние проходы были в композиторе. Это делает стек рендеринга чище. Когда вы визуализируете сцену переднего плана, убедитесь, что для свойства clear установлено значение false, чтобы данные буфера трафарета были сохранены для прохода маскирования.
Затем проход маски, проход ssao, очистка пути маски и последний проход шейдера, чтобы отобразить все это на экране. Вы можете использовать простой проход через шейдер или fxaa здесь. Также может быть другой способ рендеринга на экран, о котором я не знаю, но вы не можете назначить проход ssao для рендеринга на экран и заставить его работать, когда после него проходит этап очистки маски.
вот ссылка на скрипку с этим реализованным подходом http://jsfiddle.net/xqLdz/3/
Я делаю что-то очень, очень похожее. В вашем SSAO вы пробовали ' ssaoPass.material.transparent = true;'. Похоже, если вы сделаете свой RGBA переднего плана, а не RGB по умолчанию, это может решить ваши проблемы.