Jump to content

Why don't the ball drop from gravity


MrPancakes
 Share

Recommended Posts

Hey all, someone could explain too me why the sphere don't drop when I start the scene. Do I need to add something else to it other then enabling gravity, maybe some mass? thanks in advance


import * as BABYLON from './node_modules/babylonjs/es6.js'

const canvas = document.getElementById('game-canvas')

const engine = new BABYLON.Engine(canvas, true)

const createScene = () => {

    const scene = new BABYLON.Scene(engine)

    const camera = new BABYLON.FreeCamera("FreeCamera", new BABYLON.Vector3(0, 0, -2), scene)

    camera.attachControl(canvas, true)

    const light = new BABYLON.PointLight('PointLight', new BABYLON.Vector3(1,10,1), scene)

    const sphere = new BABYLON.MeshBuilder.CreateSphere('Sphere', {}, scene)

    const box = new BABYLON.MeshBuilder.CreateBox('Box', {}, scene)

    box.position.x = 2

    scene.gravity = new BABYLON.Vector3(0, -1, 0)

    sphere.applyGravity = true

    return scene
}

const scene = createScene()

engine.runRenderLoop(() => {
    scene.render()
})

window.addEventListener('resize', () => {
    engine.resize()
})
Link to comment
Share on other sites

Hiya K!

    .applyGravity is really only for cameras.  It is part of a built-into BJS system for first-person-shooter games.  That system also includes .checkCollisions, .moveWithCollisions(), and mesh/cam .ellipsoid.  In general, it is used for cameras... falling, hitting ground, and hitting mesh (by cursoring) whose .checkCollisions = true;  This built-in system has no friction, mass, or restitution (bounce).

Now, about 3rd-party physics engines.  BabylonJS has two physics engines that it interfaces-with... OimoJS and CannonJS.  They are available as external files, which are already included into our fantastic BabylonJS Playground application.  So, let's play with one. 

https://www.babylonjs-playground.com/#110CDL#5

Here's a great little heavily-commented playground... which uses BOTH camera.applyGravity system, AND Oimo physics engine.

When you first run the scene, you will see the camera drop to the ground and stop... without a bounce.  No 3rd-party-authored physics engine used for the camera drop.  But, SIMILAR-TO physics engines, there are some "impostors" involved.  They are ground.ellipsoid and camera.ellipsoid.  You are allowed to change their size/shape, somewhat (see sidenote). 

Sphere.ellipsoid exists, too, but we have turned-on the Oimo physics engine for sphere, so we will be using a DIFFERENT kind of impostor for him... called a physics impostor.  I wrote a recent post with examples of HOW to "move" a mesh with a physicsImpostor installed.

Ok, back to OUR playground example... both the ground and the sphere... have physicsImpostors activated, and the scene has physics enabled... so the ball is bouncing, thanks to Oimo.

Ground, camera, and sphere... have .ellipsoid property, but again... not used by physics engines (for sphere bouncing on ground).

Just for fun, let's make the camera.ellipsoid much taller.

https://www.babylonjs-playground.com/#110CDL#4

See lines 74-76.  The camera.ellipsoid started with a 0.5, 1.0, 0.5 ellipsoid dimension.  We made that 1.0 into 25.0.  Wow!

Notice how the camera hit the ground much sooner, and stays 50-units above the ground?  The camera STARTS at 80 units above ground (line 9).

Notice I said 50 units above ground and not 25 units?  That's because...  the values of .ellipsoid are "radii".  The values are the radius of the ellipsoid.  So with an ellipsoid.y = 25, the total height of the ellipsoid is 50.  Understand?  Cool.

sidenote:  I tried adjusting ground.ellipsoid to a height of 25/50, but that didn't work.  Apparently, with camera.applyGravity... it ignores the size of ground.ellipsoid.  I think I know why... but we'll talk about that on another day.

The main thing... is to understand WHEN and WHERE to use the BJS built-in collision system (.ellipsoid, .checkCollisions, .moveWithCollisions(), cam.applyGravity, and cam._needMoveForGravity), and... WHEN and WHERE to use physics engines.  It takes some time/experience to know when it is best to use one or the other (or both). 

BJS-built-in collision system is much much faster than physics engines, but no mass, friction, and restitution (bounce) calculations.  Physics engines are much more "realistic", but more performance costly.

Also, you COULD "fake" the gravity for the sphere (without using EITHER collision/physics system).

https://www.babylonjs-playground.com/#110CDL#3

See the little "render loop" code in lines 33-37?  Yep, we slowly drop the position.y of sphere... until it is 5 units above ground.  No ellipsoids, no physics engines.  We still have .checkCollisions on camera and ground... so the camera drop still works.

Okay, that's a whole lot of learning in a single comment, eh?  It is easy for users to get the two systems confused with each other.  But both systems... are pretty cool... and handy.  Even the fake gravity for sphere... is useful.  :)  I hope this helps.  Study and experiment with that playground scene.  Grab a zip and take it home... see if you can scare the dog.  :)  Make edits and more saves... you can't hurt ANYTHING in the playground.  When you discover something cool, save the playground, copy the URL, and show it to us.  We LOVE looking at scenes, especially playground-based scenes.

Have faith-in and patience-with yourself.  And have FUN!  In no time, you will be a forces and collisions expert.

Link to comment
Share on other sites

13 hours ago, Wingnut said:

Hiya K!

... very long and helpful answer

Thank you very much Wingnut for that very lengthy and helpful post. I assumed that (.ellipsoid, .checkCollisions, .moveWithCollisions(), .. etc.) was CannonJS just abstracted away.
The demos will sure help me get on my merry way, thanks again.

/may the force be with you

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...