首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >Shader-FresnelReflection(菲涅尔反射)

Shader-FresnelReflection(菲涅尔反射)

作者头像
祝你万事顺利
发布于 2019-06-17 06:37:53
发布于 2019-06-17 06:37:53
2.4K00
代码可运行
举报
文章被收录于专栏:Unity游戏开发Unity游戏开发
运行总次数:0
代码可运行

菲涅尔公式:用来描述光在不同折射率的介质之间的行为。用公式推导出的光的反射称之为“菲涅尔反射”。

fresnelRes.PNG

应用:运用于类似水面的效果,在近的地方反射较少,看远的地方反射较多。这种效果称之为菲涅尔效应。

在用系统简化公式提升效率: fresnel = fresnel基础值 + fresnel缩放量*pow( 1 - dot( N, V ), 5 ) N-法线 V-观察向量 L-平行光方向

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
Shader "Unlit/FresnelReflection"
{
    Properties
    {
        _MainTex("Texture", 2D) = "white" {}
        _fresnelBase("fresnelBase", Range(0, 1)) = 1
        _fresnelScale("fresnelScale", Range(0, 1)) = 1
        _fresnelIndensity("fresnelIndensity", Range(0, 5)) = 5
        _fresnelCol("_fresnelCol", Color) = (1,1,1,1)
    }

        SubShader
    {
        Tags{ "RenderType" = "Opaque" }
        LOD 100

        Pass
    {
        tags{ "lightmode=" = "forward" }

        CGPROGRAM
#pragma vertex vert
#pragma fragment frag

#include "UnityCG.cginc"
#include "Lighting.cginc"

        struct appdata
    {
        float4 vertex : POSITION;
        float2 uv : TEXCOORD0;
        float3 normal : NORMAL;
    };

    struct v2f
    {
        float2 uv : TEXCOORD0;
        float4 vertex : SV_POSITION;
        float3 L : TEXCOORD1;
        float3 N : TEXCOORD2;
        float3 V : TEXCOORD3;
    };

    sampler2D _MainTex;
    float4 _MainTex_ST;

    float _fresnelBase;

    float _fresnelScale;

    float _fresnelIndensity;

    float4 _fresnelCol;

    v2f vert(appdata v)
    {
        v2f o;
        o.vertex = UnityObjectToClipPos(v.vertex);
        o.uv = TRANSFORM_TEX(v.uv, _MainTex);
        //将法线转到世界坐标
        o.N = mul(v.normal, (float3x3)unity_WorldToObject);
        //获取世界坐标的光向量
        o.L = WorldSpaceLightDir(v.vertex);
        //获取世界坐标的视角向量
        o.V = WorldSpaceViewDir(v.vertex);
        return o;
    }

    fixed4 frag(v2f i) : SV_Target
    {
        fixed4 col = tex2D(_MainTex, i.uv);

    float3 N = normalize(i.N);
    float3 L = normalize(i.L);
    float3 V = normalize(i.V);

    col.rgb *= saturate(dot(N, L)) * _LightColor0.rgb;
    //菲尼尔公式
    float fresnel = _fresnelBase + _fresnelScale * pow(1 - dot(N, V), _fresnelIndensity);

    col.rgb += lerp(col.rgb, _fresnelCol, fresnel) * _fresnelCol.a;

    return col;
    }

        ENDCG
    }
    }
}

fresnelBase表示基础值,fresnelScale表示fresnel效果系数,fresnelIndensity增强次数

fresnelSet.PNG

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2019.06.17 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
postMessage与postMessage跨域
HTML5学堂今日postMessage跨域教学流程 先为大家讲解postMessage的基本知识 之后,我们书写一个实例:使用静态的iframe,实现A域前端页面与B域前端页面之间的数据传递 最后,我们使用JS动态的生成iframe,实现A域的前端页面与B域的前端页面“互通”,并在B域中使用AJAX申请B域的后台数据 1 postMessage通信的方法与事件 postMessage的跨域方法允许来自不同源的脚本采用异步方式进行有限的通信,可以实现跨文本档、多窗口、跨域消息传递。 想要完成“一个域”与“另
HTML5学堂
2018/03/13
3.2K0
postMessage与postMessage跨域
iframe+postMessage实现跨域通信
前言 需求背景: 最近开发管理系统,需要在本页面跳转到一个图片管理系统上传图片,上传成功后返回图片链接,然后返回管理系统,显示图片 实现思路: 上传图片时,需要在本窗口跳转到图片管理系统,并且两个系统之间要通信 考虑到两个系统是不同的端口号,存在跨域问题,这时发现HTML5新增了一个API-window.postMessage(),于是就决定用iframe结合window.postMessage()实现 在页面中嵌入一个iframe,将图片管理系统嵌入到当前的管理系统中,结合window.postMessa
pitaojin
2018/05/25
5.4K1
iframe 与 postMessage 方法
既是发消息,就有发送方与接收方,发送方要调用 postMessage 方法,接收方要注册 onmessage 事件处理函数,处理接收的消息。
挥刀北上
2023/06/20
8820
iframe 与 postMessage 方法
详解使用postMessage解决iframe跨域通信问题
这周碰到一个让人头疼的需求:要在我的web项目中嵌入另一个第三方web项目。第一时间想到的就是用iframe了,但问题来了,我和第三方web项目是有交互的,这就违反同源策略了,处理跨域问题是最让人头疼的事之一。
用户1289394
2021/10/13
4.9K0
window.postMessage和window.dispatchEvent的区别
postMessage 和 window.dispatchEvent 是两种不同的机制,虽然它们都可以通过 window.addEventListener 监听,但它们的设计目的、使用场景和功能有很大的区别。以下是它们的详细对比:
biaoblog.cn 个人博客
2025/05/21
2180
不同页面通信与跨域0. 前言1. localstorage2. 玩转iframe3. 非同域的两个tab页面通信4.MessageChannel
相信跨域有什么手段,大家都背得滚瓜烂熟了。现在我们来做一些不在同一个tab页面或者跨域的实践。
lhyt
2018/10/31
4.6K0
iframe怎么将参数传递给vue 父组件
在子页面的iframe中想将参数传递给Vue父组件,可以使用postMessage()方法将数据发送给父窗口。父组件可以通过监听message事件来接收并处理这些数据。
王小婷
2023/08/10
2.1K0
postMessage详解
该方法是HTML5引入的API,可以通过异步方式实现跨源通信,多用于窗口间数据通信。它提供了一种受控机制来规避不同源脚本无法通信的限制,只要正确使用,这种方法很安全。
全栈程序员站长
2022/09/13
9360
postMessage详解
如何利用postMessage窃取编辑用户的Cookie信息
某天,当我在做某个项目的漏洞测试时,在登录的一些HTTP请求记录中,我发现了一种利用postMessage方式窃取和编辑用户Cookie的方法。由于该测试是邀请测试,出于保密,我只能在下文中和大家分享一些方法思路。
FB客服
2019/05/09
1.7K0
如何利用postMessage窃取编辑用户的Cookie信息
postMessage 消息传递
        web开发了,除了前台与服务器交换数据,还有可能前台页面间需要进行数据传递,比如窗口间,页面和嵌套的iframe间。这些问题之前都有解决办法,但是现在html5引入的message的API可以更方便、有效、安全的解决这些问题。
用户2038589
2018/09/06
1.1K0
不同页面通信与跨域
相信跨域有什么手段,大家都背得滚瓜烂熟了。现在我们来做一些不在同一个tab页面或者跨域的实践。
lhyt
2022/09/21
1.9K0
不同页面通信与跨域
深入理解 <iframe>的双向通信:从基础到实战
在现代 Web 开发中,<iframe> 是一个常用的 HTML 元素,用于在页面中嵌入另一个网页。然而,<iframe> 的嵌入页面与父页面之间的通信一直是一个复杂且容易出错的问题。本文将深入探讨 <iframe> 的双向通信机制,从基础概念到实战应用,帮助开发者彻底掌握这一技术。
Front_Yue
2025/03/12
5390
深入理解 <iframe>的双向通信:从基础到实战
关于html5的PostMessage的用法总结(转载)
    大家都知道,网页之间传递数据可以使用ajax请求来完成,今天我总结下我学习的postMessage是如何完成跨页面请求数据的呢?首先,postMessage是html5新增的一个解决跨域的一个方法。那他是如何使用的呢?这里我把一个案例分享出来把。看下面的代码:
李维亮
2021/07/08
5870
【JS】504- HTML5 之跨域通讯(postMessage)
本文来自公众号【前端早读课】,最近工作中用在使用 postMessage ,所以一起分享给大家一下~
pingan8787
2020/02/26
1.9K0
【JS】504- HTML5 之跨域通讯(postMessage)
postMessage使用
参考自文档:https://www.runoob.com/js/met-win-postmessage.html
蓓蕾心晴
2022/06/30
5880
postMessage实现跨域通信
web通信(洋名:web messaging)是一种文档中独立的浏览上下文间的DOM不会被恶意的跨域脚本暴露数据分享方式。
javascript.shop
2019/09/04
1.8K0
postMessage实现跨域通信
[Go] GO语言实战-实现标题闪烁
因为聊天框是被iframe框进去的页面,所以在聊天框中收到websocket消息以后要把消息发送给父集页面,在父页面中闪烁标题
唯一Chat
2020/07/29
6280
[Go] GO语言实战-实现标题闪烁
Web中的窗口通讯方式及使用(postMessage/MessageChannel/BroadcastChannel)
三种常用的跨窗口通信技术:postMessage、MessageChannel 和 BroadcastChannel。
码客说
2024/01/06
2.3K0
postMessage 还能这样玩
在日常工作中,消息通信是一个很常见的场景。比如大家熟悉 B/S 结构,在该结构下,浏览器与服务器之间是基于 HTTP 协议进行消息通信:
ConardLi
2020/11/26
2.1K0
postMessage 还能这样玩
html5 Postmessage解决跨域问题
为了实现不同域之间的通信,需要在操作系统的 hosts 文件添加两个域名,进行模拟。
申君健
2018/09/21
1.1K0
推荐阅读
相关推荐
postMessage与postMessage跨域
更多 >
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档