matter.js and microStudio JavaScript

I Created JavaScript microStudio project + matter.js then taken example code from https://github.com/liabru/matter-js/wiki/Getting-started paste it to init() function like that:

init = function() {
  // module aliases
  var Engine = Matter.Engine,
      Render = Matter.Render,
      Runner = Matter.Runner,
      Bodies = Matter.Bodies,
      Composite = Matter.Composite;
  // 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 });
  // add all of the bodies to the world
  Composite.add(engine.world, [boxA, boxB, ground]);
  // run the renderer
  // create runner
  var runner = Runner.create();
  // run the engine
  Runner.run(runner, engine);

update = function() {

draw = function() {
  // screen.clear()
  // screen.drawSprite("ball",x,y,8,8)

and nothing happen, where do I wrong ? How to run example code from matterjs in microStudio ? Thanks

  1. You need to add the Matter.js library in the options.

  2. Javascript is new to MicroStudio - and it communicates errors badly. E.g. using var in code doesn't work the same as in javascript. All variables you create with var are invisible. You can check it by running the program whose code you posted and in the console enter the word "engine". You will get an error message that such a variable does not exist. Remove the word var from before "engine", restart the program and write in the console "engine" now you have a message that under this name there is object .

  3. Randerer - I couldn't force it to display anything because by default MicroScript has no way to pass a pointer to HTML/DOM elements of the browser. You have to draw by yourself. (But I'm sure it can be done somehow)

  4. Here is an example of how to convert your code to Matter.js + MicroScript >> https://microstudio.io/i/Loginus/mattertestmicroscript/

  5. Earlier, I gave some other examples of how to use Matter.js.

  6. If you really want, I can write this code in javascript, but it's best to write MicroScript because errors will kill your project.

Have a look at my MatterTest-Project: https://microstudio.io/PaulSt/mattertest2/ It's written in javascript and it uses the Matter.Renderer. (Made it work somehow:))

Post a reply



Validate your e-mail address to participate in the community