three.jsにランダムなテクスチャをロードする

Question

私は10個のオブジェクトがあり、10個のテクスチャからなるプールの中からランダムに選択されたテクスチャを各オブジェクトに与えたいとします。このメッシュオブジェクトのためにどうすればいいですか？

あなたのテクスチャ画像の全てが数値/逐次的に命名されている、あなたができると仮定すると、

for(var int = 0; int <= 10 ; int++) 
    { var loader = new THREE.TextureLoader(); 
    var testMat = new THREE.MeshPhongMaterial({ map: loader.load('images/image1') }); 
    var testGeo = new THREE.SphereGeometry(50, 50, 50); 

    testSphere = new THREE.Mesh(testGeo, testMat); 
    testSphere.position.set(distance, 100, 100); 
    scene.add(testSphere); } 

Answer 1

：

... 
var testMat = new THREE.MeshPhongMaterial({ map: loader.load('images/image' + THREE.Math.randInt(1, 10)) }); 
... 

ない場合は、同様の方法でファイル名のリストを作ると思います

var texturesList = [ 
    'images/image1', 
    'images/some-other-image', 
    'images/yet-another-image', 
    ... 
    'images/10th-image' 
]; 
... 
... 
var randIndex = THREE.Math.randInt(0, texturesList.length - 1); 
var randTexture = loader.load(texturesList[randIndex]); 
var testMat = new THREE.MeshPhongMaterial({ map: randTexture }); 
...