three.js - 如何在jsfiddle中加载纹理

Question

如何在 jsfiddle 中使用 THREE.ImageUtils.loadTexture()。我创建了一个演示 [ http://jsfiddle.net/georgeneil/cfrsj/10/ ]。在这里我无法查看纹理。我将点呈现为黑色。

Answer 1

您可以对图像进行base64 编码。然后在代码中添加字符串。

更新了 jsfiddle：http: //jsfiddle.net/cfrsj/11/

Answer 2

问题是您不能使用外部托管的纹理。这是我创建的一些代码，用于在平面上放置纹理。我相信我从 doob 先生的一个项目中改编了这段代码：

img = new Image();
texture = new THREE.Texture(img); 
    img.onload = function() {
    texture.needsUpdate = true;
    makeParticle();
    };
img.src = "http://www.aerotwist.com/tutorials/creating-particles-with-three-js/images/particle.png";

geometry = new THREE.PlaneGeometry( 438, 695, 200 );
material = new THREE.MeshBasicMaterial( {map: texture} );