glsl - GLSL 精明着色器

Question

我正在尝试使用精明的边缘检测器创建一个边缘检测器着色器，我已经调整了一些 nodeJS 库，直到我有：

顶点：

precision highp float;

    attribute vec2 a_VertexPosition;
    attribute vec2 a_TextureCoord;

    varying vec2 v_TextureCoord;

    void main() {

      v_TextureCoord = a_TextureCoord;

      gl_Position = vec4(a_VertexPosition, 0., 1.);
    }

片段着色器：

precision highp float;

    uniform vec2 resolution;
    uniform sampler2D t;

    uniform float u_WeakThreshold;
    uniform float u_StrongThreshold;
    uniform bool u_UseEdgeDetection;

    varying vec2 v_TextureCoord;

   ...functions canny

    float cannyEdgeDetection(
      sampler2D textureSampler,
      vec2 textureCoord,
      vec2 resolution,
      float weakThreshold,
      float strongThreshold
    ) {
      vec2 gradient = getSuppressedTextureIntensityGradient(textureSampler, textureCoord, resolution);
      float edge = applyDoubleThreshold(gradient, weakThreshold, strongThreshold);
      if (edge == .5) {
        edge = applyHysteresis(
          textureSampler, textureCoord, resolution, weakThreshold, strongThreshold);
      }
      return edge;
    }

    void main() {

      // vec2 uvTex = vec2(v_TextureCoord.x/3.0, v_TextureCoord.y/3.0);

      float edge = cannyEdgeDetection(
        t, v_TextureCoord, resolution, u_WeakThreshold, u_StrongThreshold);
      if (u_UseEdgeDetection) {
        gl_FragColor = vec4(vec3(edge), 1.);
      } else {
        gl_FragColor = texture2D(t, v_TextureCoord);
      }
    }

很抱歉这么多乱七八糟的代码，但我真的很陌生，不知道引用函数的更好方法。

这导致精巧的边缘图像是预期大小的 1/4。任何人都可以帮助我找出为什么结果小于预期？提前致谢！我认为与顶点坐标有关，但我不确定。

标签： glslwebglshader