babylonjs Steering

[DesignVibe]

Hi all

I am quite the newbie for Babylon.js but absolutely love it ("thank you creators and contributors). I have searched numerous playgrounds / forums and found quite a few things to get me started and done well so far but came to a stopping point when realizing the complexity of steering.

I was wondering how to recreate the effect of steering from left or right like the examples below:

http://bb-kirchengemein.de/car.html

http://www.visualiser.fr/Babylon/Drift/default.htm

When steering left the wheels turn/pivot toward a max angle then the wheels stay at that position until keyup, on which the wheels then turn/pivot back to their first position, likewise when steering right but in the opposite direction.

I don't know if I should be looking at animations, physics, or good mathematics / JavaScript.

What I'm trying to create is the effect of a plane when banking left or right at a max angle of 22 degrees, to then go back to zero / original axis when keyup.

A very basic playground has been created but is far from completion.

http://babylonjs-playground.com/#22SLM4#2

Any help or suggestions would really be helpful 

 

[Wingnut]

Hello DesignVibe ... welcome to the BabylonJS forum, good to have you with us!

First, may I show you this link?  Bookmark that forever.    That is a link to the forum search, with all 5 of our forum 'nodes' activated (see the numbers at the end of the URL?  *nod*)

Its a great place to go mining for info.  Some terms that you might try...  flight sim, turn the mesh, vehicle, and I think it would be wise to visit our tutorials .  Scroll down to see the long list, but take note of #44... an EASY rotations tutorial that mentions mesh.rotate(...), a super-powerful way to get things turned.  If you want to advance further, you can take-on the very advanced #39.

Also, http://www.babylonjs-playground.com/#IRNRP#2 is a pretty good playground with a vehicle that drives with WASD keys.  I don't like the use of 'window' in there, though.  That demo can be done without using 'window'.  Also, there's a less-than-pro flight sim that somebody cobbled together... http://www.babylonjs-playground.com/#2FIXEM#1

Although that flight sim was for testing cameras (lots of camera BS in it), there is still some "good stuff" in the lines 400+ area.

A chap named @DellaFree built a flying game in a playground... it is pretty sweet.  http://www.babylonjs-playground.com/#6FFQW#16

A chap named @DigitalHilsone started a thread... which led to all sorts of rotation/aiming work.  Click here, if you wish. 

A BJS "founder" and power-user named @Temechon maintains a fine bucket-o-knowledge, too.  Have a visit.

Ok, that should get you turning and rolling, at least somewhat.  Again... welcome aboard, and thanks for the kind words about BJS!  We're here to help, don't hesitate to ask.  Party on!

[DesignVibe]

Absolutely fantastic. thank you so much for your help Wingnut.
I've really enjoyed your forum posts and demonstrations. especially the flying fourposter bed.

Tip of the hat to you sir =) 

[Wingnut]

Wow, what nice words, thanks.  I think I'm going to enjoy having you around.

Fellow forumers... notice the "tip of the hat" comment, AND DV's emblem is a fellow tipping a hat?  Too cool! 

[RaananW]

Want a car? you got a car! http://www.babylonjs-playground.com/#UGMIH#3

This is partly using the new physics engine architecture and partly using modified native cannon.js code. It is planned to be integrated as a native option in the physics engine, so you could use OimoJS as well to create a simple car.

Drive with your arrow keys, flip the car with a mouse click.

There is, of course, more work to do. I actually didn't want to show this demo, but since you asked, and since I am working on it, it fits.

 

[DesignVibe]

wow, nice one. Thank you Raanan. I'm really glad you showed us it. I feel like the rock biter driving this car .

 

[DesignVibe]

So how would you rotate the front wheels so that the movement doesn't snap to the max angle but glides gently toward the max angle?

[RaananW]

Notice that those are just impostors. You can hide them, put your own meshes (that actually look nicer) and "rotate" them according to the sphere's impostor rotation.

You could also very simply "rotate left" when someone presses the left key, and right when the right key is pressed, ignoring the "real" rotation of the spheres. Once you make the separation between design and physics, you will have the best result you could achieve  

Just as an example (part of the monthly challenge) - http://raananweber.com/basketball/ . The ball is an impostor covered with a different mesh, and the board, pole etc' are simply hidden impostors. What's on top is just for the scene to be nicer.

[DesignVibe]

Oh this is brilliant. really do thank you for your help @Wingnut and @RaananW. I've been trying to figure this out for weeks 

[Wingnut]

Raanan, you never cease to amaze me.  Great car, and great basketball, too.

Recently, when you said "Only a few days remaining" for your demo challenge...  I thought... "Hey, I wonder how fast I can make three walls with a meshImpostor waste basket in the corner, and a crumpled ball of paper... with a sphere impostor."  Wastebasket(-ball), 1.0.  hehe.

I know you mentioned "horse" in other posts, saying that you had built a version using multiple impostors on the rim.  But, I never expected your half-court and basketball to look/work THAT GREAT!  Coooooool.  Look at that ball bounce!  NICE! 

You win the challenge, and so do the other applicants... because they are all enjoying playing horse on your half-court, now, and no longer doing any work. 

It is also the beginnings of "Artillery Duel" and "Howitzer Hell"... funnery with gunnery!  Lob'n'Boom!  Arcade shooters!  You name it.  Yum!

By chance, did you use a spring instead of applyImpulse?  (I can check, too).  I've never used a spring, yet, but Fenomas mentioned starting physics motion... using springs, and that gave me a little physics woody.    Maybe you used the "apply a force" that @schteppe spoke-of, too.  Groundbreaking!

For those who don't know Schteppe, he is "the man" who wrote CannonJS physics engine, and he recently visited us, and gave us a few power tips and pointers, which I think Raanan instantly utilized.  The speed and fluidity of the basketball bouncing... sort of indicates that Raanan has been successful in the recent BJS->CannonJS interface refactor.

Hey DV... I only searched for playgrounds and I didn't code anything.  (I don't deserve any thanks.)   But Raanan... phew... excellent.  His car demo might be THE FIRST working heightMap terrain-jumping vehicle that has EVER worked in BJS, AND he got that puppy into a playground!  Holy crapolas!  I bookmarked that thing SO HARD... that I broke-off a piece of my browser window!  :)...   (<-- drooling)

Now DV is going to flesh it out, I bet.  Monster Truck 1.0.  Yeah!  Or may... Logging Truck - Rocky Mountain Challenge!  wow!

[DesignVibe]

Hahaha. I thank the both of you as all information is helpful to give better direction and understanding on a topic.