Question

所以我参加了Three.js课程，结果发现我没有接受过如何加载模型的教育。我在Turbosquid.com <http://storage2.turbosquid.com/Download/index.php?ID=717563_8377529>上找到了一个模型，并使用convert_obj_three.py成功将其转换为JSON。

我已经浏览了很好的代码并在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模型文件存储在同一目录中。是否有一些我不知道的路径？

Answer 1

我已经在这里使用一个简单的多维数据集测试了你的代码我导出为js文件，它工作正常。最初我怀疑有三件事：

1）也许网格非常微小，你无法看到它，尝试mesh.scale.set( 100, 100, 100 );看看是否有任何变化。或将相机的z位置缩小到“稍微移入”。

2）路径看起来很好，你可以使用像“./e100.js”这样的相对路径，如果你想要更加确定，但它确实没有必要。

3）也许网格具有倒置的法线或其他一些缺陷。只是为了测试你可以尝试设置你的网格来渲染两边的纹理，看看是否是这样的问题：

mesh.side = THREE.DoubleSide;

或您可以尝试使用MeshBasicMaterial替换或普通版本等更基本的材料，看看是否有帮助。

在模型加载时保持控制台打开，查找任何错误。如果这一切都不起作用，我会怀疑这个模型，但此时此刻正在跳枪。

快乐狩猎，

编辑：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" : {}
}

JSONLoader不显示模型

1 个答案: