Question

我正在使用three.js生成3D模型，并使用THREE.GLTFExporter将其导出为GLB或GLTF。目标是使用Google AR使它在我们的网站上可见。

https://kaboomlaser.com/pages/ar-test（链接到文件）

当我在https://sandbox.babylonjs.com/或其他GLTF / glb查看器中查看模型时，该模型看起来非常完美。

查看此处：https://gltf-viewer.donmccurdy.com/#model=https://cdn.shopify.com/s/files/1/0290/5459/9273/files/test.glb

但是当我在Google AR场景预览器https://vr.google.com/scene-viewer-preview中打开它时，它最终是空的。我尝试过的其他模型确实出现在场景预览器中，但网格却既尖锐又怪异。

下面我用一个简单的模型重现该问题的代码。（这将在上面的链接中输出模型）。

我想念什么？

var x = 0, y = 0;
    var heartShape = new THREE.Shape();
    heartShape.moveTo(x + 5, y + 5);
    heartShape.bezierCurveTo(x + 5, y + 5, x + 4, y, x, y);
    heartShape.bezierCurveTo(x - 6, y, x - 6, y + 7, x - 6, y + 7);
    heartShape.bezierCurveTo(x - 6, y + 11, x - 3, y + 15.4, x + 5, y + 19);
    heartShape.bezierCurveTo(x + 12, y + 15.4, x + 16, y + 11, x + 16, y + 7);
    heartShape.bezierCurveTo(x + 16, y + 7, x + 16, y, x + 10, y);
    heartShape.bezierCurveTo(x + 7, y, x + 5, y + 5, x + 5, y + 5);

    var geometry = new THREE.ExtrudeBufferGeometry(heartShape, {
        depth: 4, bevelEnabled: false,
        bevelThickness: 0.4,
        bevelSize: 0.4,
        steps: 2,
        BevelSegments: 2,
        curveSegments: 10
    });

    var material = new THREE.MeshLambertMaterial({ color: 0xa00A0A });
    var mesh = new THREE.Mesh(geometry, material);

    var scene = new THREE.Scene();
    scene.add(mesh);

    const options = {
        binary: true,
        forceIndices: true
    };

    var exporter = new GLTFExporter();

    exporter.parse(scene, function (data) {
        if (options.binary) {
            savetoFile(data, 'test.glb', 'model/gltf-binary');
        }
        else {
            savetoFile(JSON.stringify(data), 'test.gltf', 'text/plain');
        }
    },
    options);

Answer 1

我从Poly获得的某些模型也遇到了同样的问题。尝试在Blender中导入模型并再次导出。我尝试了您的模型，效果很好

GLB / GLTF模型在Google AR中无法正确显示，但在其他查看器中未显示任何错误

1 个答案: