0

3dsシーン形式でturbosquidから3D人間の歯のモデルを購入しました。私がやりたいのは、ファイルから個々の歯を抽出し、それらをth​​reejsスクリプトで使用してWebページに表示することです。私が行ったことは、3ds Maxから.obj形式で1つの歯をエクスポートし、threejsに付属のコンバーターを使用してそれをjsonに変換しました。画像はページに表示されますが、テクスチャは適用されていません。私は3dsMaxとThreejsを初めて使用しますが、何が欠けているのかわかりません。案内していただけませんか。

編集： これがJsonメタデータです

"metadata" :
{
    "formatVersion" : 3.1,
    "sourceFile"    : "toothz.obj",
    "generatedBy"   : "OBJConverter",
    "vertices"      : 1636,
    "faces"         : 1634,
    "normals"       : 1636,
    "colors"        : 0,
    "uvs"           : 1636,
    "materials"     : 1
},

"scale" : 1.000000,

"materials": [  {
"DbgColor" : 15658734,
"DbgIndex" : 0,
"DbgName" : "Teeth",
"colorAmbient" : [0.584314, 0.584314, 0.584314],
"colorDiffuse" : [0.584314, 0.584314, 0.584314],
"colorSpecular" : [0.538824, 0.538824, 0.538824],
"illumination" : 2,
"opticalDensity" : 1.5,
"specularCoef" : 70.0,
"transparency" : 1.0
}],

編集： これが完全なコードです

var scene = new THREE.Scene();

var camera = new THREE.PerspectiveCamera(75, window.innerWidth/window.innerHeight, 1, 2000);

loader = new THREE.JSONLoader();
loader.load( "js/JsonModels/toothz.js", function( geometry, materials ) {
    materials[0].shading = THREE.SmoothShading;
    var material = new THREE.MeshFaceMaterial( materials );
    mesh = new THREE.Mesh( geometry, material );
    mesh.scale.set( 3, 3, 3 );
    mesh.position.y = 0;
    mesh.position.x = 0;
    scene.add( mesh );
} );

camera.position.z = 340;

//var ambient = new THREE.AmbientLight( 0x101030 );
//scene.add( ambient );

var directionalLight = new THREE.DirectionalLight( 0xffeedd );
directionalLight.position.set( 0, 0, 1 ).normalize();
scene.add( directionalLight );

var renderer = new THREE.WebGLRenderer();

renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);

function render() {
     requestAnimationFrame(render);
    renderer.render(scene, camera); 
} 
render();
4

2 に答える 2

3

three.jsMigrationwikiを参照してください。

Geometryにはマテリアルプロパティがなくなり、以前はgeometryパラメータしかなかったローダーコールバックにも、2番目のコールバックが渡されるようになりましたmaterials。

編集：あなたはこのようなことをする必要があります：

loader = new THREE.JSONLoader();
loader.load( "js/JsonModels/toothz.js", function( geometry, materials ) {
    materials[0].shading = THREE.SmoothShading;
    var material = new THREE.MeshFaceMaterial( materials );
    mesh = new THREE.Mesh( geometry, material );
    mesh.scale.set( 3, 3, 3 );
    mesh.position.y = 0;
    mesh.position.x = 0;
    scene.add( mesh );
} );

three.js r.53

于 2012-12-19T15:38:34.547 に答える
3

テクスチャのエクスポートは、3Dプログラムマテリアルとthree.jsマテリアルの間に常に明確なマッピングがあるとは限らないため、多くのエクスポータでは通常注意が必要です。さらに、.objファイルにはマテリアルがまったく定義されていませんが、別の.mtlが必要です。a）.mtlがエクスポートされ、b）objコンバーターがそれを使用するかどうかはわかりませんが、いずれの場合も、JSONにマテリアルのテクスチャ定義がありません。いくつかの選択肢があります。

  1. MAXエクスポーターを試してみてください。これにより、中間の.objステップを使用せずに、JSONに直接エクスポートできるようになります。
  2. OBJルートでは、エクスポーターの関連するすべてのオプションがチェックされ、.mtlファイルが生成され、objコンバーターがそれを検出することを確認する必要があります。
  3. または、テクスチャを手動でJSONに追加します:(ファイルのセクションの"mapDiffuse": "my_texture_filename.jpg"マテリアル定義に）。"materials"
  4. モデル読み込みコールバックのマテリアルにテクスチャを追加することもできます。ただし、これは大きなハックであり、お勧めしません。
于 2012-12-20T12:04:50.500 に答える