Various Questions

[Valik]

Hi,

i tried to create a simple game where u can move a player over a mesh with clicks. i browsed already the realted topics in this forum and took as much i could from there.

the world should be a simple island and i took the rabbit from the samples as the player. all files here:

 

https://www.dropbox.com/sh/9o3qq6zv2zt9qjc/AABZZrUQQ1dTYC3WA-xJPyv_a?dl=0%2C

 

now there are few things i got to ask:

 

1. click to move: i tried few things to get the player turning to the click like e.g. in polycraft. best result was that the rabbit was always turning his back to the click XD

 

2. pathfinding: if we place things like trees on the ground, how to get the rabbit move around them automatically? is there anything built-in from babylon for pathfinding or anyone already tried pathfinding.js in 3D context?

 

3. gravity: which way is better? physics or move with collision and apply the gravity like in the code? i would like to have a linear moving the wohle time, in example when the rabbit goes up.

 

I think this would be enough for the beginning, any suggestions are welcome

[iiceman]

Hi Valik and welcome to the forum.

I didn't try the code you provided yet, but here are some quick hint anyway:

1. http://p215008.mittwaldserver.info/moveWithCollisions/ did that a while ago and tried to calculate the rotation. Not sure what exactly I did there but it seems to work. Maybe you can try it out and if you have question let me know and I try to answer.

                        // rotate avatar			var v1 = new BABYLON.Vector3(0,0,1);			var v2 = moveVectorNormalized;			var productVector = BABYLON.Vector3.Dot(v1, v2);			var productLength = v1.length() * v2.length();			var angle = Math.acos(productVector / productLength);			if(!isNaN(angle)) {				if(moveVectorNormalized.x<0) angle = angle * -1;				// calculate both angles in degrees				var angleDegrees = Math.round(angle * 180/Math.PI);				var playerRotationDegress = Math.round(meshPlayer.rotation.y * 180/Math.PI);				// calculate the delta				var deltaDegrees = playerRotationDegress - angleDegrees;				// check what direction to turn to take the shotest turn				if(deltaDegrees > 180){					deltaDegrees = deltaDegrees - 360;				} else if(deltaDegrees < -180){					deltaDegrees = deltaDegrees + 360;				}				var rotationSpeed = Math.round(Math.abs(deltaDegrees)/8);				if(deltaDegrees > 0){					meshPlayer.rotation.y -= rotationSpeed * Math.PI/180;					if(meshPlayer.rotation.y < -Math.PI){						meshPlayer.rotation.y = Math.PI;					}				}				if(deltaDegrees < 0 ) {					meshPlayer.rotation.y += rotationSpeed * Math.PI / 180;					if(meshPlayer.rotation.y > Math.PI){						meshPlayer.rotation.y = -Math.PI;					}				}			}

2. I like pathfinding js it always worked great... in 2D. I never actually tried in 3D, but I am planing to. On its github page it says:

Quote

Note that this project only provides path-finding algorithms for 2D space. If you need to work in a 3D environment, then you may use @schteppe's fork.

schteppes fork allows you to define the neighbour nodes yourself. I used that for a hex tile grid where the normal 4 (or with diagonals 8) just didn't fit. I am pretty sure you can do alot of good things with it in 3D, but it might not be super easy. Maybe somebody else has a better diea on how to handle pathfinding with babylon.

3. you can check this simplified version of number 1. (without the rotating thing): 

http://playground.babylonjs.com/#1NQTNE#11

http://playground.babylonjs.com/#1NQTNE#9

I think it's way easier with moveWithCollisions... it might not work perfect as well, but from my point of view you get alot more control about what is going to happen. So if you do not need "real physics" my recommendation is to stick with moveWithCollsions.

 

I hope this helps. As I said, if you have questions I'll try to answer as good as I can

[Valik]

Hi,

thank you for the answer and the smaple code. i had to do some changes but now the rabbit turns correct but runs always with his back in front.

seems that he is modeled backwards XD

 

More questions inc.

[reddozen]

This is what I recommend for path-finding. https://www.npmjs.com/package/recastjs

[dbawel]

Hi iiceman,

I couldn't get your first example to run in Chrome - didn't try other browsers.  These are the errors I receive - possibly a server issue?: 

http://p215008.mittwaldserver.info/moveWithCollisions/js/lib/jquery-2.1.1.min.js Failed to load resource: net::ERR_CONNECTION_RESET

http://p215008.mittwaldserver.info/moveWithCollisions/js/lib/babylon.2.0-beta.js Failed to load resource: net::ERR_CONNECTION_RESET

http://p215008.mittwaldserver.info/moveWithCollisions/js/lib/bootstrap/js/bootstrap.min.js Failed to load resource: net::ERR_CONNECTION_RESET

http://p215008.mittwaldserver.info/moveWithCollisions/js/lib/bootstrap/css/bootstrap.min.css Failed to load resource: net::ERR_CONNECTION_RESET

http://p215008.mittwaldserver.info/moveWithCollisions/js/lib/knockout-3.2.0.min.js Failed to load resource: net::ERR_CONNECTION_RESET

waterMaterial.js:42 Uncaught ReferenceError: BABYLON is not defined(anonymous function) @ waterMaterial.js:42(anonymous function) @ waterMaterial.js:115

script.js:1 Uncaught ReferenceError: $ is not defined(anonymous function) @ script.js:1

jquery-2.1.0.min.js:4 POST https://localhost:26143/skypectoc/v1/pnr/parse net::ERR_CONNECTION_REFUSED

 

Otherwise, I thought your code in this script is generally what valik might want with a little adaptation and collisions:

 

http://playground.babylonjs.com/#Z3UOX#8

 

DB

[iiceman]

@db, must have been a temporary issue. I am running on chrome, too and it still seems to work find. I checked and all the resources you have listed are still right where they are supposed to be

 

Can you check again and let me know if the problem persists?

[dbawel]

Hey iceman,

 

Works fine ... odd, as I even emptied my browser cache previously, but no dice.  I wish these problems could be identified, as it troubles me even more when they work with no explanation. I was hoping that in sending you the js console info, there might be some indication of why the scene wouldn't load.

[iiceman]

Well, I assume it was a problem with the server provider. But I really can't tell for sure. Who know... I am always happy if a problem dissappears all by itself

[Valik]

Hi again, i tried to add a minimap like in Temechons shooter tutorial.

i put it into the left bottom corner. now the problem is, that the picking works only on the last added camera with

scene.activeCameras.push(camera);

i can move the rabbit only over the minimap now. i tried to switch the order of adding the cams. the result was that

i could click on the ground normally but the minimap wasn't clickable then and laying under the normal camera.

i thought it might be like the cameras take the whole screen so i limited the viewports to have them not overlaying.

the problem still occured.

 

 

thanks in advance

sky.php

[GameMonetize]

Hello you can specify which camera to use when using scene.pick:

https://github.com/BabylonJS/Babylon.js/blob/master/src/babylon.scene.ts#L2024

[Valik]

Hi,

i tried it with the parameters but also i didn't got it to work. i reduced the whole thing to a playground:

 

http://www.babylonjs-playground.com/#184SZL

 

just comment out line 36 to see the normal functionality, except the performance problem, this did not occur in the normal code Oo

[GameMonetize]

Fixed it for you:

http://www.babylonjs-playground.com/#184SZL#2

 

Notes:

- I also used scene.cameraToUseForPointers to specify the main camera

- When using playgroundm no need for engine and canvas..this is why perfs were bad

[Valik]

Well, this is awesome. Thanks a lot for the help.

Are there possibilities to make both viewports clickable? I not, should i try to check where my mouse is and then set the pickable variables?

[GameMonetize]

Yes you need to define where your mouse is on the screen to change the pickable configuration

[dbawel]

Ah... very cool DK.  It's awesome when solutions come quickly by having several people building scenes together.  I doubt I could make much progress without "a little help from my friends." 

[GameMonetize]

That's why I think the bigger strength of babylon.js is its community!

[Valik]

Hi,

i played around with moving a mesh with keys and found this playground which was a nice example: http://www.babylonjs-playground.com/#LYCSQ#256

So.. i tried to figure out what is the best way to make a mesh moving by keys and make it jump (there was already a related thread but i couldn't find an answer for me).

The sphere in the playground is moving without physics using the babylon.js collision detection for the walls. it works very nice. i dont know how to create a jump in this case. the only way i know would be with physics and apply an impuls to the mesh. it would be cool if anyone who knows it better can explain how a jump without physics can be done or maybe correct my physics example. i created two reduced playgrounds on base of the one with the blob:

without phsics: https://playground.babylonjs.com/#3KG2TD#1

with physics: https://playground.babylonjs.com/#VGY2FA

the example with the physics has a nice jump(dont push space to the limit) but also makes strange things.

greets

[brianzinn]

6 hours ago, Valik said:

the example with the physics has a nice jump(dont push space to the limit) but also makes strange things.

One thing I noticed was that there is a continuous rotation after a jump.  I think if the rotation is minimal you could try to zero it out:
impostor.setAngularVelocity(Vector3.Zero())
Same with linear velocity, if no keys are pressed in a while or it is really slow?
impostor.setLinearVelocity(Vector3.Zero())

[Valik]

tried, did not help. the sphere keeps on rolling.

also tried stuff from here: