glsl 图片旋转不变形

shader 脚本里面图片纹理需要旋转时，步骤如下：

1、把坐标中心移到屏幕中间，

2、把xy坐标校正成比例一致

3、图片旋转

4、把xy坐标返回成原比例

3、再把坐标平移到原位置

假如说没有xy比例校正容易出现图片旋转后拉伸情况，shader toy 的代码如下

vec2 rotate2D(vec2 _st, float _angle, float aspt){
    _st -= 0.5;
    _st.x = _st.x * aspt;
    _st =  mat2(cos(_angle),-sin(_angle),
                sin(_angle),cos(_angle)) * _st;
    _st.x = _st.x / aspt;
    _st += 0.5;
    return _st;
}
void mainImage( out vec4 fragColor, in vec2 fragCoord )
{
    // set up our coordinate system
    float aspectRatio = iResolution.x / iResolution.y;
    vec2 uv = (fragCoord.xy / iResolution.xy) ;

    uv = rotate2D(uv, sin(iTime * 0.1) * 2. * PI, aspectRatio);
    vec3 color  =  texture(iChannel0, uv).xyz *  
    step(0., uv.x) *  step(0., uv.y) * step(0., 1. - uv.x) * step(0., 1. - uv.y);
 
    
    fragColor = vec4(color ,1.0);
}

效果如下图