Question

我正在尝试使用带有Three.js（r56）的webgl-texture-utils（https://github.com/toji/webgl-texture-utils）来利用DDS和CRN（http://code.google.com/p/crunch/）纹理。

我无法弄清楚如何使用textureLoader.load(src, callback);中THREE.Texture(image, mapping);返回的纹理

THREE.Texture需要javascript Image（）对象，但是texture-utils会将Firebug报告的内容返回到XrayWrapper [Object WebGLTexture {}，我认为这是一些原生的WebGL纹理类型。

我能否以某种方式将该纹理用作THREE.Texture的图像？

这是我尝试的一些代码：

var mapping = new THREE.UVMapping();

var image = new Image();
var map = null;

var usetexturetools = true;

if (!usetexturetools) { 

  // normal way of loading

  map = new THREE.Texture( image, mapping );
  var loader = new THREE.ImageLoader();
  loader.addEventListener( 'load', function ( event ) {
    map.image = event.content;
    map.needsUpdate = true;
  });
  loader.addEventListener( 'error', function ( event ) {
    window.console.log("error loading " + texture);
  });
  loader.crossOrigin = 'anonymous';
  loader.load(texture, image);

} else {

 // using webgl-texture-tools - not working because i don't know how to use the object returned by textureLoader.load() with THREE.Texture..

 var textureLoader = new TextureUtil.TextureLoader(renderer.getContext());

 map = new THREE.Texture(textureLoader.load(texture, function(loaded) {
    window.console.log(loaded);
    map.needsUpdate = true;
 }), mapping );

}

map.sourceFile = texture;
map.wrapS = THREE.RepeatWrapping;
map.wrapT = THREE.RepeatWrapping;

map.offset.x = this.getParameter("texture_offset_x");
map.offset.y = this.getParameter("texture_offset_y");

map.repeat.x = this.getParameter("texture_scale_x");
map.repeat.y = this.getParameter("texture_scale_y");

编辑：我想我可以创建一个webgl-texture-utils的分支，而不是创建和返回WebGLTexture，只返回原始数据，因此，允许我在THREE.DataTexture（）中使用该数据。当我到达它时我会尝试...看看源代码看起来可能是相当多的工作，但除非出现任何问题，否则我会尝试。

使用webgl-texture-utils和three.js进行dds / crn支持

0 个答案: