Physics of a Fish.

[BitOfGold]

This could be used in some way to animate trees or grass I think!
 

[JackFalcon]

@Pryme8... <standing><clapping> photo realistic fish!?!

looking.... in WebGl with shaders, likes, vnice!

And... BABYLON.TransformNode('fish', scene); //tolookup.

And great fins! 

@BitOfGold... nice idea.... organics in general.

 

 

[Pryme8]

I shall explain ^_^:

Mkay so this shader will work for more fish models two with a little tweaking, and there is a bit of changes I could make to the math on how it distorts the fish because right now its kinda hacky. 
This is where it all happens though @aFalcon
"void main() {
    vec4 p = vec4( position, 1. );
    float _t = sin(time*speed);    
    if(p.z<fishHead){ 
        float fade = distance(p.z, fishHead);
        float _d = ((sin(fade)*0.5)*_t);
        
        _d = (_d*fade)*0.2;                
        p.x = p.x+_d;
        p.z = p.z+(abs(_d)*0.325);
    }    
    vPosition = p.xyz;
    vUV = uv;    
    gl_Position = worldViewProjection * p;    
}"

which is the main function of the vertexShader

first we have "p" which is a duplicate of the position variable but passed as a vec4 but all you need to worry about is the xyz which is the position of each of the vertices (local positions I believe).  We duplicate it so we can modify it as the positions variable is read only.
_t is how we control the speed of the wiggle, the time variable is a running float that gets 0.01 added to it every frame and the speed is just a multiplier of it. We wrap it in a sin function to make it pulse between -1 and 1.

Now the if(p.z < fishHead) is where things get hacky and could use some changes preferably you would have control over the meshs you were feeding it and could set up the uv in a manor to control this but since this was just a free model I grabbed randomly I just used the positions instead.  What it is doing is first skipping any calculations if there is no necessity but if the mesh data is within that we modify it blah blah...

_d is important, it is the distance calculation lets break it down a little bit:
first fade is the value of how far the vertex is from the head point the closer it gets the smaller the number.  We then strap this in a sin function to keep it in a range and then multiply it by the amount you want the displacement to be, then you have it "bounce" between its value and its negative value by multiplying the whole thing by the _t var which is bouncing between -1 and 1 by the speed.

Now to make it so as we get closer to the head the effect is less we multiply our _d by our fade which because fade gets closer to 0 and it gets closer to the head smoothly dampens the wiggle.  The 0.2 is just a thing of taste to adjust and tweak the curve a little.

now we offset the x position by our fancy _d variable which works for most intensive purposes. but "stretches" the mesh so to simulate the fact the fish has bones in a all so hacky manor we add the the z position as well in an attempt to keep the fishs "spine" joints in a fixed distance from the skull.  This math could be way better but works right now for a quick demo.  Idealy if you picked any point on the fish and drew a circle from the base of the skull to that point you picked should always stay on that circle, so lets say you picked the very end tail point, and drew a circle from the base of the skull with a diameter the same as the distance to that point on the tail when the fish is perfectly straight; that point should stay on the circle even when fully displaced from the wiggle. (hope that made sense).

Lastly set the gl_position (the rendered out position) by multiplying the worldViewProjection by our modified position var and whabam.

 

[JackFalcon]

Awesome,

 found the sine, in the vertex shader, with the distance() and the fade... 

woah: vPosition = p.xyz; //nice trick...

duplicate p: ok...

MATH-BEANS:

 - wiggle is running float of  +=0.01 a frame, speed is a multiplier, and sin pulses (-1 to 1). Got it! 

 - bounce is double multiply of _t, sin and distance... ok, thx. Interesting...

 - z emulates bones, wow. to avoid stretching... in a circular distance from head. Got it. Was wondering... thx.

 - multiply into worldview.

 

This fish is a great beginner course in babylon WebGL ... and would make a great example. +1. 

Really impressive @Pryme8