基本上在我的场景中,我有一个带有激光控件的实体和一个结构的光线投射器:
<a-scene>
<a-entity laser-controls raycaster ...>
<!--<a-entity id="inventory" ...> Could be inserted here-->
</a-entity>
<!--<a-entity id="inventory" ...> Could be inserted here-->
</a-scene>
我的目标是在激光线的当前 x,y 位置召唤库存,我已经可以访问对应于激光线末端的点。我不希望库存再次从该位置移动。如果我将库存设置为光线投射器的子项,它总是随线移动。如果我将库存设置为场景的子项,同时将其位置设置为它应该所在的点的世界坐标,它只是不起作用。
我尝试过但失败的方法:
作为光线投射器- 子级启动库存,并将父级更改为场景并应用光线投射器的世界矩阵
- 将库存保留为光线投射器子级,捕获其初始世界矩阵并在每次刻度上设置相同的世界矩阵
最后,我目前的方法(使用代码)仍然失败
1.将线端的局部坐标收敛到世界坐标
2.将库存追加到场景
3.将线端的世界坐标转换为场景的局部坐标
4.将仓位 3 应用于库存
let v = this.emptyVec
v.copy(this.raycaster.components.line.data.end)
this.raycaster.object3D.localToWorld(v);
this.el.appendChild(inventoryNode) //this.el is the scene
this.el.object3D.worldToLocal(v);
const {x,y} = v
inventoryNode.object3D.position.set(x,y,inventoryZDistance)
TLDR:如何将实体设置为光线投射线末端的位置,并将其添加到场景中并使其永远保持在该位置
最终找到了解决方案。这是在控制器单击事件的事件侦听器上运行的(关键是它不需要在每个报价时运行,它只运行一次)
- 创建了一个虚拟节点,它是光线投射器的子节点,并将其位置设置为线端的 x,y 坐标和我想要的任何 z 坐标
- 将正确的库存节点追加到场景
-
使用 setFromMatrixPosition() 方法从虚拟节点的世界矩阵中设置库存的位置
let dummyNode = document.createElement("a-entity") dummyNode.setAttribute("id", "dummyinventory") dummyNode.setAttribute("visible", false) //maybe unnecessary const {x,y} = this.raycaster.components.line.data.end dummyNode.object3D.position.set(x,y,inventoryZDistance) this.raycaster.appendChild(dummyNode) inventoryNode.setAttribute('look-at', "[camera]") //if you want inventory to face the camera this.el.appendChild(inventoryNode) setTimeout(()=>{ let newMatrix = dummyNode.object3D.matrixWorld inventoryNode.object3D.position.setFromMatrixPosition(newMatrix) },50) //give the world matrix of dummyNode some time to update, with no timeout sometimes fails
如果想要通过让虚拟节点成为摄像机而不是光线投射器的子节点来生成用户正在查看的某个实体,则可以应用相同的思维过程