Question

我将房屋模型导入为.gltf。从这个房子，我想检索楼层对象并将其转换为自己的一个框架实体，以便我可以在以后引用它。我需要引用它以告诉aframe-teleport-controls组件它应该使用该层作为 collisionEntity 。

这是我到目前为止所做的：

AFRAME.registerComponent('floor-test', {
    schema: {
        floorname: {type: 'string', default: "floor"},
    },
    init: function () {
        this.el.addEventListener("model-loaded", (e) => {
            let child = this.el.object3D.getObjectByName(this.data.floorname, true);

            let floor = document.createElement("a-entity");
            floor.setObject3D("Object3D", child)
            floor.setAttribute("id", "floor")
            this.el.appendChild(floor)
        })
    }
});

这是aframe-teleport-controls实体：

<a-mixin id="teleport" teleport-controls="type: parabolic; cameraRig: #cameraRig; collisionEntities: #floor "></a-mixin>

正在创建对象（尚未处于正确的位置），但是远程端口控件不会将其识别为碰撞实体。

如何将3D模型中的楼层设置为碰撞实体？

修改

Chaning floor.setObject3D("Object3D", child)到floor.setObject3D("mesh", child)解决了传送冲突实体的问题。

但是正在创建的楼层对象没有正确的旋转。

我在a-frame docs中尝试了entityEl.object3D.getWorldRotation();函数，但它返回＆＃34; 0 0 0＆＃34;而不是＆＃34; 0 180 0＆＃34;。

我也尝试使用THREE.SceneUtils.detach(child, parent, scene);，但子对象没有显示在场景中。

这是当前的代码

AFRAME.registerComponent('floor-test', {
    schema: {
        floorname: {type: 'string', default: "floor"},
    },
    init: function () {
        this.el.addEventListener("model-loaded", (e)=> {
            let parent = this.el.object3D;
            let child = parent.getObjectByName(this.data.floorname, true);

            let floor = document.createElement("a-entity");
            floor.setObject3D("mesh", child)
            floor.setAttribute("id", "floor")
            floor.setAttribute("rotation", child.getWorldRotation())

            this.el.appendChild(floor)
        })
    }
});

Answer 1

我认为时机存在问题。当teleport-controls附加到teleport mixin时，#floor不存在。由于我在documentation中没有看到任何“刷新”方法，我可以想到两种处理方法：

1）如果世界是非程序性的，请在地板应添加一个不可见的框，并将其设为#floor。

2）更合理一点，尝试在模型加载时添加teleport-controls：

this.el.addEventListener("model-loaded", (e) => {
        let child = this.el.object3D.getObjectByName(this.data.floorname, true);

        let floor = document.createElement("a-entity");
        floor.setObject3D("Object3D", child)
        floor.setAttribute("id", "floor")
        this.el.appendChild(floor)
        let teleportEntity = document.querySelector("#teleport");
        teleportEntity.setAtrribute("type", "parabolic");
        teleportEntity.setAttribute("cameraRig", "#cameraRig");
        teleportEntity.setAttribute("collisionEntities", "#floor");
    })

<a-mixin id="teleport"></a-mixin>

在A-frame

1 个答案: