Skip to main content

Command Palette

Search for a command to run...

Creating a Car with Matter.js

Published
1 min read
O

Hi there 👋🏾. I'm a software engineer that enjoys building stuff and talking about them. I also tinker a bit with hardware and robotics using Arduino and ROS.

var {Engine, Render, World, Runner, Bodies, Body, Constraint, MouseConstraint, Mouse} = Matter;
var engine = Engine.create(),
  world = engine.world;
var render = Render.create({
  element: document.body,
  engine:engine,
  options:{width:350,
    height:400, 
    wireframes:false,
    showAngleIndicator:true

  },
})
Render.run(render);
Engine.run(engine);

World.add(world, [Bodies.rectangle(175, 390, 350, 20, {
  isStatic:true, render:{fillStyle:'#ee872a'
  }
})
]);

let mouse = Mouse.create(render.canvas);
let mouseConstraint = MouseConstraint.create(engine, {
  mouse:mouse,
  constraint:{
    stiffness:0.4,
    render:{visible:false}
  }
})


let car_body = Bodies.rectangle(200, 350, 160, 70, {chamfer:20});
let tire1 = Bodies.circle(220, 350, 30);
let tire2 = Bodies.circle(240, 350, 30);

car_body.collisionFilter.group = -1;
tire1.collisionFilter.group = -1;
tire2.collisionFilter.group = -1;

let constraint1 = Constraint.create({
  bodyA:tire1,
  bodyB:car_body,
  length:0,
  pointB:{x:-40, y:20}
});

let constraint2 = Constraint.create({
  bodyA:tire2,
  bodyB:car_body,
  length:0,
  pointB:{x:40, y:20}
});

World.add(world, [car_body, tire1, tire2, constraint1, constraint2, mouseConstraint])

More from this blog

O

Osinachi's base

66 posts

Hi there, I'm a software engineer that enjoys building stuff and talking about them. I also tinker a bit with hardware and robotics using Arduino and ROS.