2

落ちる箱のスクリーンショット

期待される結果: ボックスが地面に落ち、「ボックスが地面に落ちた」というアラート ボックスが生成されます。

何が起きているか: アラート ボックスが作成されていません。関連する JavaScript コンソール ログも衝突時に生成されません。

github repoで小さなコード ベースを共有しています。クローンを作成して、Chrome ブラウザーで自分で実行できます。ソースコードの **** scripts/app.js **** ファイルのphysijsBox.addEventListener()部分を調べることができます。

var sceneObj = (function(){

    "use strict";

    Physijs.scripts.worker = "scripts/physijs_worker.js";
    Physijs.scripts.ammo = "ammo.js";

    var scene, camera, renderer
    var physijsBox, physijsGround

    function initScene(){
        scene = new Physijs.Scene();
        scene.setGravity = new THREE.Vector3(0, -50, 0);

        camera = new THREE.PerspectiveCamera(35, window.innerWidth/window.innerHeight , 1, 1000);
        camera.position.z = 100;

        renderer = window.WebGLRenderingContext ? new THREE.WebGLRenderer() : new THREE.CanvasRenderer();
        renderer.setSize(window.innerWidth, window.innerHeight);
        document.getElementById("webgl-container").appendChild(renderer.domElement);

        addPhysijsBox();
        addPhysijsGround();
        render();
    }

    function addPhysijsBox(){
        var myBoxMaterial = Physijs.createMaterial(
            new THREE.MeshBasicMaterial({
                color: 0xff00ff
            }),
            0,  // friction
            0.8 // restitution / bounciness
        );
        physijsBox = new Physijs.BoxMesh(new THREE.CubeGeometry(15,15,15), myBoxMaterial);
        physijsBox.position.set(0,30,10);
        physijsBox.rotation.set(0,50,90);
        scene.add(physijsBox);

        physijsBox.addEventListener('collision', function(
            theOtherObject, linearVelocity, angularVelocity, arg4
        ){
            console.log("box collided with something");
            if (theOtherObject.name == "ground"){
                alert("Box just hit the ground");
            }
        })
    }

    function addPhysijsGround(){
        var myGroundMaterial = Physijs.createMaterial(
            new THREE.MeshBasicMaterial({
                color: 0x008888
            }),
            0, // friction
            0.4 // restitution / bounciness
        );
        physijsGround = new Physijs.BoxMesh(new THREE.CubeGeometry(150, 3, 150), myGroundMaterial, 0);
        physijsGround.name = "ground";
        physijsGround.position.y = -15;
        scene.add(physijsGround);
    }

    function render(){
        scene.simulate();
        renderer.render(scene, camera);
        requestAnimationFrame(render);
    }

    window.onLoad = initScene();
    return scene;

})();

関連する PhysiJS ドキュメント:

4

1 に答える 1