Shader之旅6:二维画面的UV旋转

书写本文的初衷是为了自我反省记录。如有表达不当,请批评指正

首先放上在shadertoy上的效果,右图是未旋转的时候的样子,左图是旋转45°之后,第三个图是因为纵横比不一样,导致了错切

void mainImage(out vec4 fragcolor,in vec2 fragCoord){
     vec2 uv = fragCoord.xy / iResolution.xy;
    
    //float rot = radians(45.0);
    float rot = radians(0.0);
    //这里最好还是使用第二种方式,主要是防止纵横比不一致导致错切的情况
    //vec2(iResolution.x,iResolution.x)/ iResolution.xy 改为
    //vec2(iResolution.x,iResolution.y)/ iResolution.xy 后会错切
    // vec2 aspectratio = iChannelResolution[0].xy/ iResolution.xy;
     vec2 aspectratio = vec2(iResolution.x,iResolution.x)/ iResolution.xy;
    uv-=.5;
    uv.xy /= aspectratio;
    mat2 m = mat2(cos(rot), -sin(rot), sin(rot), cos(rot));
   	uv  = m * uv;
    uv.xy *= aspectratio;
    uv+=.5;
    
   
    fragcolor=texture(iChannel0,uv);
}


以上是二维旋转的矩阵,shader中就是构造了这样的一个矩阵,所以原理很简单

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值