javascript - matterJS rendering to canvas -

im trying use matterjs , render specific canvas in layout can't manage it.

this the js:

window.addeventlistener("load",init);     function init(){      var canvas = document.getelementbyid('matterjs');     var width = 100,         height = 100;      canvas.width = width;     canvas.height = height;          // matter.js - http://brm.io/matter-js/          // matter module aliases         var engine = matter.engine,             world = matter.world,             body = matter.body,             composites = matter.composites,             mouseconstraint = matter.mouseconstraint;          // create matter.js engine         var engine = engine.create({           render: {             element: document.body,             canvas: canvas,             options: {               width: 100,               height: 100,                                 showangleindicator: true,               showvelocity: true,               wireframes: false             }           }         });          // add mouse controlled constraint         var mouseconstraint = mouseconstraint.create(engine);         world.add(engine.world, mouseconstraint);          // add newton's cradle (using composites factory method!)         var cradle = composites.newtonscradle(280, 150, 5, 30, 200);         world.add(engine.world, cradle);          // offset first body in cradle swing         body.translate(cradle.bodies[0], { x: -180, y: -100 });          // run engine         engine.run(engine);    } 

in html im doing this:

<canvas class="matterjs"></canvas> 

i don't error nothing rendered either.. think should work. why doesn't?

i can render outcome when im creating engine this:

var engine = engine.create(document.getelementbyid('matterjs'),{                 options: {                   width: 100,                   height: 100,                                     showangleindicator: true,                   showvelocity: true,                   wireframes: false               }             }); 

now solved this:

var canvas = document.getelementbyid('matterjs'); var width = 800,     height = 800;  canvas.width = width; canvas.height = height;      // matter.js - http://brm.io/matter-js/      // matter module aliases     var engine = matter.engine,         world = matter.world,         body = matter.body,         composites = matter.composites,         mouseconstraint = matter.mouseconstraint;      // create matter.js engine     var engine = engine.create(canvas, {         options: {           width: 1000,           height: 1000,                            showangleindicator: true,           showvelocity: true,           wireframes: false       }     });