Question

我在Matter.js物理引擎上显示红色方块时遇到问题。我确定我引用了必要的变量，但是除了Matter.js的最小示例之外，我似乎什么也没有显示。我做错了什么？

<html>
<script src='matter.min.js'>
</script>
<canvas>
</canvas>
<script>
var banvas = document.querySelector('canvas'),
    context = banvas.getContext('2d');

var Engine = Matter.Engine,
    Render = Matter.Render,
    World = Matter.World,
    Bodies = Matter.Bodies;

// create an engine
var engine = Engine.create();

// create a renderer
var render = Render.create({
    canvas: banvas,
    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 });

context.fillStyle='red';
context.fillRect(0,0,40,40);

// add all of the bodies to the world
World.add(engine.world, [boxA, boxB, ground]);

// run the engine
Engine.run(engine);

// run the renderer
Render.run(render);
</script>
</html>

在Matter.js上渲染一个红色正方形

0 个答案: