PhysicsJS change circle radius

Question

After collision of 2 dots i want they make 1 dot with double radius so my code

world.on("collisions:detected", function(data) {
    data.collisions[0].bodyA.mass *=2
    data.collisions[0].bodyA.radius *=2
    data.collisions[0].bodyB.mass = 0
    data.collisions[0].bodyA.recalc()
    data.collisions[0].bodyB.recalc()
})

Radius doesn't change and sometimes strange behavior that 2 dots dissapear at one moment.

Is my code correct?

Answer 1

You can't have a mass of zero. If you want try setting the mass to be really small.

You might also be having a problem with the renderer's views not being refreshed. This is easy, just set the .view on each body to null.

I'd also recommend making your code more general by using one of the tactics described here: https://github.com/wellcaffeinated/PhysicsJS/wiki/Collisions

That way if you add more bodies to your simulation it'll still work. For example:

myCatBody.label = 'cat;
myDogBody.label = 'dog;

// query to find a collision between a body with label "cat" and a body with label "dog"
var query = Physics.query({
    $or: [
        { bodyA: { label: 'cat' }, bodyB: { label: 'dog' } }
        ,{ bodyB: { label: 'dog' }, bodyA: { label: 'cat' } }
    ]
});

// monitor collisions
world.on('collisions:detected', function( data, e ){
    // find the first collision that matches the query
    var found = Physics.util.findOne( data.collisions, query );
    if ( found ){
        found.bodyA.mass *= 2;
        found.bodyA.geometry.radius *= 2;
        found.bodyB.mass = 0.001;
        found.bodyA.view = null;
        found.bodyB.view = null;
        found.bodyA.recalc();
        found.bodyB.recalc()
    }
});