三.js - 将带有文本几何的场景导出到 OBJ/GLTF，然后由 OBJ/GLTF 加载器加载

Question

我在三个中的导入/导出场景时遇到问题.js我有几个对象(用 OBJLoader 加载的模型，用文本几何生成的文本(。我能够使用 OBjExporter/GLTFExporter 将其导出到字符串定义，但是当我尝试再次加载它时，它会将文本加载到 BufferGeometry 而不是 TextGeometry。是否可以使用适当的几何体加载所有场景网格体？或者也许可以解析几何图形？我知道我可以保存没有文本的场景(以不同的定义存储文本参数然后再次生成它(，但我想避免它。我期待着你的帮助。谢谢。

代码示例：
1.将场景导出到OBJ的功能

function CanvasToOBJ(callback) {
var exporter = new THREE.OBJExporter();
var options = {
    trs: false,
    onlyVisible: true,
    truncateDrawRange: true,
    binary: false,
    forceIndices: false,
    forcePowerOfTwoTextures: false,
    embedImages: true
};
var result = exporter.parse(scene);
callback(result);
exporter.parse(scene, function (result) {
    if (result instanceof ArrayBuffer) {
        callback(null);
    } else {
        var output = JSON.stringify(result, null, 2);
        callback(output);
    }
}, options);
}

2. 从 OBJ 字符串导入的函数

function LoadOBJ() {
    var elem = document.getElementById("modelEditor");
    if (elem != null && elem !== "undefined" && elem.value !== "undefined" && elem.value != null && elem.value != "") {
        var gltfString = elem.value;
        var loader = new THREE.OBJLoader();
        loader.load = function load(url, localtext, onLoad, onProgress, onError) {
            var scope = this;
            var loader = new THREE.XHRLoader(scope.manager);
            loader.setPath(this.path);
            loader.load(url, function (text) {
                if (url == "") {
                    text = localtext;
                }
                onLoad(scope.parse(text));
            }, onProgress, onError);
        },
            loader.load('', gltfString, function (gltf) {
                scene = new THREE.Scene();
                scene.background = new THREE.Color(0xf0f0f0);
                scene.add(new THREE.AmbientLight(0x505050));
                var light = new THREE.SpotLight(0xffffff, 1.5);
                light.position.set(0, 500, 2000);
                light.angle = Math.PI / 9;
                light.castShadow = true;
                light.shadow.camera.near = 1000;
                light.shadow.camera.far = 4000;
                light.shadow.mapSize.width = 1024;
                light.shadow.mapSize.height = 1024;
                scene.add(light);
                var elem = gltf.children[0];
                scene.add(elem);
                objects.push(elem);
                renderer.setSize(renderer.domElement.width, renderer.domElement.height, false);
            })
    }
}

Answer 1

答：不可以。 .obj 和 .gltf 都不支持普通缓冲区几何以外的任何东西。

如果你想保持所有内容的原始格式，例如由半径和细分数量定义的球体，而不仅仅是一堆三角形，你需要使用三.js的自定义格式.json格式，由三.js编辑器使用，AFAICT没有记录。

不幸的是，即使它不支持任何几何格式，只支持BufferGeometry格式，如SphereBufferGeometry，但它目前也不支持TextBufferGeometry，尽管您可以尝试添加支持。

https://github.com/mrdoob/three.js/blob/513eceb0fedfd05089168bde81c5bb85ba0e6ec1/src/loaders/ObjectLoader.js#L200

您需要处理的一个问题是加载和保存对字体的引用。