如何从 xeogl 场景中获取 Gltf 数据？

Question

在 React Web 应用程序的 3D 查看器中单击网格时，我试图获取特定的 Gltf 数据，例如网格名称（如 .gltf 文件中所写）。对于查看器，我使用来自 xeolabs 的Xeogl，它能够在 html-canvas 元素中显示 gltf 文件。但是，我能够从界面中提取的唯一数据是来自 Xeogl 参数的数据（例如，场景、材质、儿童……参见图 2）。

我似乎无法获取 .gltf 文件本身中的任何元数据。

有人知道 gltf 数据如何集成到 Xeogl 模型中，或者我如何在单击网格时从 .gltf 文件中找到相应的 gltf 数据？ 提前致谢！

图 1： 点击事件

图 2： 我们从带有 xeogl 数据的事件中得到的结果（左），我们希望从 .gltf 文件中得到的结果（右）

Answer 1

您需要在加载 gltf 模型期间定义一个 handleNode 回调。请参阅：http://xeogl.org/docs/classes/GLTFModel.html 并查找 handleNode 函数。

在该回调中，您可以定义一个actions.createObject 对象。您在此处定义的任何参数都将合并到 xeogl 的最终网格对象中，然后您可以稍后使用默认的 xeogl 工具访问该参数。

比如我在加载gltf模型的时候有这段代码：

handleNode: (function () {
                let objectCount = 0
                return function (nodeInfo, actions) {
                  if (nodeInfo.mesh !== undefined) {
                    // Node has a mesh
                    actions.createObject = {
                      id: model.commit.hash + '.' + objectCount++,
                      guid: nodeInfo.name,
                      entityType: 'ifc'
                    }
                  }
                  return true
                }
              })()

查看entityType 属性。我用固定值填充它，但它也可以是来自 gltf 节点的动态信息。它成为 xeogl 对象的一部分，因此我可以稍后访问它。