美文网首页
浅谈gl_FragCoord与viewPort的关系

浅谈gl_FragCoord与viewPort的关系

作者: MemetGhini | 来源:发表于2021-10-14 22:15 被阅读0次

gl_FragCoord表示当前片段的窗口相对坐标。但看到这个概念后也许会有点迷惑难道一直都返回相对于窗口的非归一化坐标吗?
先把结论写在前面:当然不是,是相对于当前绑定FBO的颜色附件纹理大小。

当然实践出真理,为了彻底描述清楚这个概念做了几个简单的实验。
备注:因为shader编译和传值不是本文重点所以直接上shader

首先编写两个简单

定点着色器:

attribute vec2 position;
void main() {
    gl_Position = vec4(position, 0.0,1.0);
}

片元着色器:

uniform vec4 viewport;
void main() 
{
    gl_FragColor = vec4(vec2(gl_FragCoord.xy)/viewport.zw, 0.0, 1.0);    
}

在一个720x1280的渲染窗口上直接执行viewport设为{0, 0, 720, 1280}得到如下结果:

720.png

符合预期,左下角为(0,0),右上角为(720,1280)。

创建一个小纹理验证

先创建一个(300,300)纹理并绑好fbo直接往这个纹理中渲染得到如下结果,意思就是说这里还没涉及到窗口,离屏渲染也得到左下角为(0,0)右上角为(300,300)。

300.png

如果在绘制到(300,300)的纹理上是把viewport设为(50,50,300,300)

final2.png
很明显纹理左下角叫还是(0,0)点,(50,50)是(50.0/300.0,50.0/300.0)点,如果想跟viewport对齐可以稍微调整一下shader代码
gl_FragColor = vec4(vec2(gl_FragCoord.xy-viewport.xy)/viewport.zw, 0.0, 1.0); 

减掉viewport的起始点即可。

final3.png

希望对这个概念的理解有所帮助!

相关文章

  • 浅谈gl_FragCoord与viewPort的关系

    gl_FragCoord表示当前片段的窗口相对坐标。但看到这个概念后也许会有点迷惑难道一直都返回相对于窗口的非归一...

  • 浅谈Viewport

    一、Viewport的概念 通俗的讲,移动设备上的viewport就是设备的屏幕上能用来显示我们的网页的那一块区域...

  • 移动和pc网页布局适配多设备

    一.视口(viewport) viewport视口 viewport是严格的等于浏览器的窗口。viewport与跟...

  • meta标签中的viewport

    viewport是什么 viewport是一个区域,分为layout viewport与visual viewpo...

  • SVG 理解viewBox

    viewport viewport就是svg 设置width与height的范围,这个with与height将是浏...

  • 销售基本法后感

    浅谈销售基本法 ——情商与销售的关系 昨天下午的课上,听孙经理演讲了他浅谈的销售基本法之情商与销售的关系。在此写下...

  • 浅谈对viewport的理解

    viewport是什么? viewport的进一步理解 在pc浏览器上 (原始大小) (修改后的大小) 在手机浏览...

  • 浅谈与父母的关系

    两年前所写 在家靠父母,在外靠朋友。在父母身边的时间毕竟少,在朋友身边的时间毕竟多。墙内开花墙外香。父母做得最多,...

  • View 、Drawable 和 ViewPort的关系

    1.view 的大小 就是在屏幕上显示的大小2.drawable 的大小,一般和需要绘制的image的大小一样,映...

  • [HTML] 用meta设置ideal viewport

    移动设备上的viewport分为layout viewport、visual viewport和ideal vie...

网友评论

      本文标题:浅谈gl_FragCoord与viewPort的关系

      本文链接:https://www.haomeiwen.com/subject/bzfpoltx.html