a way to normalise the engine with pixijs ?

[jonlepage]

hi, existe a way to normalise values and get more easy to use this engine with pixijs?

https://jsfiddle.net/jonforum/w4kx2ey7/29/

it so complicated to work with reverse value and rounded !! Impossible for me to implement this in a big project. Or would someone have a physic engine easier to use?

my first attempt look like this, but all go crazy in my projet. https://jsfiddle.net/jonforum/w4kx2ey7/2 The engine use strange value!

[englercj]

You should basically only have one place that objects are synchronized with p2. If it is too complicated then you are likely integrating p2 in too many places.

Look at how phaser2 handles p2 and synchronizing it with render objects.

[jonlepage]

it is not in itself physic that is complicated. but i think my problem probably comes from the fact that i was brainWashed with using another physics engine for many years. I was use Newton2, a physic engine for AE, and we seem are very far from the same logic here!

I still can not assimilate this kind of logic Box({ width: 2?? 2% ? 200%? 2pixel ? and from what ? and a plane position -2 ? why reverse value ? and why 2 ? why not 200pixel?

I feel a little silly, because everybody seems to have no problem assimilating the logic of this engine! for me these values do not speak to me.

I look long enough at your project with phaser2, even if I do not know this library . Put that bring me back to the same logic problem, value dont talk to me!

[englercj]

I think your problem is that you are conflating the physics world and the rendering scene.

Units in the physics world and the rendering scene need to be translated between by you. A width of 2 means whatever you want it to mean. If you are using -9.82 as the gravity value, then each physics unit is 1 meter (because gravity acceleration on Earth is 9.82 m/s).

I think you are over complicating this in your head. It is really simple. Here is some pseudo-code:

// These values can be anything you want, it doesn't matter as long as you use
// the same ones throughout your app
function metersToPixels(m) { return m * 20; }
function pixelsToMeters(p) { return p * 0.05; }

// When you add something to the physics world, just create a body and store the sprite for later
function addPhysicsBody(sprite)
{
    const body = new p2.Body({
        x: -pixelsToMeters(sprite.position.x),
        y: -pixelsToMeters(sprite.position.y),
        width: pixelsToMeters(sprite.width),
        height: pixelsToMeters(sprite.height),
    });
    body.sprite = sprite;
    physicsWorld.addBody(body);
}

// When you update physics, go through each body and update the rendering
function updatePhysics(dt)
{
    physicsWorld.step(dt);
    foreach(body in physicsWorld.bodies)
    {
        body.sprite.position.x = -metersToPixels(body.x);
        body.sprite.position.y = -metersToPixels(body.y);
    }
}

That's pretty much it. You shouldn't be changing the properties of any physics-enabled sprites manually, and just let this physics integration code do everything for you.