Я пытаюсь исправить ранее существовавшую ошибку в некотором коде, основанном на THREE.js rev 49, с некоторыми пользовательскими шейдерами.

Я полный новичок в WebGL, поэтому я не смог придумать много голов или хвостов других ответов, поскольку они, казалось, предполагали гораздо больше знаний, чем я. Я был бы очень признателен даже за любые советы о том, что искать! :) Конечный результат кода - нарисовать прозрачный каркас рамки и закрасить грани полупрозрачными текстурами.

Конкретная ошибка:

[.WebGLRenderingContext]GL ERROR :GL_INVALID_OPERATION : glDrawElements: attempt to access out of range vertices in attribute 1

Я проследил проблему до определенного_gl.drawElements( _gl.TRIANGLES, geometryGroup.__webglFaceCount, _gl.UNSIGNED_SHORT, 0 ); в THREE.WebGLRenderer.renderBuffer.

Вот фрагмент кода вызова:

scene.overrideMaterial = depthMaterial; // shaders below
var ctx = renderer.getContext(); // renderer is a THREE.WebGLRenderer
ctx.disable(ctx.BLEND);
// renderTarget is a THREE.WebGLRenderTarget, _camera, scene is obvious
renderer.render(scene, _camera, renderTarget, true); // error occurs here

Вот соответствующие шейдеры:

    uniforms: {},

    vertexShader: [
        "varying vec3 vNormal;",

        "void main() {",

            "vec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );",
            "vNormal = normalMatrix * normal;",

            "gl_Position = projectionMatrix * mvPosition;",

        "}"
    ].join("\n"),

    fragmentShader: [
        "vec4 pack_depth( const in highp float depth ) {",

            "const highp vec4 bit_shift = vec4( 256.0, 256.0*256.0, 256.0*256.0*256.0, 256.0*256.0*256.0*256.0 );",
            "vec4 res = depth * bit_shift;",
            "res.x = min(res.x + 1.0, 255.0);",
            "res = fract(floor(res) / 256.0);",
            "return res;",

        "}",

        "void main() {",
            "gl_FragData[0] = pack_depth( gl_FragCoord.z );",
        "}"
    ].join("\n")

Спасибо за вашу помощь!