Question

我想加载纹理图集并将其切割成几种材质，以便在我的Three.JS场景中使用。我已经构建了以下工作，但是在使用一些材料之后我的程序变慢了。我正在用1024x2048纹理构建它们，所以我认为问题在于纹理每个占用了那么多内存。如果我单独加载它们，我的程序就会一直很好。

var atlasTexture = THREE.ImageUtils.loadTexture( imagepath, undefined, function() {

    for (var key in json.frames) {
        var tex = atlasTexture.clone();
    var frame = json.frames[key].frame;

    tex.repeat.x = ( frame.w / atlasTexture.image.width );  
    tex.repeat.y = ( frame.h / atlasTexture.image.height );
    tex.offset.x = ( Math.abs( frame.x ) / atlasTexture.image.width );
    tex.offset.y = ( Math.abs( frame.y )/ atlasTexture.image.height );
    tex.needsUpdate = true;

    var material = new THREE.MeshPhongMaterial( { transparent:true, map: tex, side: THREE.DoubleSide} ); 
    scope.materials.push( material );
    }

} );

有没有办法将纹理裁剪到他们实际需要的尺寸？

如何在Three.JS中正确加载纹理图集？

0 个答案: