Matter.js Compound Collision Clipping -
compound bodies clip dramatically, , results in variety of glitches, example this. seems occur when there's parts in 1 compound. i'm not sure if i'm doing wrong or if bug.
// module aliases var engine = matter.engine, render = matter.render, world = matter.world, bodies = matter.bodies; // create engine var engine = engine.create(); // create renderer var render = render.create({ element: document.body, engine: engine }); engine.run(engine) var composite = matter.body.create(); var bodya = matter.bodies.rectangle(0, 0, 100, 100) var bodyb = matter.bodies.rectangle(0, 0, 100, 100) var bodyc = matter.bodies.rectangle(0, 0, 100, 100) var origin = matter.bodies.rectangle(0, 0, 20, 20) world.add(engine.world, [composite]) matter.body.setparts(composite, [origin, bodya], true) var ground = matter.bodies.rectangle(500, 800, 2000, 400) world.add(engine.world, ground) matter.body.rotate(composite, 5) matter.body.setposition(composite, { x: 500, y: 0 }) matter.body.setstatic(ground, true) settimeout(function() { addrelative({ body: bodyb, composite: composite, position: { x: 0, y: 100 } }) settimeout(function() { addrelative({ body: matter.bodies.rectangle(0, 0, 100, 100), composite: composite, position: { x: 100, y: 0 } }) addrelative({ body: matter.bodies.rectangle(0, 0, 100, 100), composite: composite, position: { x: 100, y: 100 } }) addrelative({ body: matter.bodies.rectangle(0, 0, 100, 100), composite: composite, position: { x: 100, y: 200 } }) addrelative({ body: matter.bodies.rectangle(0, 0, 100, 100), composite: composite, position: { x: 100, y: 300 } }) addrelative({ body: matter.bodies.rectangle(0, 0, 100, 100), composite: composite, position: { x: 100, y: -100 } }) addrelative({ body: matter.bodies.rectangle(0, 0, 100, 100), composite: composite, position: { x: 100, y: -200 } }) addrelative({ body: matter.bodies.rectangle(0, 0, 100, 100), composite: composite, position: { x: 100, y: -300 } }) addrelative({ body: matter.bodies.rectangle(0, 0, 100, 100), composite: composite, position: { x: -100, y: 100 } }) world.remove(engine.world, composite); settimeout(function() { world.add(engine.world, composite); }, 10) }, 500) }, 00) function addrelative(obj) { //obj.body //obj.composite //obj.position var bodyb = obj.body var composite = obj.composite var origin = composite.parts[1] var angularvelocity = composite.angularvelocity; var velocity = composite.velocity; matter.body.setposition(bodyb, { x: origin.position.x + obj.position.x, y: origin.position.y + obj.position.y }); var newvector = matter.vector.rotateabout(bodyb.position, composite.angle, origin.position); matter.body.setposition(bodyb, newvector); matter.body.setangle(bodyb, composite.angle); var arr = composite.parts.slice(); arr.shift(); arr.push(bodyb) matter.body.setparts(composite, arr, false) matter.body.setvelocity(composite, velocity); matter.body.setangularvelocity(composite, angularvelocity); } render.run(render); var renderoptions = render.options renderoptions.showaxes = true; renderoptions.showpositions = true; renderoptions.showconvexhulls = true;
body { background: #222; text-align: center; }
<script src="https://cdnjs.cloudflare.com/ajax/libs/matter-js/0.12.0/matter.js"></script>
wondering if there's fix / workaround.
currently hit brick wall in project because of this.
Comments
Post a Comment