我怎样才能使用Famo.us的旋转弹簧?

时间:2014-05-15 06:25:13

标签: famo.us

我试图用Famo.us物理引擎做一些例子。

我曾尝试过一个春天的例子。我认为旋转弹簧可能与它相似,所以我试图这样做,但对我来说并不容易。

以下是使用旋转弹簧的示例,但它不起作用

var Engine                  = require("famous/core/Engine");
var Surface                 = require("famous/core/Surface");
var ImageSurface            = require("famous/surfaces/ImageSurface");
var Modifier                = require("famous/core/Modifier");

var Transform               = require("famous/core/Transform");
var Transitionable          = require("famous/transitions/Transitionable");
var PhysicsEngine           = require("famous/physics/PhysicsEngine");
var Spring                  = require("famous/physics/forces/Spring");
var RotationalSpring        = require("famous/physics/forces/RotationalSpring");
var Particle                = require("famous/physics/bodies/Particle");
var Body                    = require("famous/physics/bodies/Body");
var Constraint              = require("famous/physics/constraints/Constraint");
var MouseSync = require("famous/inputs/MouseSync");
var mainContext = Engine.createContext();   
var PE = new PhysicsEngine();
content.particle = new Particle({
                          mass: 1,
                          position: [0, 0, 0],
                          velocity: [0, 0, 0],
                          axis : 0x01   //0x01 : Particle.AXES.y
                        });

// Create a spring that will act on the particle
var rotationalSpring = new RotationalSpring({
  anchor: [0, 0, 0],
  period: 400,  // <= Play with these values :-)
  dampingRatio: 0.07, // <= if 0 then just once / else if 1 then infinite
  length: 0
});

// Link the spring, particle and surface together
PE.attach(rotationalSpring, content.particle);  
PE.addBody(content.particle);
var translateMod = new Modifier({       origin: [.5,.5]    });

//Get Mouse input
var position = [0, 0];

var mouseSync = new MouseSync(function() {
    return position;
});

Engine.pipe(mouseSync);

// Get start when there is a Mouse input
mouseSync.on("start", function() {
    FaceSequence.particle.applyForce(new Vector(0, 1.0, 0));
});

translateMod.transformFrom(function() {

        var transM = FaceSequence.particle.getTransform();      
        return transM;
});

我怎样才能让它有效? :)

1 个答案:

答案 0 :(得分:0)

稍微调试上面的代码之后,我意识到RotationalSpring的函数调用与Body匹配,而不是Particle。在快速重写之后,我得到了许多奇怪的结果,这让我想到了旋转平衡。它们极其敏感且极其微妙,所以我猜这可能会以同样的方式起作用。在稍微降低扭矩后,我开始得到一些几乎合理的结果。我将离开微调,但这里有一些几乎合理的旋转弹簧代码。我稍微倾斜了一个角度表面,使旋转更加清晰。您还可以在codefamo.us

看到它正常运行

这是代码......

/* globals define */
define(function(require, exports, module) {
  var Engine                  = require("famous/core/Engine");
  var Surface                 = require("famous/core/Surface");
  var ImageSurface            = require("famous/surfaces/ImageSurface");
  var Modifier                = require("famous/core/Modifier");
  var StateModifier           = require("famous/modifiers/StateModifier");

  var Transform               = require("famous/core/Transform");
  var Transitionable          = require("famous/transitions/Transitionable");
  var PhysicsEngine           = require("famous/physics/PhysicsEngine");
  var Spring                  = require("famous/physics/forces/Spring");
  var RotationalSpring        = require("famous/physics/forces/RotationalSpring");
  var Particle                = require("famous/physics/bodies/Particle");
  var Body                    = require("famous/physics/bodies/Body");
  var Constraint              = require("famous/physics/constraints/Constraint");
  var Vector = require('famous/math/Vector');
  var MouseSync = require("famous/inputs/MouseSync");


  var mainContext = Engine.createContext();
  var PE = new PhysicsEngine();

  var surf = new Surface({
    size: [200,200],
    properties: {
      backgroundColor:'red',
      '-webkit-backface-visibility':'visible'
    }
  });

  var tilt = new StateModifier({
    transform: Transform.rotateX(Math.PI/8)
  });

  // Create a spring that will act on the particle
  var rotationalSpring = new RotationalSpring({
    anchor: new Vector(0, 1, 0),
    period: 3000,  // <= Play with these values :-)
    dampingRatio: 0.1// <= if 0 then just once / else if 1 then infinite
  });

  var body = new Body({
    mass: 10
  });

  // Link the spring, particle and surface together
  PE.addBody(body);
  PE.attach(rotationalSpring, body);

  var translateMod = new Modifier({
    origin: [.5,.5]
  });

  translateMod.transformFrom(function() {
    return body.getTransform();
  });

  Engine.on('click', function() {
    body.applyTorque(new Vector(0,.001,0));
  });

  mainContext.add(translateMod).add(tilt).add(surf);
});