Oh boy... my fave part... simulating water! You'll see on my YouTube channel I'm not new to this...
But let's not get carried away... I don't need water looking anywhere near as realistic for 'The Berg'. A simple sub-divided plane and another vertex displacement shader will do the trick...
The problem I have is that I get 'hung up' on water. I can fiddle for hours tweaking this and that. MUST NOT DO THAT THIS TIME!!
...
Several days later...
float step = viewSize / subdivisions;
vec2 pp = vec2(playerPos.x, -playerPos.z);
vec2 adjPlayerPos = floor(pp / step) * step;
vec2 remainderPP = pp - adjPlayerPos;
float uvScale = viewSize / mapSize;
vec2 uvOffset = vec2(adjPlayerPos + (mapSize / 2.) - (viewSize / 2.)) / mapSize;
vec2 newUV = uvOffset + uv * uvScale;
float dOffset = 0.001;
vec2 depths = vec2(0);
depths.x = clamp(nSeaLevel - texture2D(heightMap, newUV + vec2(-dOffset, -dOffset)).r, 0., nSeaLevel) / nSeaLevel;
depths.y = clamp(nSeaLevel - texture2D(heightMap, newUV + vec2(dOffset, dOffset)).r, 0., nSeaLevel) / nSeaLevel;
float avDepth = (depths.x + depths.y) / 2.;
float displace = 0.;
vec2 waveOrigin[3];
waveOrigin[0] = vec2(0.5, 0.5);
waveOrigin[1] = vec2(0.3, 0.25);
waveOrigin[2] = vec2(0.9, 0.75);
float waveOriginDist[3];
waveOriginDist[0] = distance( waveOrigin[0], newUV );
waveOriginDist[1] = distance( waveOrigin[1], newUV );
waveOriginDist[2] = distance( waveOrigin[2], newUV );
vec2 t;
for (int i = 0; i < 3; i++) {
displace += cos( waveFreq * ( 1. / float(i + 1) ) * waveOriginDist[i] + (time * 2.)) * avDepth;
displace += cos( waveFreq * avDepth * 2.5 * waveOriginDist[i] - (time * 1.5) ) * 0.5;
t += normalize(newUV - waveOrigin[i]) * cos(time * 0.1);
}
displace *= avDepth;
t *= 10.;
vec2 adjVertPos = vec2( position.x - remainderPP.x, position.y - remainderPP.y );
vec3 newPos = vec3( adjVertPos.x + t.x, adjVertPos.y + t.y, displace * heightScale );
vec3 transformed = newPos;
What... have... I... done...?
What kind of monster have I created?
...
?
Just kidding....
Your water looks really good. Of course your first video looks very good, but I have a particular interest in what you've done with 'berg'. I'm creating a project using node.js and three.js. I noticed the excellent performance you're able to achieve relying on the shaders to do most of your rendering ( am I understanding your blog posts properly? ).
I'll post my questions regarding shaders in your other blog post.