d/22568 by taupelink

function u(t) {

c.width=1920 // clear the canvas
for(i=0;i<9;i++)
x.fillRect(400+i*100+S(t)*300,400,50,200) // draw 50x200 rects

} // 122/140

Please log in (or register) to post a dweet (copy-paste the code somewhere safe to save it meanwhile)


    u(t) is called 60 times per second.
    t: Elapsed time in seconds.
    S: Shorthand for Math.sin.
    C: Shorthand for Math.cos.
    T: Shorthand for Math.tan.
    R: Function that generates rgba-strings, usage ex.: R(255, 255, 255, 0.5)
    c: A 1920x1080 canvas.
    x: A 2D context for that canvas.

show FPS hide FPS share fullscreen

taupelink

remix of d/22467 by u/taupelink

function u(t) {

for(i=h=k=210;i--;x.fillRect(k*X,k*Y,-i*p>>t,-i>>t))f=i*t,X=f*f%12,Y=X*f%6,h=i/3*S(Y*S(p=Y%t*Y*3)+X*S(Y*p)),x.fillStyle=R(i/2,h*4,h*p,9/p)

Apr 20 2021 2:09 AM UTC

}// 138/140

Please log in (or register) to post as a new dweet (copy-paste code somewhere safe to save it meanwhile).

d/22568

Show more comments…
u/magna

OH MY GOD
u/lars-erik

🤯👌
u/UEZ

Excellent! 1/Y/2 as alpha channel gives a softer water surface imho. :-)
u/UEZ

Even better: x.fillStyle=R(i/2,h*4,h*p,1/Y/6)
u/taupelink

thanks all--and yes, I like that variant!
u/magna

u/taupelink how much of your work is intention versus happy accidents? It would be lovely to see a blog post from you explaining your process...
u/taupelink

far, far closer to happy accidents. lots and lots of trial and error to see what works. with that said, it's not just throwing darts blindly. maybe like panning for gold?
u/taupelink

in any case, i will think about writing up some kind of essay on it!
u/DaSpider

Reminds #monet #impressionism
u/tomxor

#waitforit


      u(t) is called 60 times per second.
      t: elapsed time in seconds.
      c: A 1920x1080 canvas.
      x: A 2D context for that canvas.
      S: Math.sin
      C: Math.cos
      T: Math.tan
      R: Generates rgba-strings, ex.: R(255, 255, 255, 0.5)

dwitter.net