我在 Matter.js 物理引擎中创建了一个简单的动画,其中有一些物体碰撞并掉落在地上。
我注意到结果总是有点不同。你可以在这里看到:https://jsfiddle.net/95urgeqf/1/
var Engine = Matter.Engine,
Render = Matter.Render,
World = Matter.World,
Bodies = Matter.Bodies,
Body = Matter.Body;
// create an engine
var engine = Engine.create();
// create a renderer
var render = Render.create({
element: document.body,
engine: engine
});
// create two boxes and a ground
var boxA = Bodies.rectangle(400, 200, 80, 80);
var boxB = Bodies.rectangle(450, 50, 80, 80);
var ground = Bodies.rectangle(400, 610, 810, 60, { isStatic: true });
var circle1 = Matter.Bodies.circle(400, 200, 20, { isStatic: true }, 300);
var circle2 = Matter.Bodies.circle(600, 300, 20, { isStatic: true }, 300);
var circle3 = Matter.Bodies.circle(200, 400, 20, { isStatic: true }, 300);
Body.setVelocity(boxA, { x: 0, y: -10});
// add all of the bodies to the world
World.add(engine.world, [boxA, boxB, ground, circle1, circle2, circle3]);
// run the engine
Engine.run(engine);
// run the renderer
Render.run(render);
最引人注目的是左边的方块,当它接触地面时,它的下落总是有点不同。
我的目标是创建一个始终表现相同的动画,因此只要具有相同的参数,左侧的方块每次都应该以相同的方式落在地面上。