WebGL: Текстура глубины отображения

Question

Я новичок в WebGL и пытаюсь внедрить текстуры глубины для последующего использования в Shadow Maps. Ниже приведен мой код инициализации фреймбуфера. В функции drawTest я сначала привязываю все необходимые Буферы и рисую вершины Модели в фреймбуфер, который прикреплен к текстуре. Не должно ли это работать? Все, что я получил - белый экран и никаких ошибок.

this.drawTest = function (model1) { 

    this.model1 = model1; 


     if (model1.Image.ReadyState === true && model1.Ready === false) { 
      this.PrepareModel(model1); 
     } 
     if (model1.Ready) { 
      gl.bindBuffer(gl.ARRAY_BUFFER, this.model1.Vertices); 
      gl.vertexAttribPointer(this.VertexPosition, 3, gl.FLOAT, false, 0, 0); 
      gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, model1.Triangles); 
     } 

     gl.bindFramebuffer(gl.FRAMEBUFFER, this.depthFramebuffer); 

     gl.clear(gl.DEPTH_BUFFER_BIT); 

     gl.drawElements(gl.TRIANGLES, model1.numItems, gl.UNSIGNED_SHORT, 0); 




} 


this.InitDrawDepth = function(size) { 

     this.depthTextureExt = gl.getExtension("WEBGL_depth_texture"); // Or browser-appropriate prefix 
     if(!this.depthTextureExt) { 
      console.log("WEBGL_depth_texture Extension not available!"); 
      return; 
     } 

     // Create a color texture 
     this.colorTexture = gl.createTexture(); 
     gl.bindTexture(gl.TEXTURE_2D, this.colorTexture); 
     gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST); 
     gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST); 
     gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE); 
     gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE); 
     gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, size, size, 0, gl.RGBA, gl.UNSIGNED_BYTE, null); 

     this.depthTexture = gl.createTexture(); 
     gl.bindTexture(gl.TEXTURE_2D, this.depthTexture); 
     gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST); 
     gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST); 
     gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE); 
     gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE); 
     gl.texImage2D(gl.TEXTURE_2D, 0, gl.DEPTH_COMPONENT, size, size, 0, gl.DEPTH_COMPONENT, gl.UNSIGNED_SHORT, null); 

     // var framebuffer = gl.createFramebuffer(); 
     this.depthFramebuffer = gl.createFramebuffer(); 
     gl.bindFramebuffer(gl.FRAMEBUFFER, this.depthFramebuffer); 
     gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, this.colorTexture, 0); 
     gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.DEPTH_ATTACHMENT, gl.TEXTURE_2D, this.depthTexture, 0); 

     if(!gl.checkFramebufferStatus(gl.FRAMEBUFFER) === gl.FRAMEBUFFER_COMPLETE) { 
      console.log("Framebuffer incomplete!"); 
     } 

     //reset Framebuffer 
     gl.bindFramebuffer(gl.FRAMEBUFFER, null); 

     this.depthTextureSize = size; 

    } 

Answer 1

Мне удалось решить эту проблему. У меня была другая функция, вызывающая проблемы с исходными буферами. Спасибо всем, кто попытался выяснить проблему.