Three.js，我似乎無法看到對象

我正在尋找在Blender 2.69的導出輸出中使用three.js在瀏覽器上顯示對象。我可以重新導入內容並確認它正在工作，並將導出的結果作爲json.js.Three.js，我似乎無法看到對象

頁面加載成功，沒有在螢火蟲JS錯誤，但一個對象不顯示。我正在嘗試基於示例進行調試 - 我沒有發現一個明顯的問題，因爲所有的部分似乎都已到位。

我明白這是很多需要經歷但我會喜歡一些建議。

init.js

// LAUNCHER 

$(document).ready(function(){ 

init(); 

}); 

// GLOBALS 

var loader, scene, renderer, camera, material, mesh; 
var sceneWidth = $(window).width(); 
var sceneHeight = $(window).height(); 

function init(){ 

// LOADER 
loader = new THREE.JSONLoader(true); 
loader.load("/javascript/json.js", function(geometry){ 

    // RENDERER 
    renderer = new THREE.WebGLRenderer({antialias:true}); 
    renderer.setSize(sceneWidth, sceneHeight); 
    renderer.setClearColor(0x000000, 1); 
    $('#container').append(renderer.domElement); 

    // SCENE 
    scene = new THREE.Scene(); 

    // CAMERA 
    camera = new THREE.PerspectiveCamera(35, sceneWidth/sceneHeight, 1, 20000); 
    camera.position.set(1.241,3.452,-0.444); 
    camera.lookAt(scene.position); 

    // MATERIAL 
    material = new THREE.MeshLambertMaterial({color: 0xffffff}); 

    // MESH 
    mesh = new THREE.Mesh(geometry, material); 
    scene.add(mesh); 

    // LIGHT 
    // point light 
    var pointLight = new THREE.PointLight(0xffffff, 200, 210); 
    pointLight.position.set(-100,200,100); 
    scene.add(pointLight); 
    // ambient 
    var ambientLight = new THREE.AmbientLight(0x404040); 
    scene.add(ambientLight); 

    animate(); 

    console.log(); 

}); 

} 

// ANIMATE 

function animate(){ 

// Get Frame, Repeat 
requestAnimationFrame(animate); 

// Render 
renderer.render(scene, camera); 

}

json.js

{ 

"metadata" : 
{ 
    "formatVersion" : 3.1, 
    "generatedBy" : "Blender 2.65 Exporter", 
    "vertices"  : 8, 
    "faces"   : 6, 
    "normals"  : 8, 
    "colors"  : 0, 
    "uvs"   : [], 
    "materials"  : 1, 
    "morphTargets" : 0, 
    "bones"   : 0 
}, 

"scale" : 1.000000, 

"materials" : [ { 
    "DbgColor" : 15658734, 
    "DbgIndex" : 0, 
    "DbgName" : "Material", 
    "blending" : "NormalBlending", 
    "colorAmbient" : [0.6400000190734865, 0.6400000190734865, 0.6400000190734865], 
    "colorDiffuse" : [0.6400000190734865, 0.6400000190734865, 0.6400000190734865], 
    "colorSpecular" : [0.5, 0.5, 0.5], 
    "depthTest" : true, 
    "depthWrite" : true, 
    "shading" : "Lambert", 
    "specularCoef" : 50, 
    "transparency" : 1.0, 
    "transparent" : false, 
    "vertexColors" : false 
}], 

"vertices" : [5.76722,-0.488412,-3.17431,5.04979,-0.387833,-1.31012,3.43733,0.585297,-1.98318,4.15476,0.484717,-3.84736,6.70811,1.25598,-2.90632,5.99068,1.35656,-1.04214,4.37822,2.32969,-1.7152,5.09566,2.22911,-3.57938], 

"morphTargets" : [], 

"normals" : [0.400952,-0.813501,-0.421186,-0.013215,-0.755425,0.655049,-0.944182,-0.193579,0.266457,-0.529954,-0.251656,-0.809778,0.944182,0.193579,-0.266457,0.013215,0.755425,-0.655049,-0.400952,0.813501,0.421186,0.529954,0.251656,0.809778], 

"colors" : [], 

"uvs" : [], 

"faces" : [35,0,1,2,3,0,0,1,2,3,35,4,7,6,5,0,4,5,6,7,35,0,4,5,1,0,0,4,7,1,35,1,5,6,2,0,1,7,6,2,35,2,6,7,3,0,2,6,5,3,35,4,0,3,7,0,4,0,3,5], 

"bones" : [], 

"skinIndices" : [], 

"skinWeights" : [], 

"animations" : [] 


}

來源

2014-02-11 user3010587

我建議你從最簡單的場景開始。像單個立方體或球體一樣，一個燈光，沒有紋理。如果那樣的話，那麼開始添加東西。對不起，這不是一個直接的答案。如果我得到類似的結果，我會如何處理它。 – gman

我只想添加一點關於我的工作流程。我是WebGL/Three.js的新手，我的第一本能就是保持簡單，就像你所說的那樣。我打開blender，使用默認的立方體網格，使用關鍵幀製作一個簡單的動畫，然後使用three.js util exporter導出。結果是，我可以看到背景顏色已改變/頁面加載沒有錯誤，但我看不到立方體/照明。我的猜測是，我沒有正確安排項目，並且發送到渲染的對象被錯過或者相機處於錯誤的位置來查看對象。 – user3010587

的問題是純粹與攝像機角度，以下證明了這。

camera.position.set（0,100,0）; camera.lookAt（scene.position）;

本質上提高相機和瞄準現場。

我爲此浪費大家的時間表示歉意。

來源

2014-02-11 17:35:17 user3010587

Three.js，我似乎無法看到對象

回答

相關問題