2013-08-26 5 views
0

Итак, я взял класс в Three.js, чтобы узнать, что я не получил образование в том, как загружать модели. Я нашел модель на Turbosquid.com <http://storage2.turbosquid.com/Download/index.php?ID=717563_8377529> и успешно преобразовал ее в JSON, используя convert_obj_three.py.JSONLoader не отображает модель

Я занимаюсь серфингом для хорошего кода и нашел несколько достойных примеров в stackoverflow, но по какой-то причине, когда я запускаю его в chrome, у меня нет модели.

<html> 
<head></head> 

<body> 

    <script src="http://threejs.org/build/three.js"></script> 
    <script> 

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

     var geometry; 

     var renderer = new THREE.WebGLRenderer(); 
     renderer.setSize(window.innerWidth, window.innerHeight); 
     document.body.appendChild(renderer.domElement); 

     var material = new THREE.MeshBasicMaterial({color: 0x00ff00}); 

     loader = new THREE.JSONLoader(); 

     loader.load("LeePerrySmith.js", function(geometry) { 

      mesh = new THREE.Mesh(geometry, new THREE.MeshBasicMaterial()); 
      mesh.scale.set(10, 10, 10); 
      mesh.position.y = 0; 
      mesh.position.x = 0; 
      mesh.scale.set(100, 100, 100); 
      scene.add(mesh); 
      mesh.side = THREE.DoubleSide; 
      alert("hit"); 

      }); 


     camera.position.z = 5; 

     var render = function() { 
      renderer.render(scene, camera); 
     }; 

     render(); 

    </script> 
</body> 

Я храню как файл HTML и файл e100.js модели в том же каталоге. Есть ли какие-то пути, о которых я не знаю?

ответ

1

хорошо я проверил ваш код здесь с простым кубом, который я экспортировал как файл js, и он отлично работает. Первоначально я подозреваю 3 вещи:

1) Возможно, сетка супер крошечная, и вы не можете ее увидеть, попробуйте mesh.scale.set(100, 100, 100); посмотреть, не изменилось ли это что-либо. ИЛИ уменьшите положение вашей камеры в положении «немного».

2) Путь выглядит отлично, вы можете использовать относительный путь, например, «./e100.js», если хотите быть уверенным, но это действительно не обязательно.

3) Возможно, сетка имеет перевернутые нормали или какой-либо другой недостаток. Только для тестирования вы могли бы попробовать установить вашу сетку, чтобы сделать текстуру с обеих сторон, чтобы увидеть, если это вопрос, как так:

mesh.side = THREE.DoubleSide; 

ИЛИ вы могли бы попробовать более элементарное материал как MeshBasicMaterial вместо или вашей обычной версии и посмотреть, поможет ли это.

Держите консоль открытой во время загрузки модели, ищите любые ошибки, как это происходит. Если ничего из этого не получится, я бы заподозрил модель, но сейчас это прыгает с пистолета.

Удачной охоты,

Edit: cube.js

{ 
"metadata" : 
{ 
"formatVersion" : 3.1, 
"generatedBy" : "Blender 2.66 Exporter", 
"vertices" : 8, 
"faces" : 6, 
"normals" : 8, 
"colors" : 0, 
"uvs" : [24], 
"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, 
     "mapDiffuse" : "cube.png", 
     "mapDiffuseWrap" : ["repeat", "repeat"], 
     "shading" : "Phong", 
     "specularCoef" : 50, 
     "transparency" : 1.0, 
     "transparent" : false, 
     "vertexColors" : false 
    }], 
"vertices" : [1,-1,-1,1,-1,1,-1,-1,1,-1,-1,-1,1,1,-1,0.999999,1,1,-1,1,1,-1,1,-1], 
"morphTargets" : [], 
"normals" : [0.577349,-0.577349,-0.577349,0.577349,-0.577349,0.577349,-0.577349,-0.577349,0.577349,-0.577349,-0.577349,-0.577349,0.577349,0.577349,-0.577349,-0.577349,0.577349,-0.577349,-0.577349,0.577349,0.577349,0.577349,0.577349,0.577349], 
"colors" : [], 
"uvs" : [[0.33408,0.333114,0.334191,0.659296,0.009852,0.659305,0.009721,0.333137,0.991035,0.334072,0.663423,0.334025,0.663036,0.005624,0.991002,0.005943,0.991246,0.333487,0.991261,0.6585,0.663173,0.658447,0.662825,0.334005,0.662568,0.33421,0.662689,0.65851,0.335127,0.658476,0.335112,0.333952,0.335825,0.007042,0.335835,0.333228,0.008133,0.333306,0.008138,0.006861,0.335761,0.333299,0.335071,0.005883,0.663081,0.006277,0.663095,0.333865]], 
"faces" : [43,0,1,2,3,0,0,1,2,3,0,1,2,3,43,4,7,6,5,0,4,5,6,7,4,5,6,7,43,0,4,5,1,0,8,9,10,11,0,4,7,1,43,1,5,6,2,0,12,13,14,15,1,7,6,2,43,2,6,7,3,0,16,17,18,19,2,6,5,3,43,4,0,3,7,0,20,21,22,23,4,0,3,5], 
"bones" : [], 
"skinIndices" : [], 
"skinWeights" : [], 
"animation" : {} 
} 
+0

Ну я попробовал все четыре предложения, и я до сих пор не имеют ни малейшего представления, что это неправильно. Я работаю над кодом в Notepad ++, и все, что я могу идентифицировать, - это то, что GET выдает ошибку в моем вызове 'src =" three.min.js "и что впоследствии THREE не определяется. Должен ли я использовать .prototype? – gustable

+0

Так что мне удалось получить код для запуска без ограничений в консоли, но все же, никакого результата. – gustable

+0

К сожалению, вы пробовали другой файл модели? Я отредактирую свой ответ на наличие простого содержимого файла cube.js, возможно, файл модели является виновником? –

Смежные вопросы