我正在使用a-frame physics component中的applyImpulse
方法通过cannon.js来“推送”框。
使用auto
身体形状时,此方法工作正常,但是当我手动创建形状时,出现以下错误
Uncaught RangeError: Maximum call stack size exceeded
at LocalDriver.applyBodyMethod (aframe-physics-system.min.js:1)
at Body.body.applyImpulse [as __applyImpulse] (aframe-physics-system.min.js:1)
请在下面查看我的代码。
使用以下脚本
<script src="https://aframe.io/releases/0.8.2/aframe.min.js"></script>
<script src="https://cdn.rawgit.com/donmccurdy/aframe-extras/v4.1.2/dist/aframe-extras.min.js"></script>
<script src="https://cdn.rawgit.com/donmccurdy/aframe-physics-system/v3.1.1/dist/aframe-physics-system.min.js"></script>
这是我添加到框中的组件。
AFRAME.registerComponent('push', {
dependencies: ['keyboard-controls'],
multiple: true,
init: function(){
this.el.addEventListener('body-loaded', () => {
this.el.addEventListener('keydown:KeyP', () => {
var force = new CANNON.Vec3(0, 0, -20)
var local = new CANNON.Vec3(0, 0, 0)
var worldVelocity = this.el.body.quaternion.vmult(force);
this.el.body.applyImpulse(
worldVelocity, local
);
});
});
},
})
和带有方框的HTML显示了我添加正文的不同方式
<a-scene physics="debug:true">
<!-- auto body shape -->
<a-box
id="test1"
push
dynamic-body
position="-1 1 -3"
color="blue">
</a-box>
<!-- manual body shape -->
<a-box
id="test2"
push
body="type: dynamic; shape: none"
shape="shape: box; halfExtents: 0.5 0.5 0.5"
position="1 1 -3"
color="green">
</a-box>
<a-box
id="floor"
static-body
width="50"
depth="50"
height="0.2"
color="grey">
</a-box>
</a-scene>
And here is a glitch演示问题。如果按P
,将看到蓝色框被按下,而绿色框则抛出错误。除了身体形状,它们是相同的。
盒子是问题的简化示例,因此在这种情况下,我当然可以使用auto
形状,但是有两个原因使我希望能够以手动创建的形状推动物体。
因此,我可以将自定义形状添加到自定义模型中并进行推送。
我注意到,如果您将子实体添加到具有动态实体(具有自动形状)的实体中,则会扩展实体的大小(这可能是我期望的),但是在某些情况下,我希望形状保持不变。
非常感谢任何帮助。
答案 0 :(得分:0)
自定义对撞机的形状有点难以设置,我认为A-Frame正朝着主要将Ammo.js用于物理的方向发展,而不是坚持使用Cannon.js。我认为新的实现将对这些问题,现在值得一试。
我很幸运,用符号shape__*name*=
而不是shape=
来命名每个对撞机任务。在您的示例中,尝试将shape=
替换为shape__main=
...并不是一个令人满意的答案,但这可能会减轻您的麻烦。
这是我为此做的模型的一个例子:
<a-mixin id="ramsclone" gltf-model="#rams-horn" body="type: dynamic; shape: none; mass: 0.1; linearDamping: 0.1; angularDamping: 0.1"
shape__main="shape: sphere;
radius: 0.17;
offset: -0.145 0.136 0.165;"
shape__body1="shape: sphere;
radius: 0.12;
offset: -0.083 0.243 0.198;"
shape__body2="shape: sphere;
radius: 0.12;
offset: -0.173 0.029 0.118;"
shape__bodyTop="shape: box;
halfExtents: 0.084 0.103 0.105;
offset: -0.157 -0.098 0.038;
orientation: 0.8400684, 0.2886184, 0.0301367, 0.4583408 ;"
shape__leftArm="shape: box;
halfExtents: 0.137 0.0445 0.0325;
offset: 0.005 -0.244 0.06;
orientation: 0.1290826 0.0039395 -0.1003681 0.9865335;"
shape__leftArm1="shape: box;
halfExtents: 0.13 0.041 0.0305;
offset: 0.249 -0.271 0.017;
orientation: 0.0501092 0.1840173 0.0409406 0.9807908;"
shape__leftArm2="shape: box;
halfExtents: 0.09 0.0365 0.02;
offset: 0.417 -0.197 -0.078w;
orientation: 0.0707054 0.3141996 0.3492167 0.8799586;"
shape__leftArm3="shape: box;
halfExtents: 0.0485 0.0305 0.02;
offset: 0.482 -0.107 -0.142;
orientation: 0.09046 0.3303264 0.4447484 0.8275871;"
shape__leftArm4="shape: box;
halfExtents: 0.091 0.0285 0.013;
offset: 0.487 0.007 -0.18;
orientation: 0.0135517 0.1734546 0.8368887 0.5189867;"
shape__rightArm="shape: box;
halfExtents: 0.026 0.044 0.1045;
offset: -0.171 -0.098 -0.15;
orientation: 0.123475, -0.1116069, -0.3571837, 0.9190852;"
shape__rightArm1="shape: box;
halfExtents: 0.12 0.0245 0.0355;
offset: -0.073 -0.048 -0.325;
orientation: -0.0936292 0.333684 0.2393541 0.906972;"
shape__rightArm2="shape: box;
halfExtents: 0.1065 0.032 0.0205;
offset: 0.092 0.02 -0.43;
orientation: 0.7413147 0.192885, 0.002603 0.6428382;"
shape__rightArm3="shape: box;
halfExtents: 0.0865 0.025 0.0145;
offset: 0.263 0.07 -0.436;
orientation: 0.7100493 -0.0113422 0.1822565 0.6800617;"
shape__rightArm4="shape: box;
halfExtents: 0.0455 0.0165 0.0145;
offset: 0.371 0.101 -0.386;
orientation: 0.7033997 -0.186609 0.3871981 0.5661126;"
shape__rightArm5="shape: box;
halfExtents: 0.0515 0.022 0.01;
offset: 0.407 0.11 -0.31;
orientation: -0.6250864 0.3855834 -0.5259696 -0.4288922;" class="grabbable"></a-mixin>
(显然,根据需要生成对撞机的资产的多少,为这种事情编写一个解析器会更有效)