Box2dWeb 모바일 마루 만들기

이번에는 box2dweb로 직동 인터페이스를 만듭니다.
직동 이음매는 모터를 통해 평행으로 이동하는 방향으로 이동할 수 있다.
이른바 피스톤 운동.
이번 캡처는
활동하는 바닥을 만들어 봤어요.

이번의 모든 소스 코드는
test.html

<canvas id="canvas" width="600px" height="420px" style="background-color:#333333;"></canvas>

<script type="text/javascript" src="Box2dWeb-2.1.a.3.min.js"></script>
<script type="text/javascript">

    // Box2Dオブジェクトを取得
    var b2Vec2 = Box2D.Common.Math.b2Vec2 // 2Dベクトル
     ,  b2BodyDef = Box2D.Dynamics.b2BodyDef // Body定義
     ,  b2Body = Box2D.Dynamics.b2Body // Body
     ,  b2FixtureDef = Box2D.Dynamics.b2FixtureDef // Fixture定義
     ,  b2Fixture = Box2D.Dynamics.b2Fixture // Fixture
     ,  b2World = Box2D.Dynamics.b2World // 物理世界
     ,  b2PolygonShape = Box2D.Collision.Shapes.b2PolygonShape // 衝突オブジェクトの形状（ポリゴン）
     ,  b2CircleShape = Box2D.Collision.Shapes.b2CircleShape  // 衝突オブジェクトの形状（円）
     ,  b2PrismaticJointDef = Box2D.Dynamics.Joints.b2PrismaticJointDef // 直動ジョイント
     ,  b2DebugDraw = Box2D.Dynamics.b2DebugDraw // デバッグ描画


    // 世界を作る
    var world = new b2World(new b2Vec2(0,10), true);

    ////////////////////////////////////

    //box1      
    var bodyDef = new b2BodyDef;
    bodyDef.type = b2Body.b2_dynamicBody;
    bodyDef.position.Set(7,8);

    var fixDef = new b2FixtureDef;
    fixDef.density = 100.0;
    fixDef.friction = 1.0;
    fixDef.restitution = .5;        
    fixDef.shape = new b2PolygonShape;
    fixDef.shape.SetAsBox(5,.5);

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

    //box2
    fixDef.density = 1000.0;
    fixDef.shape.SetAsBox(.5,.5);
    bodyDef.position.Set(8,5);
    var box2 = world.CreateBody(bodyDef);
    box2.CreateFixture(fixDef);

    // 直動ジョイント        
    var worldAxis = new b2Vec2(1, 0);
    var prismaticJointDef = new b2PrismaticJointDef();
    prismaticJointDef.Initialize(world.GetGroundBody(), box1, box1.GetWorldCenter(), worldAxis);     
    prismaticJointDef.lowerTranslation = -5.0;
    prismaticJointDef.upperTranslation = 5.0;
    prismaticJointDef.enableLimit = true;
    prismaticJointDef.maxMotorForce = 20;
    prismaticJointDef.motorSpeed = 5;
    prismaticJointDef.enableMotor = true;
    var prismaticJoint = world.CreateJoint(prismaticJointDef);



    ////////////////////////////////////


    // デバッグ描画の設定      
    var debugDraw = new b2DebugDraw();
    debugDraw.SetSprite ( document.getElementById ("canvas").getContext ("2d"));
    debugDraw.SetDrawScale(30);     //描画スケール
    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, 10, 10); // 物理世界を更新する
        world.DrawDebugData(); // デバック描画
        world.ClearForces(); // 物理世界上の力をリセットする

        if(box1.GetPosition().x >= 8){
            prismaticJoint.SetMotorSpeed(-5);
        }
        if(box1.GetPosition().x <= 3){
            prismaticJoint.SetMotorSpeed(5);
        }
    };

</script>

직선 조인트를 사용하기 위해
객체 작업

     var b2PrismaticJointDef = Box2D.Dynamics.Joints.b2PrismaticJointDef // 直動ジョイント

직동 이음매를 하는 곳입니다.
월드악시스는 가동 방향입니다.
이번에는 Initialize 함수로 물리적 세계를 연결합니다.
lowerTranslation은 이동 거리의 최소값입니다
upperTranslation은 이동 거리의 최대치입니다.
이 값을 초과하면 멈춰라.
(멈출 것 같지만 모터가 멈추지 않기 때문에 모터를 명확하게 제어하지 않으면 계속 힘을 준다.)
enableLimit 플래그를 사용하여 제한을 활성화합니다.
maxMotorForce는 모터의 최대치입니다.
모터스피드는 모터의 속도다.
enableMotor는 모터의 유효성을 나타냅니다.

    // 直動ジョイント        
    var worldAxis = new b2Vec2(1, 0);
    var prismaticJointDef = new b2PrismaticJointDef();
    prismaticJointDef.Initialize(world.GetGroundBody(), box1, box1.GetWorldCenter(), worldAxis);     
    prismaticJointDef.lowerTranslation = -5.0;
    prismaticJointDef.upperTranslation = 5.0;
    prismaticJointDef.enableLimit = true;
    prismaticJointDef.maxMotorForce = 20;
    prismaticJointDef.motorSpeed = 5;
    prismaticJointDef.enableMotor = true;
    var prismaticJoint = world.CreateJoint(prismaticJointDef);