标签: vertex-shader

我正在尝试从图形纸中实现算法,并且算法的一部分将已知半径的球体渲染到缓冲区.他们说他们通过计算顶点着色器中的位置和大小来渲染球体,然后在片段着色器中进行适当的着色.

有没有猜到他们实际上是怎么做到的？位置和半径在世界坐标中是已知的,投影是透视的.这是否意味着球体将被投影为圆圈？

我正在尝试使用着色器来修改绑定到帧缓冲区的纹理,但我对着色器如何获得"原始"输入值感到困惑.

我正在做以下事情:

GLuint textureId = 0;
glGenTextures(1, &textureId);
glBindTexture(GL_TEXTURE_2D, textureId);
glTexImage2D(GL_TEXTURE_2D, ...);

GLuint framebufferId = 0;
glGenFramebuffers(1, &framebufferId);
glBindFramebuffer(GL_FRAMEBUFFER, frameBufferId);
glFramebufferTexture2D(GL_FRAMEBUFFER, GL_COLOR_ATTACHMENT0, GL_TEXTURE_2D, textureId, 0);
glBindTexture(GL_TEXTURE_2D, 0);

GLenum status = glCheckFramebufferStatus(GL_FRAMEBUFFER);
if (status != GL_FRAMEBUFFER_COMPLETE) { ... }

glUseProgram(programId);
const GLenum buffer = GL_COLOR_ATTACHMENT0;
glDrawBuffers(1, &buffer);

空顶点和片段着色器看起来像什么？由于我没有绘制灵长类动物,如何设置gl_Position顶点着色器？如何通过输入颜色作为片段着色器的输出颜色？

空顶点着色器:

#version 330

void main()
{
    gl_Position = ??;
}

空片段着色器:

#version 330

layout(location = 0) out vec4 out_colour;

void main()
{
    out_colour = ???;
}

我目前正在使用着色器学习OpenGL(3.3).有一件事我似乎无法解决.我已经读过在OpenGL 3+中不推荐使用内置变量如gl_Position和gl_FragCoords,因此我想使用自己的输出变量.

所以不是这样的:

#version 330\n
layout(location=0) in vec2 i_position;
out vec4 o_position;
void main() 
{
    gl_Position = vec4(i_position, 0.0, 1.0);
};

我写了这个:

#version 330\n
layout(location=0) in vec2 i_position;
out vec4 o_position;
void main() 
{
    o_position = vec4(i_position, 0.0, 1.0);
};

着色器在两种情况下编译都没有问题,但第二个代码只生成空白屏幕.我是否需要以某种方式指定哪个变量是输出变量？

我已经创建了一个自定义着色器,可以使用具有4种不同纹理的BlendMap,但我无法使用阴影/闪电效果来处理它.

我在这里错过了什么？或者是否有其他方法可以实现相同的功能？

下面的网格创建方法显示所有纹理正确混合.

// Creates the ground
function CreateGround() {
    var uniforms = THREE.UniformsUtils.merge([
        THREE.UniformsLib["lights"],
        THREE.UniformsLib["shadowmap"],
    {
        TextureBackground: { type: "t", value: null },
        TextureR: { type: "t", value: null },
        TextureG: { type: "t", value: null },
        TextureB: { type: "t", value: null },
        TextureBlendMap: { type: "t", value: null }
    }]);

    var shaderMaterial;
    try {
        shaderMaterial = new THREE.ShaderMaterial({
            lights: true,
            uniforms: uniforms,
            vertexShader: BlendMapVertexShader,
            fragmentShader: BlendMapFragmentShader
        });
    } catch (e) {
        alert("Error 'CreateGround' : GPU Shader couldn't …

是否可以使用WebGL 从顶点着色器中读取纹理？

我写了一个WebGL页面(只是为了试一试)并使用Chrome 7来测试它.我一升级到Chrome 8,就停止了工作.我仔细检查了webgl是否已启用.错误是:

'texture2D':找不到匹配的重载函数

当我用一个常量替换对texture2D的调用时,它可以工作.使用相同纹理的片段着色器中的纹理访问也起作用.

有人有主意吗？我特别担心升级Chrome会导致它崩溃.

更新:它适用于firefox 4 beta.我报告了Chrome的一个错误 - 问题65340

更新2:它现在可以在Firefox和Chrome中使用

我正在尝试为Three.js制作最简单的自定义着色器,但我还没弄清楚如何使其工作.我正在使用着色器的对象根本没有出现.

在我的页面html中我有:

<script id="simplefs" type="x-shader/x-fragment">

    void main(void) {
        gl_FragColor = vec4(0.0, 1.0, 0.0, 1.0);
    }
</script>

<script id="simplevs" type="x-shader/x-vertex">

    void main(void) {
        gl_Position = modelViewMatrix * projectionMatrix * vec4(position, 1.0);
    }
</script>

然后在javascript中:

var vertShader = document.getElementById("simplevs").innerHTML;
var fragShader = document.getElementById("simplefs").innerHTML;

var myMaterial = new THREE.ShaderMaterial({
    vertexShader : vertShader,
    fragmentShader: fragShader
});

var baseBevel = new THREE.Mesh(new THREE.CylinderGeometry(BaseRadius - BaseBevel, BaseRadius, BaseBevel, 100, 100, false),
                               myMaterial )
baseBevel.position.x = x;
baseBevel.position.y = y;
baseBevel.position.z = BaseHeight - (BaseBevel / 2.0); …

我想知道是否有办法判断顶点着色器中是否启用了顶点属性？我知道如果禁用顶点属性,所有值都将被视为0.0,所以我可以进行如下测试:

if (attribute == 0)
{
    // Do something different to normal.
}
else
{
    // Use the attribute.
}

但是,对于启用该属性并且该值仅设置为0的情况,这具有明显的问题(它将被视为已禁用)!

另一种解决方案是使用一个统一变量来说明是否使用该属性,但我想知道GLSL中是否有任何内置可以做到这一点？

我正在使用自定义着色器创建网格.在顶点着色器中,我正在修改几何顶点的原始位置.然后我需要从着色器外部访问这个新的顶点位置,我该如何实现呢？

我在32x32 tile*32上分割纹理1024 x 1024,我不确定它是否可以与偏移共享纹理,或者我需要为每个具有偏移的tile创建一个新纹理.

创建偏移量我使用统一值= 32*i并通过创建拼贴的每个循环实例更新统一,所有拼贴似乎是相同的偏移量？因为基本上我想要一个图像看起来像它的一个图像没有分解成小瓷砖.但是当前的输出是所有32个瓷砖上相同的x,y偏移.我使用顶点着色器和three.js r71 ...

我是否需要为每个具有偏移的图块创建新纹理？

      for ( j = 0; j < row; j ++ ) {

           for ( t = 0; t < col; t ++ ) {

                customUniforms.tX.value = tX; 
                customUniforms.tY.value = tY;
                console.log(customUniforms.tX.value);
                customUniforms.tX.needsUpdate = true;
                customUniforms.tY.needsUpdate = true;
                mesh = new THREE.Mesh( geometry,mMaterial);// or new material
           }
       }

       //vertex shader :
       vec2 uvOffset = vUV + vec2( tX, tY) ;    

图片示例:

每个图像的偏移量应为10 0r 20 px,但它们都是相同的....这是使用一个纹理..

正如所建议的那样,我试图在没有运气的情况下操纵每个对象上的紫外线,它似乎使所有相同的顶点具有相同的位置,例如10x10 segmant平面​​所有面都将是相同的

    var geometry = [
    [ …

在OpenGL和Direct3D渲染管道中,几何着色器在顶点着色器之后和片段/像素着色器之前处理.现在显然在片段/像素着色器没有意义之后处理几何着色器,但我想知道为什么不把它放在顶点着色器之前？

从软件/高级角度来看,至少,它似乎更有意义:首先运行几何着色器以创建所需的所有顶点(并转储仅与几何着色器相关的任何数据),然后运行这样创建的所有顶点上的顶点着色器.有一个明显的缺点,现在必须在每个新创建的顶点上运行顶点着色器,但是在当前管道中需要为几何着色器中的每个顶点运行需要完成的任何逻辑. ,据推测; 所以那里没有太大的表现.

我假设,因为几何着色器在两个管道中处于这个位置,所以存在硬件原因,或者说它更有意义的非显而易见的管道原因.

(我知道在运行几何着色器之前需要进行多边形链接(如果它需要单点作为输入,可能不会这样做)但是我也知道它需要在几何着色器之后运行,所以它仍然不会在这些阶段之间运行顶点着色器的感觉？)