Question

我是OpenGL noob，但我需要使用OpenGL Es 2.0着色器解决以下问题：

给定2D空间中的几何：

翻译几何体的x和y
围绕原点旋转几何体（屏幕空间的左下角）
使用3D中的当前相机（lookat，up，..）

结果将是2D - ＆gt;三维变换几何。

我想这些是熟悉OpenGL（ES 2）的人的基本知识。但对我来说，我希望能为我的特定用法找到一些明确的答案，并希望也有一些代码示例。我已经花了相当长的时间，但除了基本的（功能失调的）矩阵变换之外，我没有做太多的事情。

理想情况下，您可以提供代码段，并附上任何所需转换的说明吗？

为了说明我想要实现的目标，我已经拍摄了一个例子：

原始几何：

翻译y + something，x + nothing：

围绕左下角原点旋转几何体：

使用当前的3D相机值对2D进行透视校正：

对于它的价值，这是我当前的顶点着色器代码，它除了绘制一些几何外，目前什么都不做。 rotationMatrix函数和行

的用法

gl_Position *= rotated

试图绕轴进行任何旋转是一种蹩脚的尝试，这不是我真正想要的。当我意识到我需要你的帮助时;）

        precision mediump float;
        #define LOWP lowp

        attribute vec2 a_position;
        attribute vec2 a_screenPosition;
        attribute vec2 a_uvs;
        attribute float a_alpha;
        attribute float a_rotation;

        uniform mat4 u_proj;

        varying vec2 v_uv;
        varying float v_alpha;

        mat4 rotationMatrix(vec3 axis, float angle)
        {
            axis = normalize(axis);
            float s = sin(angle);
            float c = cos(angle);
            float oc = 1.0 - c;

            return mat4(oc * axis.x * axis.x + c,           oc * axis.x * axis.y - axis.z * s,  oc * axis.z * axis.x + axis.y * s,  0.0,
                        oc * axis.x * axis.y + axis.z * s,  oc * axis.y * axis.y + c,           oc * axis.y * axis.z - axis.x * s,  0.0,
                        oc * axis.z * axis.x - axis.y * s,  oc * axis.y * axis.z + axis.x * s,  oc * axis.z * axis.z + c,           0.0,
                        0.0,                                0.0,                                0.0,                                1.0);
        }

        void main() {
            if (a_alpha != 0.0) {
                float st = sin(a_rotation);
                float ct = cos(a_rotation);

                // rotates first around +z-axis (0,0,1) and then translates by (tx,ty,0)
                vec4 p = vec4(
                    a_position.x * ct - a_position.y * st + a_screenPosition.x,
                    a_position.x * st + a_position.y * ct + a_screenPosition.y,
                    0.0, 1.0
                );

                mat4 rotated = rotationMatrix(vec3(0.0, 1.0, 0.0), 45.0);
                gl_Position = u_proj * p;
                gl_Position *= rotated;
        //        gl_Position = u_proj * p;
            } else {
                gl_Position = vec4(0.0);
            }

            v_uv = a_uvs;
            v_alpha = a_alpha;
        }

Answer 1

更好的解决方案是矩阵转换。在顶点着色器中工作意味着您为每个顶点构建矩阵变换！

如果您遇到矩阵转换问题，请重新考虑您的代码。我在Android上工作，但概念是一样的。

http://www.learnopengles.com/android-lesson-one-getting-started/

最后但并非最不重要的是，尝试使用https://github.com/libgdx/开始研究3D图形。它是一个库多平台和基于Opengl的。而且，它是开源的。

使用OpenGL着色器

1 个答案: