2017-06-09 9 views
0

Imに問題がありました。私は楽しいために一緒に遊ぶためのシンプルなthree.jsプロジェクトのソースコードをダウンロードしました。私はオブジェクトの色を変更しようとしていますが、16進コードを変更したり、ブラウザを保存したりリフレッシュしたりすると、色は変更されません。どんな助けでも大歓迎です。three.jsで色を変更するには?

function init() { 

// heeere we go ! 

var blue = new THREE.Color(0x7658ef); 
var pink = new THREE.Color(0xfca4c5); 

var scene = new THREE.Scene(); 
var camera = new THREE.PerspectiveCamera(75, window.innerWidth/window.innerHeight, 0.1, 1000); 

var renderer = new THREE.WebGLRenderer({ alpha: true }); 
renderer.setSize(window.innerWidth, window.innerHeight); 
document.body.appendChild(renderer.domElement); 

//THREEx.WindowResize(renderer, camera); 
var shape = []; 
geometry = new THREE.IcosahedronGeometry(2.5,0); 
material = new THREE.MeshNormalMaterial({ color: 0x0000ff }); 
shape[0] = new THREE.Mesh(geometry, material); 
shape[1] = new THREE.Mesh(geometry, material); 
shape[2] = new THREE.Mesh(geometry, material); 
shape[0].position.set(0,5,0); 
shape[1].position.set(0,5,0); 
shape[2].position.set(0,5,0); 
scene.add(shape[0],shape[1],shape[2]); 

var light = new THREE.PointLight(0xfca4c5); 
light.position.set(0,250,0); 
scene.add(light); 

camera.position.set(3,4,10); // x y z 

function render() { 
    requestAnimationFrame(render); 

    shape[0].rotation.x += 0.035; 
    shape[0].rotation.y -= 0.005; 
    shape[1].rotation.y += 0.015; 
    shape[1].rotation.z -= 0.005; 
    shape[2].rotation.z -= 0.025; 
    shape[2].rotation.x += 0.005; 
    renderer.render(scene, camera); 
} 
render(); 

}

のinit();

+0

を行う必要があり、それを変更するには?コードにはいくつかの色があります。 – gaitat

+0

トップ2、varピンク、varブルー。 33ccccと333333の両方に変更しようとしましたが、何も起こらなかったのは – gratschultz2013

+0

ですが、あなたの 'THREE.MeshNormalMaterial({color:0x0000ff});'は青です。あなたが変更する必要があるものです。これらの変数はどこにも使われません(あなたの投稿されたコード内で) – gaitat

答えて

0

THREE.Colorが対象です。 THREE.Materialは、特定の種類の引数を特定のパラメータに指定すると、いくつかの魔法を発揮します。したがって、文字列または数値をカラーとして指定すると、3つのカラーオブジェクトが作成されます。

yourMaterial.color instanceof THREE.Color === true

あなたは何に変化している何色

yourMaterial.color.setRGB(1,0,1)

関連する問題