Question

取自AlteredQualia演示：

map = THREE3.ImageUtils.loadTexture( "textures/terrain/grasslight-big.jpg" );
map.wrapS = map.wrapT = THREE3.RepeatWrapping;
map.repeat.set( 16, 16 );

var planeGeo = new THREE3.PlaneGeometry( 200, 200 );

ground = new THREE3.Mesh( planeGeo, new THREE3.MeshPhongMaterial( { color: 0xffffff,    ambient: 0xffffff, specular: 0x111111, shininess: 50, map: map, perPixel: true, metal: true } ) );

我使用ExtJS Ext.getDom（＆＃39; cnvs_img＆＃39;）从HTML画布中提取了png数据。进入var并且var字符串开始＆＃34; data：image / png; base64，...＆＃34;所以认为它是有效的。我想使用此数据而不是使用loadTexture从磁盘加载。非常感谢一些指示，谢谢。

THREE3.ImageUtils.loadTexture（imgVar）当然不起作用： - ）

Answer 1

要从dataURL加载纹理，您可以遵循以下模式：

var image = document.createElement( 'img' );

image.src = dataURL;

image.onload = function() {

    var texture = new THREE.Texture( image );
    texture.needsUpdate = true; // important!

    var material = new THREE.MeshLambertMaterial( { 
        color: 0xffffff, 
        map: texture
    } );

    var mesh = new THREE.Mesh( geometry, material );
    scene.add( mesh );

};

three.js r.67

如何使用imgVar inTHREE3.ImageUtils.loadTexture（imgVar）？

1 个答案: