Raindrops that refract and merge (canvas, js)

http://www.dllu.net/raindrops/

by dllu • 13 years ago

3 2 13 years ago

$Preview of Raindrops that refract and merge (canvas, js)$ dllu.net

gus_massa• 13 years ago

Nice. But I expected some gravity, so the raindrops slide slowly over the “glass”.

Another problem is that when the raindrops are too big, then a “cross” appear over them (I guess it’s an artifact of the ilumination.) http://imgur.com/bX9Uebp

dllu• 13 years ago

Hmm, gravity can be implemented easily I think. Another thing is that raindrops are not always perfectly circular.

The "cross" is an artifact of the way I deal with saturation. The raindrops are simply Gaussian functions and the shading/refraction depends on the gradient thereof. If you keep clicking in one spot, the function values and the gradients become very large -- then the top half of the raindrop becomes black and the bottom half becomes white. To mitigate this, I simply run everything through the sigmoid function f(x) = 2/(1-exp(-x))-1, but this leads to the "cross" artifact. I'll think about how to deal with this a bit more.

Raindrops that refract and merge (canvas, js)

Related Stories