Move a mesh to a position with a specific distance

[jellix]

Hi,

I want to move the yellow box towards the white sphere but only by the distance of 8 "meters".

http://www.babylonjs-playground.com/#1RWE59#72 

It's important that the translation should always have a "stepsize" of e.g. 8 even if I translate the yellow box again towards the white sphere. So it wouldn't be a solution to scale or divide the vectors of the red and the white sphere.

Thanks for any hints!

 

[jellix]

Hello again ... thanks @Wingnut for asking me to explain my question in a more detailed way. 

So here is what I am looking for:

Let's think of a transportation lane that consists of several different modules with conveyor belts that are running in different speeds. Then there are trays that are moving along that lane. Some modules stop the trays for a short time before they are moving them forward again. And if you give a lot of trays into the lane it could happen that they get stuck because of a "traffic jam". So the goal is to simulate the floating process of the trays within a given time.

So the functional requirements of the modules are:

- every tray has to know the next module it has to go to. The time for that depends on the current module it is running on.

- After it reaches the target it has to go to the subsequent module.

- every tray has to look if the target module is free or if there is already another tray. If so it has to wait until the module is free again.

Now I want to calculate how many trays can run over the lane within one hour. For that I don't want to watch the lane for an hour in realtime but to simulate the floating in a speeded up version. Because of that I need to have kind of a scrubbing bar like in a videoplayer so that I can jump to minute 45 and see the current state of the overall simulation. Therefore it's important that the animation of every tray is not 'dynamic' and running in realtime but 'predicted' with start and end values where I can jump to timepoints.

That is the reason why I have a starting position of my tray and a target position of it and a 'delta'position in between related to a given time.

For now I have developed the lane with modules, the trays and a simulator that manages everything. By using TypeScript it's all programmed in a clean OOP way. Actually the current task is to move the trays like written above.

Hope that this explanation helps to understand my question.

[Wingnut]

Thx for the info, Jel.  Good job.

So... can the trays be "smart"?  Self-contained transport motors, with variable speeds, based upon on-board sensors checking if/not the road-ahead is clear? 

Do the trays need to check with ground control and tray traffic control tower... before arriving-at or departing-from a module? 

Or...  dumb trays, with tray-watching sensors along the conveyor borders, doing traffic management? 

Are modules in-touch-with all the trays and other modules... via RF digital link? 

Can modules "see" the (path-to) modules ahead?  Can they see conveyor "clearness" to all neighboring modules? 

Can modules place data on the trays... to be used in on-tray programs? 

Are the conveyors linear, or are there some branching decisions to be made along the way?   

Lots of questions, huh?  Cool project.

I'm trying to figure out if the trays will have batteries and Arduino boards on them, or not.    Can the trays build their own animations?  Wow!  FUN! 

But... predictable (fast-forward/rewind 1+ hour... slider)?   Ouch! 

Anyway, I'm just wasting space here.  Smarter people will comment soon... I'm sure.

[jellix]

Hey @Wingnut nice post :-)

Obiously you're as exited to the task as I am.

So thanks for your (very good) questions. I will describe the scenario more precisely so some things will get clear.

It is a checkpoint on an airport. Surely you know the lane where you pick up a plastic tray (just a simple box without any electronics inside). There you put in some stuff like mobile phone and so on. Push it manually on the passive rolls onto the first conveyor belt. So here it goes ... straight into the "scanner" whre the tray stips. the scanner looks for some dangerous stuff in your goods. And an operator checks the taken photo for about 15 - 30 seconds while the next tray is already coming. Maybe there are 150 passengers that all have to get their stuff over the lane. and the operator has to hurry up to get everything in flow.

So the only information is:

- Duration for the tray-movement from one module to the next one (with some random variables).

- number of passengers giving trays into the lane (with a given delay)

In theroy the simulator knows every module at every time and it could 'think' about the whole scenario. But I would suggest to let every tray act for itself. It just has to know whre it is at the moment and where to go. The simulator (that knows all the modules and trays) handles each tray and looks if the subsequent module is free to let the tray go.

So maybe these are some additional infos to my case :-)

It is a kind of hobby project at the moment. I just started today. I u want I could push it into my github account.

But at the moment there is just the question from my beginning post so I don't know if this would be nessecary.

[Wingnut]

Cool.  Yeah, there's a rather large "human factor" variable in that.  Tray pushing prowess/aptitude, eye-scanning time in the scanner viewer, and how much coffee buzz do they have (speed, etc).    And... does that tray scanner/pusher person... "cop an attitude" sometimes... cuz they looked at the length of the line-of-people, getting impatient?  heh.

Actually, its a motor-controlled belt that moves trays into the scanner, right?  *shrug*  Person-controlled?  Revers-able?  Or is that only for the suitcase scanner?  I can't remember.

Oh yeah, we're talking in a webGL forum... I forgot.  But yeah, BJS can "visualize" that in 3D... just fine.

What if I said... separate the "graphics"... from the formula/predicting "engine"?  (Okay, what if I TYPED that?) 

By keeping the two areas cleanly separated, you can visualize using 3D, SVG, html <table> and cells, etc. 

Even BJS Canvas2D trees, and other treeViews and listViews (xul and xaml for example). 

You'll have a tray-class object, surely.  It is a non-mesh, plain JS object.  Then put a property on it like .renderWebGL and that refs a BJS mesh (or the factory that generates such).  Another property .renderSVG = new genericSvgNode(this);   Same for .renderHtml property.

You know... keep your "things" separated from the "method of rendering it visually".    This will make your life easier, I believe.  *shrug*  And our thread can concentrate on the BJS stuff.  BJS (and JS) can definitely move the mesh version of the tray... a "set distance" on-demand. 

And... it seems that your conveyors are running along X or Z axes... perfect perpendicular, and not needing to change Y height.  So... yeah... move a tray a certain distance along Z-axis... easy... with animation (BABYLON.Animation.CreateAndStartAnimation), or simple in-renderLoop moving, or lots of other methods.  No problems.  Playgrounds galore.

Here is an old one from Mister Wingnut.  It uses a demented switch/case animation-step "sequencing".  It is sort of like a "short-animations manager"  It might be useful as a starter kit.  It was coded BEFORE actionManagers existed.  http://www.babylonjs-playground.com/#10P0IP#0

Here's one I stole, recently, and added some actionManager animations to the camera target.  You could use a similar method... to place an invisible box at a tray's next module target, and then perhaps use an action.execute() to send the tray animation on its way, whenever you chose.  (No clicks.  Actually action.executed by your new MasterScheduler class, perhaps.)    http://www.babylonjs-playground.com/#BXII#24

Okay, be well, good luck, have fun, talk soon.  I enjoy chatting with ya!  You have an inventor's mind. 

[jellix]

thanks for your kind words and your playground-links.

I absolutely agree to seperate the business logic from the visualisation. That is why I initially only asked for displaying an item at a specific position between two points  

I'm working as a developer for over 10 years now, started with 'ActionScript1' in macromedia flash, going over to ActionScript3 (then it was Adobe Flash) and finally object oriented programming. So I like TypeScript a lot and use it also for developing the business logic. It's fun to create the classes for the lane. modules, the tray and the overall simulator and so on ... and I would say that this is getting into the right way. But for displaying the trays in the right way I just have to learn a bit more about Vector3- and Matrix-functions and maybe a bit more trigonometry and so on. By the way, the trays don't just move in one direction. There a curves in the lane an kind of Y-modules that are splitting and combining lanes also. And there are kind of 'ramps' so there are also differend y-positions. But that should not be the problem.

So ...to get to and end of this thread ... I will try to get a result to the initial question and will have a deeper look to your suggestions. Finally I also want to tell you @Wingnut that you are the guy in this forum who always keeps up the great spirit, so it'salso fun for me to write with you:)

Have a nice weekend!

[Wingnut]

You too, thx!  No reason to end the thread, though.  Probably just taper-off our live-chat speeds.  (I have a tendency to topic-wander and get "starry-eyed" at times, so, I need to keep myself in-check).  But I foresee lots more comments in this thread, yet.  It's the weekend... folks are drunk and disorderly. 

There's lots of comments ahead, I suspect... especially involving the prediction/time-advancing-slider thing.  "Projecting" funcs.  Phew... heavy.  I'm glad YOU are a pro programmer.  The thought of that thing... gives me a brain tumor, and makes my dog start whining. 

[jellix]

Hi,

just for the archives, if anybody finds this thread in the future:

Of course the 'translate' function of the AbstractMesh-class is exactly what I was looking for.

Just didn't find it because I only looked in the Vector3, the Matrix and the Mesh-class.

[Wingnut]

Cool!  I have some questions for you, J. 

Here is Wingy's Crappy Flight Sim...

http://www.babylonjs-playground.com/#RVDXB#2

If everything went properly, you should see a green airplane fly past.

The #1 version of this playground... used mesh.translate() call in line 469... to move the airplane on one axis.

The #2 version (linked above) uses mesh.position.addInPlace() call in line 470... to do the move... on one (or two, or three) axes. 

You say that the trays need to move sideways and perhaps up/down, sometimes, yes?

Is it .translate's adjustable WORLDspace/LOCALspace... that makes it more desired than .addInPlace? 

I believe the .addInPlace is worldspace only, but I'm not sure.

Anyway, I was curious if you knew about Vector3's .addInPlace() method, and if that could be more useful for you.

Did you see that .translate has a sister method called .rotate() ?  I'm quite sure it uses mesh.rotationQuaternion and not mesh.rotation. 

Have you been introduced to Quaternions, yet?  They are another way (other than Vector3 Euler .rotation)... to store mesh rotation.  Using Quaternions is a way to avoid a rotation problem when values approach the mesh's "poles"... called 'gimbal lock'. 

Besides using AbstractMesh's .rotate() to set mesh.rotationQuaternion values (quats have 4 values), there are also some tools that use things like yaw, pitch, and roll. 

Someone once told me (about quats) that the X, Y, and Z values set the direction of an arrow (now place mesh upon arrow shaft so mesh +Z matches arrow direction), and then the 4th value (sometimes labeled 's' or 'w')... is the amount of mesh rotation AROUND the arrow's shaft.  Strange.  You probably know all this already... sorry.

Also, anytime a mesh goes physics-engine-active, the mesh and it's physics impostor... always use Quaternions for their rotation.  The mesh.rotationQuaternion property does NOT exist, by default.  The BJS engine installs it onto the mesh... if/when needed. 

AddInPlace() is a good friend of 'lerp's... I think (linear interpolations).  Lerps are derived with BJS helper funcs (or do them yourself) which calculate change-divided-by-time.  (Poorly described, sorry.)  Lerps (interpolations) are often used to change a value (like a step-distance) a certain amount... over a certain time-period.  They can include Bezier curves/eases.  Sounds like an animator's best friend, eh?  Those "steps" might be good values to .position.addInPlace(), right?  hmm. 

Exciting info, huh?  (snore)