ロープジョイント(Box2dweb)の次のコードがあります。問題は、ブラウザでコードを実行しても何も起こらないことです。ただの空白のキャンバス。ジョイントを定義する線(//ジョイントに続く8本の線)を削除すると、それが実行され、1つの静的ボックスと2つの動的ボックスが地面に落ちているのがわかります。助けてください。
<html>
<head>
<title>Box2dWeb</title>
</head>
<body>
<canvas id="canvas" width="600" height="400" style="background-color:#333333;" ></canvas>
</body>
<script type="text/javascript" src="Box2dWeb-2.1.a.3.js"></script>
<script type="text/javascript">
var b2Vec2 = Box2D.Common.Math.b2Vec2
, b2BodyDef = Box2D.Dynamics.b2BodyDef
, b2Body = Box2D.Dynamics.b2Body
, b2FixtureDef = Box2D.Dynamics.b2FixtureDef
, b2World = Box2D.Dynamics.b2World
, b2PolygonShape = Box2D.Collision.Shapes.b2PolygonShape
, b2CircleShape = Box2D.Collision.Shapes.b2CircleShape
, b2RevoluteJointDef = Box2D.Dynamics.Joints.b2RevoluteJointDef
, b2DistanceJointDef = Box2D.Dynamics.Joints.b2DistanceJointDef
, b2RopeJointDef = Box2D.Dynamics.Joints.b2RopeJointDef
, b2MouseJointDef = Box2D.Dynamics.Joints.b2MouseJointDef
, b2DebugDraw = Box2D.Dynamics.b2DebugDraw
, b2Fixture = Box2D.Dynamics.b2Fixture
, b2AABB = Box2D.Collision.b2AABB
, b2Color = Box2D.Common.b2Color;
var world = new b2World(new b2Vec2(0,10), true);
//box1
var bodyDef = new b2BodyDef;
bodyDef.type = b2Body.b2_dynamicBody;
bodyDef.position.Set(8,4);
var fixDef = new b2FixtureDef;
fixDef.density = 10.0;
fixDef.friction = 0.5;
fixDef.restitution = .5;
fixDef.shape = new b2PolygonShape;
fixDef.shape.SetAsBox(.3,.3);
var box1 = world.CreateBody(bodyDef);
box1.CreateFixture(fixDef);
//box2
var bodyDef2 = new b2BodyDef;
bodyDef2.type = b2Body.b2_dynamicBody;
bodyDef2.position.Set(14,8);
var fixDef2 = new b2FixtureDef;
fixDef2.density = 10.0;
fixDef2.friction = 0.5;
fixDef2.restitution = .2;
fixDef2.shape = new b2PolygonShape;
fixDef2.shape.SetAsBox(.3,.3);
var box2 = world.CreateBody(bodyDef2);
box2.CreateFixture(fixDef2);
//box3 - static
var bodyDef3 = new b2BodyDef;
bodyDef3.type = b2Body.b2_staticBody;
bodyDef3.position.Set(11,8);
var fixDef3 = new b2FixtureDef;
fixDef3.friction = 0.5;
fixDef3.restitution = .2;
fixDef3.shape = new b2PolygonShape;
fixDef3.shape.SetAsBox(.3,.3);
var box3 = world.CreateBody(bodyDef3);
box3.CreateFixture(fixDef3);
//create a ground
var holderDef = new b2BodyDef;
holderDef.type = b2Body.b2_staticBody;
holderDef.position.Set(10, 14);
var fd = new b2FixtureDef;
fd.shape = new b2PolygonShape;
fd.shape.SetAsBox(10,1);
var ground = world.CreateBody(holderDef);
ground.CreateFixture(fd);
// joints
var ropeJointDef = new b2RopeJointDef();
ropeJointDef.bodyA = box1;
ropeJointDef.bodyB = box2;
ropeJointDef.localAnchorA = new b2Vec2(0,0);
ropeJointDef.localAnchorB = new b2Vec2(0,0);
ropeJointDef.maxLength = 6;
ropeJointDef.collideConnected = true;
world.CreateJoint(ropeJointDef);
var debugDraw = new b2DebugDraw();
debugDraw.SetSprite ( document.getElementById ("canvas").getContext ("2d"));
debugDraw.SetDrawScale(30); //define scale
debugDraw.SetFillAlpha(0.3); //define transparency
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, 10, 10);
world.DrawDebugData();
world.ClearForces();
};
</script>
</html>