首先，我已经读过this question没有帮助
我是如何做的:首先我将模型从 C4D 导出到 .ojb。然后我将 obj 导入 www.trheejs/editor
我填满了所有的空白
然后从树中选择我的对象并将其导出到 Threejs 对象，它保存一个 .json 文件
我的代码
<script>
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);
var kiss = new THREE.Object3D(), loader = new THREE.JSONLoader(true);
loader.load( "brikk2.json", function ( geometry, materials ) {
var mesh = new THREE.Mesh( geometry, new THREE.MeshPhongMaterial( { color: 0xff0000, ambient: 0xff0000 } ) );
scene.add( mesh );
});
var render = function () {
requestAnimationFrame(render);
renderer.render(scene, camera);
};
render();
</script>
当我运行时，我收到这些错误消息
THREE.WebGLRenderer 67 three.js:20806
THREE.WebGLRenderer: elementindex as unsigned integer not supported. three.js:26942
XHR finished loading: "http://xxxxxx.xx/tst/mrdoob-three2/brikk2.json". three.js:12018
THREE.JSONLoader.loadAjaxJSON three.js:12018
THREE.JSONLoader.load three.js:11942
load test.html:23
(anonymous function) test.html:28
Uncaught TypeError: Cannot read property 'length' of undefined three.js:12087
parseModel three.js:12087
THREE.JSONLoader.parse three.js:12028
xhr.onreadystatechange three.js:11969
我加载的 Json
{
"metadata": {
"version": 4.3,
"type": "Object",
"generator": "ObjectExporter"
},
"geometries": [
{
"uuid": "213E28EF-E388-46FE-AED3-54695667E086",
"name": "brikkG",
"type": "Geometry",
"data": {
"vertices": [0.036304,-0.016031,-0.027174,0.036304,0.......
........ 232,1228,1139,1141,1140,1]
}
}],
"materials": [
{
"uuid": "F74C77E4-8371-41BC-85CA-31FC96916CC6",
"name": "lego",
"type": "MeshPhongMaterial",
"color": 16721408,
"ambient": 16777215,
"emissive": 0,
"specular": 16777215,
"shininess": 30,
"opacity": 1,
"transparent": false,
"wireframe": false
}],
"object": {
"uuid": "3BAAB8CA-1EB7-464A-8C6D-FC4BBB3C63C6",
"name": "BrikkM",
"type": "Mesh",
"geometry": "213E28EF-E388-46FE-AED3-54695667E086",
"material": "F74C77E4-8371-41BC-85CA-31FC96916CC6",
"matrix": [1000,0,0,0,0,1000,0,0,0,0,1000,0,0,0,0,1]
}
}
json文件的结构
基本上我已经尝试了所有我读过的关于将 native json导入ThreeJS的内容，我尝试了来自treejs/editor或clara.io的文件仍然有相同的错误消息，我不再知道了，我花了3天尝试了所有我阅读的方式来解决这个问题。
如果我尝试创建像 CubeGeometry 这样的几何图形，它会毫无问题地渲染，但是当我尝试使用 native json 时，就不再起作用了
有人可以帮忙吗？
最佳答案
好的，我在这里找到了答案:http://helloenjoy.com/2013/from-unity-to-three-js/
原生 json 代码是完美的，只是用 JSONLoader 加载而不是用 ObjectLoader 加载(不要像我的实验之一那样与 OBJLoader 不匹配)。 JSONLoader 的意思是加载 json，但具有不同的格式/结构。 ObjectLoader 的意思是加载 native 格式，该格式也是用 json 编写的，但具有 native 结构/格式。
所以使用
var loader = new THREE.ObjectLoader();
loader.load( 'brikk2.json', function ( object ) {
scene.add( object );
} );
并且它正在工作
完整的示例代码
<body>
<script src="build/three.min.js"></script>
<script>
var scene = new THREE.Scene();
var camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 1000 );
var renderer = new THREE.WebGLRenderer();
renderer.setClearColor( 0xffffff, 1);
renderer.setSize( window.innerWidth, window.innerHeight );
document.body.appendChild( renderer.domElement );
var ambient = new THREE.AmbientLight( 0x101030 );
scene.add( ambient );
var directionalLight = new THREE.DirectionalLight( 0xffeedd );
directionalLight.position.set( 0, 0, 1 );
scene.add( directionalLight );
var loader = new THREE.ObjectLoader();
loader.load( 'brikk2.js', function ( object ) {
scene.add( object );
} );
camera.position.z = 5;
var render = function () {
requestAnimationFrame(render);
renderer.render(scene, camera);
};
render();
</script>
</body>
编辑
我在最重要的问题中显示的最上面的代码是正确的，但它是用于几何加载的
loader = new THREE.JSONLoader();
loader.load( 'ugeometry.json', function ( geometry ) {
mesh = new THREE.Mesh( geometry, new THREE.MeshBasicMaterial( { envMap: THREE.ImageUtils.loadTexture( 'environment.jpg', new THREE.SphericalReflectionMapping() ), overdraw: 0.5 } ) );
scene.add( mesh );
所以回顾一下。
如果从 Threes/editor 或 Clara.io 保存 GEOMETRY，则使用 JSONLoader，如果保存为 OBJECT，则使用 ObjectLoader，如果保存为 SCENE，则它们应该是 SceneLoader(未验证)
关于javascript - ThreeJS无法加载Json文件，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/23855693/