web-dev-qa-db-ja.com

Three.js-ランタイムでマテリアルを変更する

Blenderからエクスポートされた.jsファイルがいくつかあり、THREE.JSONLoader();でロードします

私のコールバック：

var callback   = function( geometry ) { createMesh(geometry);

私のローディング：

loader.load( "Models/sculp.js", callback );

私の作成方法：

function createMesh(geometry){

    inArr[id] = new THREE.Mesh( geometry, new THREE.MeshLambertMaterial( { color: 0xbbbbbb} ) );
    inArr[id].scale.set( 100, 100, 100 );
    scene.add( inArr[id] );
    id++;
}

次に、キーボードを使用して、実行時にマテリアルを変更します（色と不透明度を変更します）。

どうやってやるの？

javascript3dwebglthree.js
22
Phipps

メッシュごとに新しいマテリアルを作成するとき、inArr配列のすべてではなく、1つのメッシュの色のみを変更することを想定しています。おそらく、何らかの選択が必要です。ただし、素材の色だけを変更するのは非常に簡単です。

var onKeyDown = function(event) {
  if (event.keyCode == 67) { // when 'c' is pressed
    object.material.color.setHex(0xff0000); // there is also setHSV and setRGB
  }
};
document.addEventListener('keydown', onKeyDown, false);

objectは、変更するメッシュです。キーコードはここにあります： http://www.cambiaresearch.com/articles/15/javascript-char-codes-key-codes

40
kaipr