Sign in to follow this  
Eisha

To stop an object going though another object

Recommended Posts

I am trying to stop an object to pass through another object but the ball(centre sphere) is still going through another ball(left sphere). I am trying to slide the sphere in the middle towards the left in speed as soon as it collides with the pink sphere. I have tried how to increase decrease speed of the blue sphere but it still passes though the centre sphere. My source code file is attached and can be found below. Please help me.
Thank You

3d.zip

Share this post


Link to post
Share on other sites

Hi @Eisha and welcome to the forum from me. Rather than providing a zip file which requires down loading, virus checking and running it would be so much easier to help you if you gave us a simple playground with two spheres and the code you are using. If your code has been set up using a createScene function it is easy to transfer this part to the playground. You can see the relationship between your own HTML code and playground code here https://doc.babylonjs.com/babylon101/first

Before you create the playground for us this page may be helpful https://doc.babylonjs.com/snippets/issues. It deals with a sphere hitting a wall but the issues are the same.

Share this post


Link to post
Share on other sites

Well said, @JohnK!  Making a playground that shows the problem... is ALWAYS the best way to help the helpers.

But, I was in a good mood, and Eisha is working with physics, which is difficult by itself.

Sooo... I treated us to a playground example.

https://playground.babylonjs.com/#2A3BE8#5

Lots of changes... lots of comments to learn-from, but really, Eisha did a good job!

See how I sort-of pasted the entire createScene() function from your zip... into the playground?  Just like JohnK stated.

Eisha didn't know that mesh often don't accept .position settings... AFTER they have gotten a physics impostor.  The mesh sometimes re-position fine, but their impostor stays in the previous position.  SO, the mesh becomes impostor-less, and won't do physics collisions anymore.

After a mesh gets a physics impostor, the impostor (a ghost beneath the REAL mesh)... likes to have FULL CONTROL over the mesh.  That way, the physics impostor/engine can TRY to make it act like a real-world object.  Generally, we only use applyImpulse or applyForce or setLinearVelocity or setAngularVelocity... to position/rotate mesh that have impostors.

In this playground, all balls fall to the ground.  Click on any sphere... causes one of the balls to start shooting at others.  They all roll and collide well.

In lines 86-99, I DO force some positions.  If ANY sphere goes more than 20 units below ground, we move all three spheres back to starting positions, and "reset" (forceUpdate) their impostors (which removes any residual linear or angular velocity).

This should be a good playground to play-with, and I think Eisha might be moving full-speed ahead, once again.  Feel free to ask questions and share your progress/issues, Eisha.  I hope this is helpful.  Hello and thanks to you, too, John!  I hope you (and all forum users) are doing well.

Note:  There is one ODD thing happening to me.... in this PG.  After an edit to the playground code, and RUN again, I get a..

Active camera not set - babylon.js:1:424738
    E.prototype.createPickingRayToRef
    E.prototype.createPickingRay
    E.prototype.pick
    createScene

Not sure why.  hmm.

Share this post


Link to post
Share on other sites
7 hours ago, JohnK said:

Hi @Eisha and welcome to the forum from me. Rather than providing a zip file which requires down loading, virus checking and running it would be so much easier to help you if you gave us a simple playground with two spheres and the code you are using. If your code has been set up using a createScene function it is easy to transfer this part to the playground. You can see the relationship between your own HTML code and playground code here https://doc.babylonjs.com/babylon101/first

Before you create the playground for us this page may be helpful https://doc.babylonjs.com/snippets/issues. It deals with a sphere hitting a wall but the issues are the same.

Hello @JohnK thanks for the response. Sure I will be pasting the code instead of sharing the zip file here. The middle brick sphere is just passing touching the red sphere. I don't understand how to make the ball pass fast in a smooth way without getting it touched with the red sphere. Please help me. So the code so far I have is here:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <title>Babylon Template</title>
        <style>
            html, body {
                overflow: hidden;
                width: 100%;
                height: 100%;
                margin: 0;
                padding: 0; 
            }

            #renderCanvas {
                width: 100%;
                height: 100%;
                touch-action: none;
            }
        </style>
        <script src="https://cdn.babylonjs.com/cannon.js"></script>
        <script src="https://cdn.babylonjs.com/babylon.js"></script>
        <script src="https://preview.babylonjs.com/loaders/babylonjs.loaders.min.js"></script>
        <script src="https://code.jquery.com/pep/0.4.3/pep.js"></script>
    </head>
   <body>
    <canvas id="renderCanvas" touch-action="none"></canvas> //touch-action="none" for best results from PEP
    <script>
        var canvas = document.getElementById("renderCanvas"); // Get the canvas element 
        var engine = new BABYLON.Engine(canvas, true); // Generate the BABYLON 3D engine

        /******* Add the create scene function ******/
        var createScene = function () {

            // Create the scene space
            var scene = new BABYLON.Scene(engine);

            // Add a camera to the scene and attach it to the canvas
            var camera = new BABYLON.ArcRotateCamera("Camera", Math.PI / 2, Math.PI / 2, 10, new BABYLON.Vector3(0,0,0), scene);
            camera.attachControl(canvas, true);

            // Add lights to the scene
            var light1 = new BABYLON.HemisphericLight("light1", new BABYLON.Vector3(1, 1, 0), scene);
            var light2 = new BABYLON.PointLight("light2", new BABYLON.Vector3(0, 1, -1), scene);

            // Add and manipulate meshes in the scene
            var sphere1 = BABYLON.MeshBuilder.CreateSphere("sphere1", {diameter:2}, scene);
            sphere1.position.y = 0.85;

            var sphere2 = BABYLON.MeshBuilder.CreateSphere("sphere2", {diameter:3}, scene);
            sphere2.position = new BABYLON.Vector3(0,0,0);
            sphere2.position.x=-3;
            sphere2.position.y = 0.55;

            var pinkMaterial = new BABYLON.StandardMaterial("pinkMaterial",scene);
            sphere2.material = pinkMaterial;
            pinkMaterial.diffuseColor = new BABYLON.Color3(1,.3,.6);

            var brickMaterial = new BABYLON.StandardMaterial("brickMaterial",scene);
            brickMaterial.diffuseTexture = new BABYLON.Texture("pexels-photo-761142.jpeg",scene);
            sphere1.material = brickMaterial;
            
            var ground = BABYLON.MeshBuilder.CreateGround("ground", {height: 100,width:100}, scene);
            ground.position = new BABYLON.Vector3(0,-2.5,-20);
            
            var grassMaterial = new BABYLON.StandardMaterial("pexels-photo-413195.jpeg",scene);
            ground.material = grassMaterial;
            grassMaterial.diffuseTexture = new BABYLON.Texture("pexels-photo-413195.jpeg",scene);
            grassMaterial.diffuseTexture.uScale = 10;
            grassMaterial.diffuseTexture.vScale = 4;    
            scene.clearColor = new BABYLON.Color3(.8,.9,1);

            //Sphere 3 the blue sphere later on red
            var sphere3 = BABYLON.MeshBuilder.CreateSphere("sphere3", {diameter:2}, scene);
            sphere3.position = new BABYLON.Vector3(0,0,0);
            sphere3.position.x=3;
            sphere3.position.y = 0.55;
            var blueMaterial = new BABYLON.StandardMaterial("blueMaterial",scene);
            sphere3.material = blueMaterial;
            blueMaterial.diffuseColor = new BABYLON.Color3(.4,.3,4);

           var physicsPlugin = new BABYLON.CannonJSPlugin();         
            var gravityVector = new BABYLON.Vector3(0, -9.81, 0);
            scene.enablePhysics(gravityVector, physicsPlugin);
            sphere2.physicsImpostor = new BABYLON.PhysicsImpostor(sphere2, BABYLON.PhysicsImpostor.SphereImpostor, { mass: 1, restitution: 0.8 }, scene);
            ground.physicsImpostor = new BABYLON.PhysicsImpostor(ground, BABYLON.PhysicsImpostor.BoxImpostor, { mass: 0, restitution: 0.9 }, scene);
            sphere2.physicsImpostor.applyImpulse(new BABYLON.Vector3(1,2,0),
            sphere2.getAbsolutePosition());

            sphere1.physicsImpostor = new BABYLON.PhysicsImpostor(sphere1, BABYLON.PhysicsImpostor.SphereImpostor, { mass: 1, restitution: 0.9 }, scene);
            sphere1.physicsImpostor.applyImpulse(new BABYLON.Vector3(3,1,-0.55),
            sphere1.getAbsolutePosition());
    
            var velocity = 0.005;
            var dir = -1; //for red ball to change direction
            var dir2 = -4; //for pink ball to change direction
            scene.registerAfterRender(function () {     
                sphere3.position.y += velocity * dir;    
                sphere2.position.x += velocity * dir2;
                    
                if (sphere3.intersectsMesh(ground, false)) { 
                    sphere3.material.diffuseColor = new BABYLON.Color3(1, 0, 0);
                    dir = 1.0;
                 } 
                 if(sphere3.position.y > 3){
                     dir = -1;
                 }

                 if(sphere2.intersectsMesh(sphere1,false)){
                     //sphere2.material.emissiveColor = new BABYLON.Color3(1,0,0,1);
                     dir2 = -4;         
                 }
            });

            //Add applyimpulse method
            window.addEventListener("click", function () {
                var pickResult = scene.pick(scene.pointerX, scene.pointerY);
                pickResult.pickedMesh.material.diffuseColor = new BABYLON.Color3(0, 1, 0);
                sphere2.physicsImpostor.applyImpulse(new BABYLON.Vector3(0,10,-5.1),
                sphere2.getAbsolutePosition());
            });

            return scene;
        };
        /******* End of the create scene function ******/    

        var scene = createScene(); //Call the createScene function

        // Register a render loop to repeatedly render the scene
        engine.runRenderLoop(function () { 
                scene.render();
        });

        // Watch for browser/canvas resize events
        window.addEventListener("resize", function () { 
                engine.resize();
        });
    </script>
   </body>
</html>

Share this post


Link to post
Share on other sites
2 hours ago, Wingnut said:

Well said, @JohnK!  Making a playground that shows the problem... is ALWAYS the best way to help the helpers.

But, I was in a good mood, and Eisha is working with physics, which is difficult by itself.

Sooo... I treated us to a playground example.

https://playground.babylonjs.com/#2A3BE8#5

Lots of changes... lots of comments to learn-from, but really, Eisha did a good job!

See how I sort-of pasted the entire createScene() function from your zip... into the playground?  Just like JohnK stated.

Eisha didn't know that mesh often don't accept .position settings... AFTER they have gotten a physics impostor.  The mesh sometimes re-position fine, but their impostor stays in the previous position.  SO, the mesh becomes impostor-less, and won't do physics collisions anymore.

After a mesh gets a physics impostor, the impostor (a ghost beneath the REAL mesh)... likes to have FULL CONTROL over the mesh.  That way, the physics impostor/engine can TRY to make it act like a real-world object.  Generally, we only use applyImpulse or applyForce or setLinearVelocity or setAngularVelocity... to position/rotate mesh that have impostors.

In this playground, all balls fall to the ground.  Click on any sphere... causes one of the balls to start shooting at others.  They all roll and collide well.

In lines 86-99, I DO force some positions.  If ANY sphere goes more than 20 units below ground, we move all three spheres back to starting positions, and "reset" (forceUpdate) their impostors (which removes any residual linear or angular velocity).

This should be a good playground to play-with, and I think Eisha might be moving full-speed ahead, once again.  Feel free to ask questions and share your progress/issues, Eisha.  I hope this is helpful.  Hello and thanks to you, too, John!  I hope you (and all forum users) are doing well.

Note:  There is one ODD thing happening to me.... in this PG.  After an edit to the playground code, and RUN again, I get a..

Active camera not set - babylon.js:1:424738
    E.prototype.createPickingRayToRef
    E.prototype.createPickingRay
    E.prototype.pick
    createScene

Not sure why.  hmm.

Hello @Wingnut thank you so much for a great explanation from your side. I appreciate it 🙂

Share this post


Link to post
Share on other sites
21 minutes ago, Eisha said:

Sure I will be pasting the code instead of sharing the zip file here.

Still seems to be a little misunderstanding. This is the forum. The playground is a great place where you can write or paste code that can be edited and the effects seen immediately.

@Wingnut gave you a link to a playground he created for you https://playground.babylonjs.com/#2A3BE8#5 it is very simple for you (or anyone else) to make changes and hit the Run button to see the effect of these changes. Keep making changes and hit that Run button 'til you get to a point where you need more help. Just hit the Save button. The playground you were editing is still safe - the new playground will have a number (after the #) one higher than the one you were playing with. Copy the address of your new playground and paste this straight into the forum. Now we can help by editing this playground, saving it and pasting the link for you to see what we have done. To get back to an earlier playground you were working with just change the number after # to a lower one.

It can also be a good idea to bookmark for your self any playgrounds you might want to go back to as it is not easy to remember which number between the two #s goes with which playground.

When you want a blank playground the new button will give you a starter template nd clear will give you a completely blank playground.

For now have a play around with the playground Wingy posted see what you can achieve towards your goal and then ask more questions.

Share this post


Link to post
Share on other sites
2 hours ago, Eisha said:

Sure I will be pasting the code instead of sharing the zip file here.

Yeah, Eisha... thx.  Umm.... JohnK meant that you should paste the createScene() function from your home/zipped code... into the playground editor.  Not paste into forum. 

But it's ok, we move ahead.  As John says, play with the playground... make some edits and more RUNs... more SAVES, goof around.  Try to show us, tell us... things you are having problems-with.

Learning to do some coding in the playground/editor... will become super-handy.  It is the best friend of many BabylonJS developers.  I love it.  I would be lost without it.  it takes a little time, patience, and practice... to learn to operate it well.

I think, if you just goof around with the scene for a bit, you will get better and better at driving physics.  I put physicsImpostors on all 3 spheres.  If you want to pass-thru a sphere, you must NOT have a physics impostor on the passed-through sphere.  As an alternative, I think there is also a "NoImpostor"... which is like a fake impostor that does nothing.  Try "NoImpostor" in-place-of "SphereImpostor"... should work.  Maybe.  :)

Also, you might want to look at "ActionManager" for a different/more-modern way to watch-for mesh-picks.  (no needed window event listening/unlistening).  You can easily put an ActionManager on each ball.  The whole scene can have an actionManager, too.  It is a nice tool.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.