javascript 从 Three.js 编辑器导出场景并导入
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/22770124/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Export scene from Three.js editor and import
提问by user3482129
I make a simple scene using the editor of three.js working in local. When i'm finished the scene i will go to "file" -> "export scene" and the editor generate JSON Object/Scene. Now i will copy and paste this code and save like a .js? How i can import this scene in my project preserving the textures?
我使用在本地工作的three.js 的编辑器制作了一个简单的场景。完成场景后,我将转到“文件”->“导出场景”,编辑器生成 JSON 对象/场景。现在我将复制并粘贴此代码并像 .js 一样保存?我如何在我的项目中导入这个场景以保留纹理?
Thanks !
谢谢 !
回答by MTGradwell
Develotecca's answer shows how to load a basic THREE.geometry from a JSON file. However, in my experience, the geometries exported by the three.js editor are of type BufferGeometry (which is more efficient than a basic Geometry) so they need to be loaded using a THREE.BufferGeometryLoader rather than a THREE.JSONLoader.
Develotecca 的回答显示了如何从 JSON 文件加载基本的 THREE.geometry。但是,根据我的经验,three.js 编辑器导出的几何图形属于 BufferGeometry 类型(比基本几何图形更有效),因此需要使用 THREE.BufferGeometryLoader 而不是 THREE.JSONLoader 加载它们。
Also, the question is about saving and loading scenes, not geometries. JSONLoader is designed only to load basic geometries, and a geometry contains only a single model's per-vertex and per-face information (which includes material numbers for indexing into a MeshfaceMatrial, but no other material information, and so it needs to be combined with a material before use). If you try to load an entire scene using JSONLoader, instead of just a part of one object in the scene, the loader should spot this and deliver the message
此外,问题是关于保存和加载场景,而不是几何图形。JSONLoader 仅用于加载基本几何体,几何体仅包含单个模型的每顶点和每面信息(包括用于索引到 MeshfaceMatrial 的材料编号,但没有其他材料信息,因此需要结合使用前的材料)。如果您尝试使用 JSONLoader 加载整个场景,而不仅仅是场景中一个对象的一部分,加载器应该发现这一点并传递消息
THREE.JSONLoader: seems to be a Scene. Use THREE.SceneLoader instead.'
THREE.JSONLoader:似乎是一个场景。使用 THREE.SceneLoader 代替。
to the console log. This gives a big clue to the proper way to proceed.
到控制台日志。这为正确的处理方式提供了重要线索。
The scene loader is documented at http://threejs.org/docs/#Reference/Loaders/SceneLoader(though the documentation is currently incomplete), and its source code is at https://github.com/mrdoob/three.js/blob/master/src/loaders/SceneLoader.jsand an example of its use is at http://threejs.org/examples/webgl_loader_scene.html
场景加载器记录在http://threejs.org/docs/#Reference/Loaders/SceneLoader(尽管文档目前不完整),其源代码位于https://github.com/mrdoob/three.js /blob/master/src/loaders/SceneLoader.js及其使用示例位于http://threejs.org/examples/webgl_loader_scene.html
All of that is a lot to wade through. I haven't actually used SceneLoader myself yet, though I intend to soon, but from what I've read so far it looks similar to BufferGeometryLoader or JSONLoader except because you're loading a whole scene instead of just part of one you have
所有这一切都需要经历很多。我自己还没有真正使用过 SceneLoader,尽管我打算很快使用,但从我目前所读到的内容来看,它看起来类似于 BufferGeometryLoader 或 JSONLoader,只是因为您正在加载整个场景而不是您拥有的场景的一部分
scene = loaded.scene
rather than
而不是
scene.add()
and you may need to include other loaders and handlers for any specialized geometries that your scene uses, e.g.
并且您可能需要为您的场景使用的任何特殊几何图形包含其他加载器和处理程序,例如
<script src="js/loaders/ColladaLoader.js"></script>
..
loader.addHierarchyHandler( "dae", THREE.ColladaLoader );
for Collada.
对于科拉达。
回答by Develoteca
Load JSON data with:
加载 JSON 数据:
var jsonLoader = new THREE.JSONLoader();
jsonLoader.load("models/object.json", addModelToScene);
function addModelToScene(geometry, materials) {
var material = new THREE.MeshFaceMaterial(materials);
var object = new THREE.Mesh(geometry, material);
object.scale.set(10, 10, 10);
scene.add(object);
}
Example: http://stemkoski.github.io/Three.js/Model.html
示例:http: //stemkoski.github.io/Three.js/Model.html
Other example: http://all.develoteca.com/builder/