Make flowing water in a top down game

I have a grid board made up of block of land with different heights and I want to have water flow into tiles with a height lower than the height of the water+height of the land the water is on. I'm trying to do this using an array instead of collision checks with water block and blocks of land and I'm having marginal success (water slowly seeps onto land) but I'm pretty confused on how to proceed with this. Any suggestions on how something like this could be accomplished?

capx:

https://drive.google.com/file/d/1aBWlLl ... sp=sharing

Edit: I want it to be similar to the water flow in creeper world or something similar where the water slowly flows so you can have areas of high water spread out but also still make waves of water that move forward

Here is my attempt:

https://www.dropbox.com/s/dsojflzj4u5gg ... .capx?dl=0

It's far from perfect, of course. It might be better to fill tiles with water in circular pattern (not from top-left as I did). Also, limit the amount of water or speed at which big areas of ground are flooded.

Yeah, I want to make a limited amount of water to move around and make it so areas are slowly filled instead of being filled instantly but this is great! I did not even know stuff like this could be done with tile maps. I'll see if I can implement the rest on my own and post a capx of it when I'm done (or if there's anything I get stuck on)

I had to give this a go too, even though dop's example is pretty cool. I found it helped to solve the problem first with 1d water:

https://www.dropbox.com/s/i5jg5dmlcb5cx ... .capx?dl=1

Then do 2d water later.

https://www.dropbox.com/s/88haygg6tfvja ... .capx?dl=1

Anyways, it's something you can play with and see if any of the ideas help.

Cool examples as always, R0j0!

I improved mine. It looks better and the flooding speed now depends on the area.

https://www.dropbox.com/s/mmjm0to1xdoos ... .capx?dl=0

Man, I have a lot to learn. That makes my best attempt look pretty bad lol

https://drive.google.com/file/d/1Pln9Mt ... sp=sharing

Thank you both for the help, I hope you don't mind if I study and use your code in the little game I'm making

I had to give this a go too, even though dop's example is pretty cool. I found it helped to solve the problem first with 1d water:

https://www.dropbox.com/s/i5jg5dmlcb5cx ... .capx?dl=1

Then do 2d water later.

https://www.dropbox.com/s/88haygg6tfvja ... .capx?dl=1

Anyways, it's something you can play with and see if any of the ideas help.

I was looking at your code, why do the water spread calculations loop "50-1" times for x and y instead of 50? I tried changing it and couldn't see much of a difference

It compares each two consecutive values so with repeat 50 the last value would be compared with nothing. You wouldn’t notice it unless there was water at the edge. I think it would just cause it to drain.

On another note, I need to rework the algorithm. I’m modifying the array as I loop over it and that causes a bias. In the 1d version, water flows more to the left than right at first, but it’s visually tolerable when adding a low amount of water at a time. The 2d one is distractingly worse, water flows to the top left more than other directions. A fix is to not change anything till the end of the loop but there’s a bit more to it.

Here's an unbiased version. It required looping over the array twice, which was bad for performance.

https://www.dropbox.com/s/ekvw5ukgmr4d7 ... .capx?dl=1

Wow, I wonder how this can be optimized considering the creeper world game works in much the same way but with much less computing power. I wonder how it was done, but this code is really great. Thanks so much ^-^

R0J0hound

Squares of different color mean different height above the sea level, right?

I don't understand, why is water flooding light red and dark red squares at the same time?

Shouldn't it fill the lower level squares first?

bbjGames

I actually didn’t measure if it’s that much slower, so I’m probably mistaken. It does move slower but that’s just to prevent water from going negative. There is likely other ways to do this that are faster.

The other game wasn’t made in Construct so there’s lots of things he could have done to make it faster.

Events are basically interpreted, so there’s that. If you made a plugin with JavaScript to do the water calculations there it would be a lot faster since JavaScript is jit’d into machine code.

dop2000

I guess I’m not seeing what you mean from the pictures. The water will try to flow downhill when it can. If too much water is added to one spot the water spills over in every direction. Given a bit of time it should settle down to the valleys. So if anything it solves it too slow. I haven’t based this on any existing algorithms so I’m probably not doing many parts of it the right way. Even after posting it there are things I want to try to do differently.

The idea behind it is simple enough. I take two adjacent cells and calculate how much water to move from the higher one so the two are level. If there is enough water that is.

The tricky part is doing that with the four adjacent cells at once and keep things unbiased. I’m also trying to keep the total amount of water the same as it moves around. The only problem so far is it flows too slow in large quantities, but given enough time it will level out.

Oh, so you quickly pour a large amount of water onto one spot, and then it flows down to lower levels. Got it.

I had a thought but am having some trouble implementing it. Instead of looping once to find how the water levels should change and then a second loop to implement it, what if you save the changes until the loop has progressed far enough away from a spot in the array and then change it. For example in your original program you compare the values at x,y with x+1,y and x,y+1. That means once the array reaches x=1 you could replace the values at x=0 with their updated values. I'm trying to implement that but am having a bit of trouble, this code doesn't work properly but maybe it can better show what I'm trying to say

https://drive.google.com/file/d/1wmAOHa ... sp=sharing

I don’t think that will work. You’d have to make sure to only update it if it won’t be touched again in the loop. Then you’d also have to update the remaining ones after the loop finishes. I think it’s overly complicated for what you’re doing.

Even at 60fps the water will spread slowly. This was so water wouldn’t go negative. Never letting it go below zero is a fix to that but the total amount of water would change.