1
\$\begingroup\$

I created a video that describes the problem since it very hard to explain it. Basically, using physi.js, I am applying random impulse on the object. In the video, at 0:17 the problem begins when the object lands not entirely correct. What am I doing wrong and how this problem can be avoided? There is the js code:

$(function () {
Physijs.scripts.worker = physijsWorkerFile;
Physijs.scripts.ammo = ammoFile;

var renderer
    , scene
    , camera
    , cylinder
    , clock;

function init() {
    var container = $('#webgl-container');
    width = container.width();
    height = container.height();

    renderer = window.WebGLRenderingContext ? new THREE.WebGLRenderer({ alpha: true }) : new THREE.CanvasRenderer();
    renderer.setSize(width, height);
    container.append(renderer.domElement);

    scene = new Physijs.Scene();
    scene.setGravity(new THREE.Vector3(0, -50, 0));
    scene.addEventListener('update', function () {
        requestAnimationFrame(update);
        renderer.render(scene, camera);
    });

    camera = new THREE.PerspectiveCamera(35, width / height, 1, 1000);
    camera.position.z = 190;
    camera.position.y = 200;
    camera.rotation.x = degToRad(-32);
    scene.add(camera);

    clock = new THREE.Clock();

    initObjects();

    $('#applyImpulse').click(function () {
        var force = new THREE.Vector3(0, getRandomInt(20, 30), 0);
        var offset = new THREE.Vector3(getRandomInt(5, 10), 0, getRandomInt(10, 15));
        cylinder.applyImpulse(force, offset);
    });
}

function initObjects() {
    var surfaceMaterial = Physijs.createMaterial(
                new THREE.MeshBasicMaterial({ color: 0xFF0000, sides: THREE.DoubleSide })
                , 0
                , 0
            );
    var surface = new Physijs.BoxMesh(new THREE.BoxGeometry(200, 200, 4), surfaceMaterial, 0);
    surface.rotation.x = degToRad(90);
    scene.add(surface);
    cylinder = new Physijs.CylinderMesh(new THREE.CylinderGeometry(5, 5, 1, 32), Physijs.createMaterial(
               new THREE.MeshBasicMaterial({
                   color: 0x0000ff
               })
               , 0
               , 0
           ), 1.5);
    cylinder.position.y = 10;
    cylinder.addEventListener('collision', onCoinCollision);
    scene.add(cylinder);
}

function update() {
    var delta = clock.getDelta();
    scene.simulate(delta);
}

function run() {
    init();
    update();
}

function onCoinCollision(other_object, relative_velocity, relative_rotation, contact_normal) {

}

function degToRad(input) {
    return (input * (Math.PI / 180));
};

function getRandomCylinderXRotation() {
    return (degToRad(getRandomInt(0, 2) * 180));
}

function getRandomCylinderYRotation() {
    return (degToRad(getRandomInt(1, 360)));
}

function getRandomInt(min, max) {
    return Math.floor(Math.random() * (max - min)) + min;
};
window.onload = run; });
\$\endgroup\$

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.