I am thinking there is a simple answer to my seemingly simple question but I could be totally wrong. Anyway I am new to box2dWeb and in my Box2dWeb world I create a floor and a simple falling object. When I "debug draw" into my canvas I see the box falling and everything. All I want to do is output the x position of the falling object I created into the browsers console.log and it doesn't work quite right. The console.log just displays the starting position of my object but the number does not update even though my object within the canvas is falling. After hours of searching with many search engines, and places like Seth Ladds tutorials I came up empty. I am hoping someone here can help. I provided some sample code to help explain myself a little better. Hope it helps. Thanks to all who reply.

  var world;

  function init() {
     var b2Vec2 = Box2D.Common.Math.b2Vec2
      , b2BodyDef = Box2D.Dynamics.b2BodyDef
      , b2Body = Box2D.Dynamics.b2Body
      , b2FixtureDef = Box2D.Dynamics.b2FixtureDef
      , b2Fixture = Box2D.Dynamics.b2Fixture
      , b2World = Box2D.Dynamics.b2World
      , b2MassData = Box2D.Collision.Shapes.b2MassData
      , b2PolygonShape = Box2D.Collision.Shapes.b2PolygonShape
      , b2CircleShape = Box2D.Collision.Shapes.b2CircleShape
      , b2DebugDraw = Box2D.Dynamics.b2DebugDraw
        ;

     world = new b2World(
           new b2Vec2(0, 10) //gravity
        , true //allow sleep
     );

     var fixDef = new b2FixtureDef;
     fixDef.density = 1.0;
     fixDef.friction = 0.5;
     fixDef.restitution = 0.2;

     var bodyDef = new b2BodyDef;

     //create ground
     bodyDef.type = b2Body.b2_staticBody;
     bodyDef.position.x = 9;
     bodyDef.position.y = 13;
     fixDef.shape = new b2PolygonShape;
     fixDef.shape.SetAsBox(10, 0.5);
     world.CreateBody(bodyDef).CreateFixture(fixDef);


        //FIXTURE - define fixture
        crateFixture = new b2FixtureDef;


            //set object attributes
            crateFixture.density = 0.9;
            crateFixture.friction = 0.5;
            crateFixture.restitution = 0.5;


        //BODY - define body  
        crateDef = new b2BodyDef;


            //setup type
            crateDef.type = b2Body.b2_dynamicBody;
            crateDef.position.x = 5;        
            crateDef.position.y = 5;    
            crateDef.angle = 65;


        //SHAPE - define shape
        crateFixture.shape = new b2PolygonShape;


        //define shape
            crateFixture.shape.SetAsBox(2, 2);


        //add to our world
        world.CreateBody(crateDef).CreateFixture(crateFixture);


            //setup debug draw
            var debugDraw = new b2DebugDraw();
    debugDraw.SetSprite(document.getElementById("canvas").getContext("2d"));
    debugDraw.SetDrawScale(30.0);
    debugDraw.SetFillAlpha(0.3);
    debugDraw.SetLineThickness(1.0);
    debugDraw.SetFlags(b2DebugDraw.e_shapeBit | b2DebugDraw.e_jointBit);
    world.SetDebugDraw(debugDraw);

     window.setInterval(update, 1000 / 60);
  };

  function update() {
     world.Step(
           1 / 60 //frame-rate
        , 10 //velocity iterations
        , 10 //position iterations
     );
     world.DrawDebugData();
     world.ClearForces();
     console.log('the crate is located at ' + crateDef.position.x); //position of crate doesnt update
  };

I am thinking there is a simple answer to my seemingly simple question but I could be totally wrong. Anyway I am new to box2dWeb and in my Box2dWeb world I create a floor and a simple falling object. When I "debug draw" into my canvas I see the box falling and everything. All I want to do is output the x position of the falling object I created into the browsers console.log and it doesn't work quite right. The console.log just displays the starting position of my object but the number does not update even though my object within the canvas is falling. After hours of searching with many search engines, and places like Seth Ladds tutorials I came up empty. I am hoping someone here can help. I provided some sample code to help explain myself a little better. Hope it helps. Thanks to all who reply.

  var world;

  function init() {
     var b2Vec2 = Box2D.Common.Math.b2Vec2
      , b2BodyDef = Box2D.Dynamics.b2BodyDef
      , b2Body = Box2D.Dynamics.b2Body
      , b2FixtureDef = Box2D.Dynamics.b2FixtureDef
      , b2Fixture = Box2D.Dynamics.b2Fixture
      , b2World = Box2D.Dynamics.b2World
      , b2MassData = Box2D.Collision.Shapes.b2MassData
      , b2PolygonShape = Box2D.Collision.Shapes.b2PolygonShape
      , b2CircleShape = Box2D.Collision.Shapes.b2CircleShape
      , b2DebugDraw = Box2D.Dynamics.b2DebugDraw
        ;

     world = new b2World(
           new b2Vec2(0, 10) //gravity
        , true //allow sleep
     );

     var fixDef = new b2FixtureDef;
     fixDef.density = 1.0;
     fixDef.friction = 0.5;
     fixDef.restitution = 0.2;

     var bodyDef = new b2BodyDef;

     //create ground
     bodyDef.type = b2Body.b2_staticBody;
     bodyDef.position.x = 9;
     bodyDef.position.y = 13;
     fixDef.shape = new b2PolygonShape;
     fixDef.shape.SetAsBox(10, 0.5);
     world.CreateBody(bodyDef).CreateFixture(fixDef);


        //FIXTURE - define fixture
        crateFixture = new b2FixtureDef;


            //set object attributes
            crateFixture.density = 0.9;
            crateFixture.friction = 0.5;
            crateFixture.restitution = 0.5;


        //BODY - define body  
        crateDef = new b2BodyDef;


            //setup type
            crateDef.type = b2Body.b2_dynamicBody;
            crateDef.position.x = 5;        
            crateDef.position.y = 5;    
            crateDef.angle = 65;


        //SHAPE - define shape
        crateFixture.shape = new b2PolygonShape;


        //define shape
            crateFixture.shape.SetAsBox(2, 2);


        //add to our world
        world.CreateBody(crateDef).CreateFixture(crateFixture);


            //setup debug draw
            var debugDraw = new b2DebugDraw();
    debugDraw.SetSprite(document.getElementById("canvas").getContext("2d"));
    debugDraw.SetDrawScale(30.0);
    debugDraw.SetFillAlpha(0.3);
    debugDraw.SetLineThickness(1.0);
    debugDraw.SetFlags(b2DebugDraw.e_shapeBit | b2DebugDraw.e_jointBit);
    world.SetDebugDraw(debugDraw);

     window.setInterval(update, 1000 / 60);
  };

  function update() {
     world.Step(
           1 / 60 //frame-rate
        , 10 //velocity iterations
        , 10 //position iterations
     );
     world.DrawDebugData();
     world.ClearForces();
     console.log('the crate is located at ' + crateDef.position.x); //position of crate doesnt update
  };

• javascript
• html
• canvas
• box2d

4 Answers 4

OK so no thanks to the lack of any real documentation specifically for Box2DWeb I did finally figure this out. Quickly I wanted to also thank Jer In Chicago for his replies, so thanks brother. Anyway the answer:

once you add your object to your world like so:

crateFixture = world.CreateBody(crateBodyDef).CreateFixture(crateFixtureDef);

you can grab the value of your object (in my case it is crateBody) as follows:

console.log('crate X: ' + crateFixture.GetBody().GetPosition().x);
console.log('crate Y: ' + crateFixture.GetBody().GetPosition().y);
console.log('crate Angle: ' + crateFixture.GetBody().GetAngle());

Hope this helps others!

Ok, couldn't find a api/doc for Box2dWeb, so I downloaded the source and did confirm that the body should have a position... instead of trying to use the crateBody var, lets just loop through all bodies that are in the world and see if we can print their coords... Good luck!

Edit : Try this

// Add after world step call
for (b = world.GetBodyList(); b; b = b.GetNext()) {
    console.log('the object is located at (' + b.position.x + ',' + b.position.y + ')');
}

var body = world.CreateBody(bodyDef);
body.CreateFixture(fixDef);

console.log(body.GetWorldCenter().x);

or

var body = world.CreateBody(bodyDef);
body.CreateFixture(fixDef);

console.log(body.GetPosition().x);

or

var body = world.CreateBody(bodyDef);
body.CreateFixture(fixDef);

console.log(body.GetWorldPoint(new b2Vec2(0,0)).x);

Where (0,0) is the coordinate of the center of the body in local coordinates. The GetWorldPoint function converts it in World Coordinates.

I had the similar problem working with Box2dWeb. Thank you for posting this question. Using @JerinChicago tips I found the solution.

 for (var b = world.GetBodyList() ; b; b = b.GetNext()) {
     console.log('the object is located at (' + b.GetPosition().x + ',' + b.GetPosition().y + ')');
 }

I hope this will help.