从threejs中的数组生成纹理

时间:2015-01-28 09:34:26

标签: javascript three.js texture2d

我正在尝试从threeJS中的数组生成纹理,但它没有按预期工作。

看来我生成纹理的方式不正确。

如果我使用以下纹理,它按预期工作。 http://www.html5canvastutorials.com/demos/assets/crate.jpg

crateTex = THREE.ImageUtils.loadTexture('data/crate.jpg');

enter image description here

如果我生成一个虚拟纹理并尝试显示它,它就全黑了......

var dummyRGBA = new Uint8Array(4 * 4 * 4);
for(var i=0; i< 4 * 4; i++){
  // RGB from 0 to 255
  dummyRGBA[4*i] = dummyRGBA[4*i + 1] = dummyRGBA[4*i + 2] = 255*i/(4*4);
  // OPACITY
  dummyRGBA[4*i + 3] = 255;
}

dummyDataTex = new THREE.DataTexture( dummyRGBA, 4, 4, THREE.RGBAFormat );
dummyDataTex.needsUpdate = true;

dummyTex = new THREE.Texture(dummyDataTex);

enter image description here

1 个答案:

答案 0 :(得分:4)

我认为你的错误在于你制作纹理纹理。

当你这样做时:

dummyDataTex = new THREE.DataTexture( dummyRGBA, 4, 4, THREE.RGBAFormat );

您在此处创建的对象dummyDataTex已经是THREE.Texture类型。

所以你的下一步:

dummyTex = new THREE.Texture(dummyDataTex);

没有必要。您应该立即使用dummyDataTex