A框架物理-如何将脉冲应用于具有手动创建的身体形状的物理对象?

时间:2018-07-30 15:42:52

标签: aframe cannon.js

我正在使用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形状,但是有两个原因使我希望能够以手动创建的形状推动物体。

  1. 因此,我可以将自定义形状添加到自定义模型中并进行推送。

  2. 我注意到,如果您将子实体添加到具有动态实体(具有自动形状)的实体中,则会扩展实体的大小(这可能是我期望的),但是在某些情况下,我希望形状保持不变。

非常感谢任何帮助。

1 个答案:

答案 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>

(显然,根据需要生成对撞机的资产的多少,为这种事情编写一个解析器会更有效)