javascript为webgl加载纹理

我试图对象化一种在webgl中加载纹理的方法。我有一系列的行星，我设定了一个名称和其他值。我所有的纹理都被称为sun.jpg，mercury.jpg等，所以当我建立名称字符串时，我可以使用Planets[i].name+".jpg"来获取纹理的名称。我得到的错误是javascript为webgl加载纹理

Uncaught TypeError: Cannot read property 'image' of undefinedSpheredPlanetsGL.js:138 handleLoadedTextureSpheredPlanetsGL.js:179 TextureName.(anonymous function).image.onload

我设置的textureName阵列是这样的：（此数组认为我以后引用单个变量）

var TextureName = []; 
    function setBufferName() 
    { 
     for(var i = 0; i < Planets.length; i++) 
     { 
      TextureName[i] = {name: Planets[i].name+"TextureName"}; 
     } 
    }

然后我初始化纹理是这样的：（这应该确保“sunTextureName”应引用的所有行星“sun.jpg”等）

function initTexture() 
    { 
     for(var i = 0; i < Planets.length; i++) 
     { 
      TextureName[i] = gl.createTexture(); 
      TextureName[i].image = new Image(); 
      TextureName[i].image.onload = function() 
      { 
       handleLoadedTexture(TextureName[i]); 
      } 
      TextureName[i].image.src = Planets[i].name+".jpg"; 
     } 
    }

那么错误发生在这里的时候“handleLoade dTexture（TextureName [1]）”之称和IM不知道为什么功能是这样的：

function handleLoadedTexture(texture) 
    { 
     gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, true); 
     gl.bindTexture(gl.TEXTURE_2D, texture); 
     gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, texture.image); 
     gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR); 
     gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR_MIPMAP_NEAREST); 
     gl.generateMipmap(gl.TEXTURE_2D); 
     gl.bindTexture(gl.TEXTURE_2D, null); 
    }

更清晰错误发生在这条线gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, texture.image);。我不知道为什么，因为我传入变量，我应该引用数组中的内容。

任何帮助？

来源

2014-12-23 Dennington-bear

问题是你的计数器变量的范围。您的循环递增计数器变量，并在其大于或等于Planets.length时退出。当你的回调执行时，循环已经完成，并且i保留在Planets.length。

您可以使用IIFE（立即调用函数表达式）创建的i作用域复制像这样：

for(var i = 0; i < Planets.length; i++) 
    { 
     TextureName[i] = gl.createTexture(); 
     TextureName[i].image = new Image(); 
     TextureName[i].image.onload = (function (index) { 
      return function() { handleLoadedTexture(TextureName[index]) } 
     })(i); 
     TextureName[i].image.src = Planets[i].name+".jpg"; 
    }

来源

2014-12-23 23:00:10

非常感谢它固定的一切！ –

javascript为webgl加载纹理

回答

相关问题