Shader - глубина объекта от камеры в линейном масштабе от 0 до 1 - PullRequest
Новая
       140

Shader - глубина объекта от камеры в линейном масштабе от 0 до 1

0 голосов
/ 03 мая 2020

Я пытаюсь написать шейдер, который вычисляет глубину me sh от камеры с линейным масштабом от 0 до 1.

Вершина, ближайшая к камере, будет иметь значение 0, тогда как вершина, самая дальняя от камеры, будет иметь значение 1. Кроме того, если камера поворачивается, значения глубины me sh должны адаптироваться к изменению.

Вот изображение, поддерживающее понимание.

Image Link

Из изображения видно, что для ближайшей вершины альфа установлено значение 0 по сравнению со значением 1 для самого дальнего вершины.

Я хотел бы добиться этого эффекта, даже когда камера поворачивается.

Из этого шейдера - вычислить глубину относительно объекта , я могу найти ближайший вершина, но мне трудно вычислить самую дальнюю точку me sh от камеры.

Можно использовать ограничивающую рамку me sh, но если я поверну камеру, я нужно пересчитать ограничивающий коробка. Следовательно, я хотел бы знать, есть ли какое-либо решение, которое можно было бы использовать, используя доступные матрицы?

PS: Я пытаюсь реализовать этот эффект в обоих. js и Единство.

1 Ответ

0 голосов
/ 03 мая 2020

По крайней мере, в three.js есть официальная демонстрация, которая производит намеченный вами эффект (только с инвертированными цветами, означающими ближайший белый): https://threejs.org/examples/webgl_depth_texture

Идея состоит в том, чтобы визуализировать глубина до текстуры, а затем использовать эту информацию в пользовательском шейдере. Соответствующий код в фрагментном шейдере: 

float readDepth( sampler2D depthSampler, vec2 coord ) {
    float fragCoordZ = texture2D( depthSampler, coord ).x;
    float viewZ = perspectiveDepthToViewZ( fragCoordZ, cameraNear, cameraFar );
    return viewZToOrthographicDepth( viewZ, cameraNear, cameraFar );
}

void main() {
    // readDepth() will return a linearized depth value that will be used to compute the fragment's color value
    float depth = readDepth( tDepth, vUv );

    gl_FragColor.rgb = 1.0 - vec3( depth ); // change this bit to invert colors
    gl_FragColor.a = 1.0;
}

perspectiveDepthToViewZ() и viewZToOrthographicDepth() являются вспомогательными функциями, определенными в блоке шейдера packing, который включен в самом верху исходного кода шейдера.

three.js R116

...