I've been trying to get into Box2DWeb which is a JS port of the AS port of Box2D. Just trying to get a simple setup going where there is a static ramp and a dynamic box that falls on it. Here is my code:

var b2World =  Box2D.Dynamics.b2World;
var b2DebugDraw = Box2D.Dynamics.b2DebugDraw;
var b2Vec2 = Box2D.Common.Math.b2Vec2;
var b2BodyDef = Box2D.Dynamics.b2BodyDef;
var b2Body = Box2D.Dynamics.b2Body;
var b2FixtureDef = Box2D.Dynamics.b2FixtureDef;
var b2PolygonShape = Box2D.Collision.Shapes.b2PolygonShape;
var b2CircleShape = Box2D.Collision.Shapes.b2CircleShape;

var width = 8;
var height = 4;

var world = new b2World(new b2Vec2(0, 10), true);

var debugDraw = new b2DebugDraw();
debugDraw.SetSprite(document.getElementById("canvas").getContext("2d"));
debugDraw.SetDrawScale(100); //Arena is 8 meters by 4 meters
debugDraw.SetFillAlpha(0.5);
debugDraw.SetLineThickness(1);
debugDraw.SetFlags(b2DebugDraw.e_shapeBit);
world.SetDebugDraw(debugDraw);

var bodyDef = new b2BodyDef();
bodyDef.type = b2Body.b2_staticBody;
bodyDef.position.Set(3.5, 3)
var body = world.CreateBody(bodyDef);
body.SetAngle(Math.PI / 4);
var shape = new b2PolygonShape();
shape.SetAsBox(1, 0.25);
var fixtureDef = new b2FixtureDef();
fixtureDef.shape = shape;
fixtureDef.density = 1;
fixtureDef.friction = 0.3;
body.CreateFixture(fixtureDef);

var bodyDef = new b2BodyDef();
bodyDef.type = b2Body.b2_dynamicBody;
bodyDef.position.Set(3.5, 1)
var body = world.CreateBody(bodyDef);
var shape = new b2PolygonShape();
shape.SetAsBox(0.10, 0.10);
var fixtureDef = new b2FixtureDef();
fixtureDef.shape = shape;
body.CreateFixture(fixtureDef); 

setInterval(function() {
    world.Step(1 / 60, 10, 10);
    world.DrawDebugData();
    world.ClearForces();
    console.log(body.GetAngle());
}, 1000 / 60);

You can see the live result on jsFiddle. As you can see, the box doesn't rotate when it hits the ramp. What am I doing wrong?

Thanks.

Some ressources:

• AS3 Manual: .0.2/manual
• AS3 Reference: .0.2/reference/

I've been trying to get into Box2DWeb which is a JS port of the AS port of Box2D. Just trying to get a simple setup going where there is a static ramp and a dynamic box that falls on it. Here is my code:

var b2World =  Box2D.Dynamics.b2World;
var b2DebugDraw = Box2D.Dynamics.b2DebugDraw;
var b2Vec2 = Box2D.Common.Math.b2Vec2;
var b2BodyDef = Box2D.Dynamics.b2BodyDef;
var b2Body = Box2D.Dynamics.b2Body;
var b2FixtureDef = Box2D.Dynamics.b2FixtureDef;
var b2PolygonShape = Box2D.Collision.Shapes.b2PolygonShape;
var b2CircleShape = Box2D.Collision.Shapes.b2CircleShape;

var width = 8;
var height = 4;

var world = new b2World(new b2Vec2(0, 10), true);

var debugDraw = new b2DebugDraw();
debugDraw.SetSprite(document.getElementById("canvas").getContext("2d"));
debugDraw.SetDrawScale(100); //Arena is 8 meters by 4 meters
debugDraw.SetFillAlpha(0.5);
debugDraw.SetLineThickness(1);
debugDraw.SetFlags(b2DebugDraw.e_shapeBit);
world.SetDebugDraw(debugDraw);

var bodyDef = new b2BodyDef();
bodyDef.type = b2Body.b2_staticBody;
bodyDef.position.Set(3.5, 3)
var body = world.CreateBody(bodyDef);
body.SetAngle(Math.PI / 4);
var shape = new b2PolygonShape();
shape.SetAsBox(1, 0.25);
var fixtureDef = new b2FixtureDef();
fixtureDef.shape = shape;
fixtureDef.density = 1;
fixtureDef.friction = 0.3;
body.CreateFixture(fixtureDef);

var bodyDef = new b2BodyDef();
bodyDef.type = b2Body.b2_dynamicBody;
bodyDef.position.Set(3.5, 1)
var body = world.CreateBody(bodyDef);
var shape = new b2PolygonShape();
shape.SetAsBox(0.10, 0.10);
var fixtureDef = new b2FixtureDef();
fixtureDef.shape = shape;
body.CreateFixture(fixtureDef); 

setInterval(function() {
    world.Step(1 / 60, 10, 10);
    world.DrawDebugData();
    world.ClearForces();
    console.log(body.GetAngle());
}, 1000 / 60);

You can see the live result on jsFiddle. As you can see, the box doesn't rotate when it hits the ramp. What am I doing wrong?

Thanks.

Some ressources:

• AS3 Manual: http://www.box2dflash.org/docs/2.0.2/manual
• AS3 Reference: http://www.box2dflash.org/docs/2.0.2/reference/

• javascript
• canvas
• physics
• box2d

2 Answers 2

Add friction and density to the box. ...and don't leave the irc channel immediately, sometimes it takes more than 3 minutes.

Ah, you have to set the friction & density on the falling object's fixture, not the body.

var fixtureDef = new b2FixtureDef();
fixtureDef.shape = shape;
fixtureDef.friction = 0.3
fixtureDef.density = 1   
body.CreateFixture(fixtureDef);

btw thanks for pointing me in the direction of Box2D - I hadn't seen that physics engine before, looks interesting :)