在PostImage中经常会用到物体本身的位置信息,但是Image Effect自身是不包含这些信息的,因为屏幕后处其实是使用特定的材质渲染一个刚好填满屏幕的四边形面片(四个角对应近剪裁面的四个角)。这篇文章主要介绍几种在Image Effct shader中还原世界坐标的方式。这个问题在《Shader入门精要》中也做了描述,这里可能偏重于个人的一些疑惑。

这篇文章相关的两外两篇文章:

Unity Shader 基础(3) 获取深度纹理

Unity Shader 基础(2) Image Effect

1. View-Projection 逆矩阵

虽然在Image Effect中没有实际的顶点信息,但是带有纹理uv'坐标信息以及获得深度信息,根据UV信息可以得知NDC下xy坐标,即:

\[x_{ndc} = 2 * uv.x -1 \\ y_{ndc} = 2 * uv.y - 1
\]

在加上通过深度纹理或者深度法线纹理,可以获得NDC下深度信息,从而可以计算出世界坐标。

\[P_world = {M_{view}}^{-1} * {M_{projection}}^{-1} * P_{ndc}
\]

详情可可以参考:Unity Answer:Reconstructing world pos from depth 以及GPU Gem3 :Chapter 27. Motion Blur as a Post-Processing Effect

Pixel shader代码*,逆矩阵需要从C#中传递过来:

fixed4 frag(uoutput o) : COLOR
{
fixed4 col = tex2D(_MainTex, o.uv);
float depth = UNITY_SAMPLE_DEPTH(tex2D(_CameraDepthTexture, o.uv_depth));
float4 ndcPos = float4(o.uv.x* 2 - 1 ,o.uv.y * 2 - 1 ,depth , 1); //_Matrix_vp_inverse外部传递,具体为:
//Matrix4x4 temp = mCam.projectionMatrix * mCam.worldToCameraMatrix;
//temp = temp.inverse;
//mMat.SetMatrix("_Matrix_vp_inverse", temp); float4 worldHPos = mul(_Matrix_vp_inverse,ndcPos);
float4 worldPos = worldHPos / worldHPos.w;
float dis = length(worldPos.xyz);
float3 worldPos2 = worldPos.xyz/dis;
worldPos2 = worldPos2 * 0.5 + 0.5;
return fixed4(worldPos2,1);
}

2 远剪裁面插值

理解一下两点

  1. Image Effect是Post Processing 的一种方式,大致过程就是把Color Buffer的输出当做纹理,然后采用特性的材质渲染和屏大小一样的四角形面片(面片的四角即近剪裁面的四个角)。
  2. Vertex shader输出的数据到Pixel shader输入,经过光栅化会进行插值。远剪裁面的四条射线在Pixel shader后是经过插值的,如下图:



    基于上面两点: 对从摄像机原点出发,经剪裁面的摄像机射线进行插值获得每个位置的摄像机视线方向信息,再已知深度信息的情况下即可 获得摄像机位置 。

取其中一个射线:



根据图中比例关系:

\[\frac{YellowL}{YellowL + GreenL} = \frac{\vec{BlackV}}{\vec{BlackV} + \vec{BlueV}}
\]

因为\(YellowL + GreenL = 1\) , 所以:

\[\vec{BlackV} = YellowL * ({\vec{BlackV} + \vec{BlueV}} )
\]

其中YellowL为DepthMap中01空间数值,${\vec{BlackV} + \vec{BlueV}} \(为远剪裁面四角向量插值后向量\)\vec{interpolatedRay}$。

\[wPos = camWPos + \vec{BlackV} = camWPos + YellowL * \vec{interpolatedRay}
\]

实现过程中:Vertex Shader中计算射线向量,Pixel shader中插值计算结果

struct uoutput
{
float4 pos : SV_POSITION;
half2 uv : TEXCOORD0;
float4 uv_depth : TEXCOORD1;
float4 interpolatedRay : TEXCOORD2;
float3 cameraToFarPlane : TEXCOORD3; }; uoutput far_ray_vert(uinput i)
{
uoutput o;
o.pos = mul(UNITY_MATRIX_MVP, i.pos);
//o.uv = MultiplyUV(UNITY_MATRIX_TEXTURE0, i.uv);
o.uv = i.uv ;
o.uv_depth.xy = o.uv ;
#if UNITY_UV_STARTS_AT_TOP
if (_MainTex_TexelSize.y < 0)
o.uv_depth.y = 1 - o.uv_depth.y;
#endif // 计算远剪裁面每个角相对摄像机的向量
// Clip space X and Y coords
float2 clipXY = o.pos.xy / o.pos.w; // Position of the far plane in clip space
float4 farPlaneClip = float4(clipXY, 1, 1); // Homogeneous world position on the far plane
farPlaneClip *= float4(1,_ProjectionParams.x,1,1);
float4 farPlaneWorld4 = mul(_ClipToWorld, farPlaneClip); // World position on the far plane ?????
float3 farPlaneWorld = farPlaneWorld4.xyz / farPlaneWorld4.w; // Vector from the camera to the far plane
o.cameraToFarPlane = farPlaneWorld - _WorldSpaceCameraPos; return o;
} fixed4 far_ray_frag(uoutput o) : COLOR
{
float linearDepth = Linear01Depth(SAMPLE_DEPTH_TEXTURE(_CameraDepthTexture, o.uv_depth)); float3 worldPos = _WorldSpaceCameraPos + linearDepth * o.cameraToFarPlane; //颜色输出
float dis = length(worldPos.xyz);
float3 worldPos2 = worldPos.xyz/dis;
worldPos2 = worldPos2 * 0.5 + 0.5;
return fixed4(worldPos2,1);
}

C#代码:

mMat.SetMatrix("_ClipToWorld", (mCam.cameraToWorldMatrix * mCam.projectionMatrix).inverse);

3. 近剪裁面射线插值

原理上上面类似,实际推导过程,可以参考《Shader 入门精要》或者这里, 代码下载:下载

计算近近剪裁面四个角相对摄像机向量

	Matrix4x4 GetFrustumCorners()
{
Matrix4x4 frustumCorners = Matrix4x4.identity;
Camera camera = mCam;
Transform cameraTransform = mCam.gameObject.transform; float fov = camera.fieldOfView;
float near = camera.nearClipPlane;
float aspect = camera.aspect; float halfHeight = near * Mathf.Tan(fov * 0.5f * Mathf.Deg2Rad);
Vector3 toRight = cameraTransform.right * halfHeight * aspect;
Vector3 toTop = cameraTransform.up * halfHeight; Vector3 topLeft = cameraTransform.forward * near + toTop - toRight;
float scale = topLeft.magnitude / near; topLeft.Normalize();
topLeft *= scale; Vector3 topRight = cameraTransform.forward * near + toRight + toTop;
topRight.Normalize();
topRight *= scale; Vector3 bottomLeft = cameraTransform.forward * near - toTop - toRight;
bottomLeft.Normalize();
bottomLeft *= scale; Vector3 bottomRight = cameraTransform.forward * near + toRight - toTop;
bottomRight.Normalize();
bottomRight *= scale; frustumCorners.SetRow(0, bottomLeft);
frustumCorners.SetRow(1, bottomRight);
frustumCorners.SetRow(2, topRight);
frustumCorners.SetRow(3, topLeft); return frustumCorners;
}
//设置
mMat.SetMatrix("_FrustumCornersWS", GetFrustumCorners());

Shader

 struct uinput
{
float4 pos : POSITION;
half2 uv : TEXCOORD0;
}; struct uoutput
{
float4 pos : SV_POSITION;
half2 uv : TEXCOORD0;
float4 uv_depth : TEXCOORD1;
float4 interpolatedRay : TEXCOORD2;
float4 cameraToFarPlane : TEXCOORD3;
}; uoutput near_ray_vert(uinput i)
{
uoutput o;
o.pos = mul(UNITY_MATRIX_MVP, i.pos);
o.uv = MultiplyUV(UNITY_MATRIX_TEXTURE0, i.uv);
o.uv = i.uv ;
o.uv_depth.xy = o.uv ;
#if UNITY_UV_STARTS_AT_TOP
if (_MainTex_TexelSize.y < 0)
o.uv_depth.y = 1 - o.uv_depth.y;
#endif int index = 0;
if (i.uv.x < 0.5 && i.uv.y < 0.5)
{
index = 0;
}
else if (i.uv.x > 0.5 && i.uv.y < 0.5)
{
index = 1;
}
else if (i.uv.x > 0.5 && i.uv.y > 0.5)
{
index = 2;
}
else
{
index = 3;
}
o.interpolatedRay = _FrustumCornersWS[(int)index];
return o;
}
fixed4 near_ray_frag(uoutput o) : COLOR
{
float linearDepth = LinearEyeDepth(SAMPLE_DEPTH_TEXTURE(_CameraDepthTexture, o.uv_depth));
float3 worldPos = _WorldSpaceCameraPos + linearDepth * o.interpolatedRay.xyz;
return WorldPosTo01(worldPos); float dis = length(worldPos.xyz);
float3 worldPos2 = worldPos.xyz/dis;
worldPos2 = worldPos2 * 0.5 + 0.5;
return fixed4(worldPos2,1);
}

4. 小结

上面的推到过程,参考到一些<shader入门精要>以及Jim的博客,在Unity提供的Effect(Global Fog以及Emotion Blur)中也有使用类似的方式。对Global Fog中插值使用方式还挺有点不甚理解,使用pos.z作为射线索引,没弄明白这个Z为啥可以作为索引。

文章源码测试源码下载:http://pan.baidu.com/s/1c2rHVf6

Unity Shader 基础(4) 由深度纹理重建坐标的更多相关文章

  1. Unity Shader 基础(3) 获取深度纹理

    Unity提供了很多Image Effect效果,包含Global Fog.DOF.Boom.Blur.Edge Detection等等,这些效果里面都会使用到摄像机深度或者根据深度还原世界坐标实现各 ...

  2. Unity Shader基础

    Unity Shader基础 先上代码,代码一般是这样的. void Initialization(){ //先从硬盘加载代码再加载到GPU中 string vertexShaderCode = Lo ...

  3. Unity Shader入门精要学习笔记 - 第3章 Unity Shader 基础

    来源作者:candycat   http://blog.csdn.net/candycat1992/article/ 概述 总体来说,在Unity中我们需要配合使用材质和Unity Shader才能达 ...

  4. 第二章 Unity Shader基础

    [TOC] 1. Unity Shader 的基础: ShaderLab 学习和编写着色器的过程一直是一个学习曲线很陡峭的过程,通常情况下为了自定义渲染效果往往要和很多文件和设置打交道,这些设置很容易 ...

  5. Unity Shader 基础

    推荐: https://www.cnblogs.com/nanwei/p/7277417.html 上面链接作者的整个系列都写的不错 https://www.cnblogs.com/nanwei/ca ...

  6. 【Unity Shader】(四) ------ 纹理之法线纹理、单张纹理及遮罩纹理的实现

    笔者使用的是 Unity 2018.2.0f2 + VS2017,建议读者使用与 Unity 2018 相近的版本,避免一些因为版本不一致而出现的问题. [Unity Shader](三) ----- ...

  7. Unity Shader 基础(1): RenderType & ReplacementShader

    很多Shader中都会定义RenderType这个类型,但是一直搞不明白到底是干嘛的,官方文档是这样结解释的:Rendering with Replaced Shaders Rendering wit ...

  8. Unity Shader基础(1):基础

    一.Shaderlab语法 1.给Shader起名字 Shader "Custom/MyShader" 这个名称会出现在材质选择使用的下拉列表里 2. Properties (属性 ...

  9. [Unity] Shader(着色器)之纹理贴图

    在Shader中,我们除了可以设定各种光线处理外,还可以增加纹理贴图. 使用 settexture 命令可以为着色器指定纹理. 示例代码: Shader "Sbin/ff2" { ...

随机推荐

  1. Go Web:数据存储(1)——内存存储

    数据可以存储在内存中.文件中.按二进制序列化存储的文件中.数据库中等. 1.内存存储 2.CSV文件存储 3.gob序列化存储 内存存储 将数据存储到内存中.此处所指的内存是指应用程序自身的内存空间( ...

  2. lua的面向对象

    Lua中的table就是一种对象,但是如果直接使用仍然会存在大量的问题,见如下代码: Account = {balance = } function Account.withdraw(v) Accou ...

  3. [转]usdt omnicore testnet 测试网络

    本文转自:https://www.jianshu.com/p/417c280b8f9f Testnet 模式允许 omni core 运行在比特币测试链上,用于安全测试. 为了在 testnet 上收 ...

  4. Spring.net的一些感悟

    模拟Oracle+spring.net+NHibernate+MVC 对DLL文件引用问题得注意,库文件最好放在固定目录,否则严重影响项目迁移的成功, 由此可见,“代码规范”的重要性(自己大部分时间耽 ...

  5. C#通过调用WinApi打印PDF文档类,服务器PDF打印、IIS PDF打印

    其他网站下载来的类,可以用于Winform.Asp.Net,用于服务器端PDF或其他文件打印. 直接上代码: using System; using System.Collections.Generi ...

  6. TeamViewer 12\13\14 破解版(解决检测为商业用途的方式)

    一.Windows系统下破解TeamViewer的方式 1.用Windows直接卸载本地的TeamViewer软件2.下载一个Everything软件,并安装好它(这是一个搜索本机文件的工具,超级好用 ...

  7. 从零开始学安全(七)●Linux基础命令学习笔记

    halt 关机reboot 现在重新启动su - 如果当前是普通用户,则输入这条命令切换到管理员用户(root),如果要切换到其他用户则敲入 su - 用户名 如: su - wangxin root ...

  8. mysql写注释的几种方法

    MySQL的注释风格总的来说有三种.它们分别是 1.单行注释可以用"#" select 1 as cname; #this is a comment +-------+ | cna ...

  9. html 三列布局(两列自适应,一列固定宽度)

    不做过多解释:主要是记录一个完整的布局样式,实现页面大致三列其中左右两列是自适应宽度,中间固定宽度效果. 不多少代码奉上: CSS样式代码: /******************** *公共标签样式 ...

  10. [android] 采用post的方式提交数据

    GET:内部实现是组拼Url的方式,http协议规定最大长度4kb,ie浏览器限制1kb POST和GET的区别比较了一下,多了几条信息 Content-Type:application/x-www- ...