无法加载 JSON 模型答案

【问题标题】：Cannot load JSON model无法加载 JSON 模型
【发布时间】：2013-10-16 13:28:36
【问题描述】：

我正在尝试加载 JSON 模型并将其显示在画布上。但是屏幕上没有绘制任何内容。我试图在loader.load 回调中放置一个警报，但从未显示警报：从未调用回调。我想知道JSON文件是否有问题，我从这里下载了它：https://livingvindonissa.googlecode.com/svn-history/r42/trunk/livingvindonissa/src/model/test/Teapot.json

这是代码：

<head>
        <title> Teapot </title>
        <style> 
            canvas {width:100%; height:100%; background-color: black} 
            body {background-color: white};
        </style>
    </head>
    <body>
        <h1 align="center"> Teapot </h1>
        <script src="/Users/ramy/Documents/HTML/mrdoob-three.js-58e4622/build/three.min.js"></script>
        <script type="text/javascript">
            // Scene initialization
            var scene= new THREE.Scene();
            var camera= new THREE.PerspectiveCamera(75,window.innerWidth/window.innerHeight,0.1,1000);
            var renderer= new THREE.WebGLRenderer();
            renderer.setSize(window.innerWidth,window.innerHeight);
            document.body.appendChild(renderer.domElement);
            camera.position.z= 50;

            // Teapot creation
            var teapot;
            var loader= new THREE.JSONLoader();
            loader.load("/Users/ramy/Documents/HTML/teapot.json", 
                function(geometry) {
                    var material= new THREE.MeshBasicMaterial({color:0x00ff00});
                    teapot= new THREE.Mesh(geometry,material);
                    scene.add(teapot);
                    render();
                });

            // Rendering
            var render= function() {
                requestAnimationFrame(render);
                renderer.render(scene,camera);
            }
        </script>
    </body>
</html>

【问题讨论】：

是否打算使用本地路径链接three.js？
也使用对我有用的完整路径。

标签： javascript three.js

【解决方案1】：

您使用的模型格式似乎与通过 Three.js plugin 或 Python script converter 从 Blender 导出的模型格式不同块：

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

你的文件也有

"vertexPositions"
"vertexNormals"
"vertexTextureCoords"
"indices"

代替

"vertices"
"normals" 
"uvs"
"faces"

我怀疑该文件是以通用 Model to JSON 格式生成的，而不是 Three.js JSON 格式。您能确认一下您使用的出口商吗？

编辑：澄清一下，这个问题的答案是使用的 JSON 格式与 Three.js JSONLoader 不兼容。您需要找到原始文件，并使用上述方法进行转换，或者手动转换您必须符合 Three.js JSON 格式的 JSON 文件。

【讨论】：

我真的没有使用任何导出器，我在网上找到了文件。
我已经在上面编辑了我的回复，唉，如果您不承担一些繁重的工作，您拥有的 JSON 文件将无法与 Three.js 一起使用。