Flowing Rivers

[Crashy]

Hello!
For some time I was wondering how to render rivers flowing on a terrain.
Using a special mask texture to choose where to draw the river in the pixel shader was an obvious solution, but how to make them flow?
Some days ago I've found a post on a blog talking about the way flowing water is simulated in Left4Dead 2 and Portal 2, linking to a Valve document written for the Siggraph.


This paper is mainly about using a "flow map" to scroll the water normal map in a given direction. For me, the most intersting thing in this paper is how the normal maps are scrolled.As I don't really want to generate a flow map, I just used the terrain normal to retrieve the flow direction, because basically, the water always flows the direction of the slope.

Then, having a normal-mapped water flowing in the right direction, I just added some basic fresnel & specular reflexion to give it a nice look.

**!NEW VIDEO!**
Here, a video, my terrain geometry hasn't any true riverbed so sometimes it's quite strange in video, but globally it's working.
The necessary screenshot:

[PolyVox]

Very nice! I also read that paper a few weeks ago. And you've got some interesting results from it. But I notice it looks a bit strange the way the edges of the river flow towards the middle, as though the water is coming out of the ground. Can you modulate the effect based on the depth of the water, or use the normal of the water surface rather than the normal of the ground to define the flow direction?

[Crashy]

Yep this is what I mentionned when I told it was sometimes strange This was a fast test with resources not really prepared for that.

Can you modulate the effect based on the depth of the water

Mmhh yes it could be a good addition to the effect. I also plan to add some foam when the flow speed is high, it's a really simple effect to make.

use the normal of the water surface rather than the normal of the ground to define the flow direction

I'm afraid I may don't get it, but the water surface normal is the ground normal.

The solution I see is to have a the terrain surface "flat" in the flow direction where the river mask is applied.
As a future work I plan to add manual terrain editing and river-mask painting directly in my game editor, so this shouldn't be an issue.

[PolyVox]

I'm afraid I may don't get it, but the water surface normal is the ground normal.

Sorry, I thought you were creating some new geometry for the water surface. But actually you made it clear in your post that you are drawing this directly onto the terrain - I just didn't read that carefully!

[LBDude]

That's cool looking. Although it looks a little bit odd with water on the edge flowing inward (what are the technical terms for these lol). Perhaps you could do an aggregation so the edge follows towards the average of the slope. And you can modulate the edge, so the edge flows a little bit parallel to the center of the flow. Just my 2 cent, not sure on the details.

[_tommo_]

That's a cool tech

But, i still think that having an artist-modelled polygon strip for the water surface is just better
Then you can just make the water flow in the direction of the UVs.

[Crashy]

Yup but from my experience, modelling a polygon strip that is following the terrain is not something easy. This is part of a rendering shader set designed for a kind of plane-shooter game, so the terrain is vast, and there would be a bunch of polygon-strip to model. That's why I decided to go to use a texture mask that the user is going to paint directly on the terrain in Realtime, so it's faster to make, WYSIWG and avoid the typical problems when using two polygon meshs so close one from another(polygons not really matching, Z-Fight, sort-order because river is transparent, etc).

You could also use WorldMachine to alter the terrain with a BRAND NAME erosion, and then use the flow map that is generated as a mask
( http://wiki.splashdamage.com/index.php/ ... egatexture )

This weekend I'll try to have a better designed terrain and upload a new video

[Crashy]

Here is a new video with new resources, the bad behaviours are mostly removed, enough for flight-sim game
I'll post some code tomorrow as some people asked for it.

[spacegaier]

A lot better, but you can still see a pattern of the river (from the normal map or what ever it is called/used in this case).

[LBDude]

that's cool. Yeah I think after you tweak this a little bit it would work perfectly. Maybe support multiple layers so you have effects such as splashes, I don't know. Some more tweaks...

[Crashy]

A lot better, but you can still see a pattern of the river (from the normal map or what ever it is called/used in this case).

Yeah I'm looking for a way to reduce the tiling, I'be got the same issue on my ocean shader, if someone has a neat link, it would be perfect

Maybe support multiple layers so you have effects such as splashes, I don't know.

Yup, as said before I'll add some foam when the flow speed is high, and a friend advised me to add some foam on the river shore too.

I'll keep you aware of the progress of the shader:)

[PolyVox]

Yeah I'm looking for a way to reduce the tiling, I'be got the same issue on my ocean shader, if someone has a neat link, it would be perfect

I can't watch the video on my current machine to see the problem, by if you are suffering from tiling of the water surface then maybe you could look at Perlin Noise to generate the water heightmap procedurally? There is a GPU implententation in GPU Gems 2 or 3 (and 1, but that's older). I've used it myself, and could even give you my Ogre 'conversion' in a few days time.

[Crashy]

I reduced the tiling issue using a random noise texture to alter normal maps.

Here is a shader code snippet for the cool stuff:

Code: Select all

//assume that the water flows down the slope ~=the more horizontal the normal is, the faster the water flows
 float2 flowDir = -normal.xz;

//time01 is an uniform parameter = the ogre auto value time_0_1
float phase0 = time01;
float phase1 = (time01<=0.5)?time01+0.5: time01 - 0.5; //yeah this is crappy and non optimal :)
	
float3 normalT0 = tex2D(riverNoise0, ( Texcoord) + flowDir * phase0 )*2-1;
float3 normalT1 = tex2D(riverNoise1, ( Texcoord) + flowDir * phase1 )*2-1;

float HalfCycle = 0.5;
float flowLerp = ( abs( HalfCycle - time01 ) / HalfCycle );
	
float3 riverNormal = lerp( normalT0, normalT1, flowLerp );
riverNormal = normalize(riverNormal+noise); //add some noise to the normals

[spacegaier]

Really looking great however I still feels a bit like the river is just flat painted on the ground. Perhaps you should carve the river bed out a bit and make a little bit more distinctive border between the grass and the water. Then it would defintely approach "perfect" .

[Crashy]

Yes it was planned from the beginning, I'll use some rock or gravel texture for the riverbed( and why not do some faked refraction using the river normal map) in the future.
I'm going to stop working on it for the moment, it was a "proof of concept" for an upcoming project. I have to finish the game engine first
I will update this topic as soon as I've got the effect finalised

[umpf]

Have a look at my river:
http://goo.gl/gcXQ
- it doesn't show any tiling (even on very large surfaces like open sea)
- the waves are directional (in the video they change direction going around the ring)
- the waves can have local scaling (in the video, the inner waves are smaller)
- no visible pulsing
This was done in osg. shader code will soon be available

[jacmoe]

Inlining your video, Umpf:


Looks great!

License?

[umpf]

Thanks for inlining the video. Except for the cool music, there is no license. you can do whatever you want with it.

[Crashy]

Nice!

[Xypher]

Very nice, it looks great!

[tafkag]

Except for the cool music, there is no license.

Sadly, the "cool music" prevents me from watching the video, because UMG is blocking the video...

[jacmoe]

No code requires no license. I just hope you actually do get back to us with code, Umpf. (Cool username).

[SunSailor]

Pretty strange - playing the video shows me a message, that it contains material from a third party and isn't available in my region (germany). Are you using copyright protected music? Because the pictures can't be the problem. Would be nice, if you could recreate the video without such issues, as your work is much appreciated from my side . Would really like to see it.

[Kentamanos]

Pretty strange - playing the video shows me a message, that it contains material from a third party and isn't available in my region (germany). Are you using copyright protected music? Because the pictures can't be the problem. Would be nice, if you could recreate the video without such issues, as your work is much appreciated from my side . Would really like to see it.

Yeah it uses a Queens of the Stoneage song (a very appropriate song too btw...hehe). I guess deals with Germany haven't been negotiated etc.

[umpf]

hi,

glad you liked the video. Apparently the whole world can watch it but youtube is blocking it in Germany (and only Germany). Perhaps you can try something like 'hotspot shield' (or equivalent) to let youtube think you are not from Germany.
And I will make the source code available soon. I promise, but I want to make sure it is even better than it currently is (lots of hacking went on, and I need to normalize the code a bit to make it readable ). Also I will write some text to go with it, so people will understand what I did.

you will get it, but all the nice comments are appreciated.