webgl学习笔记2(模板测试 深度测试,混合测试)

webgl最后渲染阶段:
原文章
片元着色器-模板测试-深度测试-混合测试-颜色缓冲区
模板测试(stencil test):
本质是镂空,核心是持有一个模板缓冲,每个像素和片段都有一个模板值,每个模板值是8位,值范围是0-255,也就是可以有256种不同的值,可以通过设置我们想要的模板值来丢弃或保留一个片段。
模板测试方法:
stencilFunc(Glenum func ,GLint ref ,GLuint mask)
:用来控制stencil的测试方式,得出测试结果
第一个参数指定模板测试比较函数(gl.NEVER 总是不通过)
在这里插入图片描述 第二个参数 用来做模板测试的参考值
第三个参数 指定操作掩码(采用16进制或8进制),在测试时将ref mask 进行与运算,再将mask与模板缓冲中的值进行与运算,最后根据比较函数得出结果

stencilOp:根据测试结果决定要如何处理缓冲中的数据
stencilOp(Glenum fail ,Glenum zfail, Glenum zpass):
fail:指定当前模板测试不通过时的行为在这里插入图片描述
zfail: 指定当前模板测试通过但是深度测试未通过的行为,允许值和默认值都跟fail相同
zpass:指定当前模板测试通过深度测试也通过的行为或者模板测试通过且没有开启深度测试的行为,允许值和默认值都跟fail相同

webgl模板测试默认是禁用
gl.enable(gl.STENCIL_TEST);
gl.clear(gl.COLOR_BUFFER_BIT | gl.STENCIL_BUFFER_BIT);
例子:
设置一个面片的模板测试值为0,测试函数NEVEL
一个面片的模板测试值为1,测试函数NEVEL(让人物显示的面片ß)
设置人物材质测试值为1,测试函数EQUAL
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
深度测试(Depth Test)
深度缓冲,存储每个片段的深度值,将当前渲染的每一个片段的深度值与深度缓冲中的内容进行对比测试,测试失败则丢弃
深度缓冲是在片段着色器之后,也是在模板测试之后。在屏幕空间运行的,屏幕坐标与gl.viewport设置有关,gl_FragCoord.x y代表片段的屏幕空间坐标,z 是深度值
depthFunc
gl.enable(gl.DEPTH_TEST);
gl.clear(gl.COLOR_BUFFER_BIT | gl.STENCIL_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
当深度测试通过之后会将当前片段的z值存入深度缓冲中,z 介于 0-1

在这里插入图片描述
混合测试:

多个有透明度的物体颜色混合(玻璃窗效果):启用混合需要关闭深度写入
混合方程:
在这里插入图片描述
sfactor:源因子
dfactor:目标因子
在这里插入图片描述

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值