时间戳

首页 > 解决方案 > 关于椭圆的旋转

glsl - 关于椭圆的旋转

问题描述

我有一个在 GLSL 中旋转矩形的着色器，如下所示。

const float PI = 3.14159265359;


mat2 rotate2d (float _angle) {
    return mat2 (cos (_angle), -sin (_angle),
                sin (_angle), cos (_angle));
}

void main (void) {

    vec2 st = (gl_FragCoord.xy * 2.0 - resolution) /min(resolution.x,resolution.y);
    float p = 0.0;
    
   st = rotate2d (sin (time) * PI) * st;
    
    vec2 c = max (abs (st) - 0.2,0.0);
    p = length (c);
    p = ceil (p);
    
    vec3 color = vec3 (1.0-p);

    gl_FragColor = vec4 (color, 1.0);

}

我想把这个shader的矩形改成下面的椭圆，并在中心点p处旋转，它是一个椭圆。我应该怎么办？它是r.x, r.y在椭圆的水平和垂直方向rotate2d (sin (time) * PI)上乘以旋转还是在整体上乘？

// Center point
vec2 p = vec2 (0.0,0.0);
// radius
vec2 r = vec2 (2.0,1.0);
// oval shape
float d = (length (p / r) - 1.0) * min (r.x, r.y);

标签： glslshaderfragment-shader

解决方案

旋转坐标并计算该点到椭圆中心的距离。根据距离设置颜色：

const float PI = 3.14159265359;

mat2 rotate2d(float _angle) 
{
    return mat2(cos(_angle), -sin(_angle), sin(_angle), cos(_angle));
}

void main (void)
{
    vec2 st = (gl_FragCoord.xy * 2.0 - resolution) / min(resolution.x, resolution.y);    
    st = rotate2d(time * PI) * st;

    vec2 center = vec2(0.0, 0.0);
    vec2 ab = vec2(0.2, 0.1);
    
    vec2 e = (st - center) / vec2(0.2, 0.1);
    float d = length(e);
    vec3 color = d < 1.0 ? vec3(1.0) : vec3(0.0);

    gl_FragColor = vec4(color, 1.0);
}

推荐阅读