Dweets awesomed by u/trupples

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.

Try the new frontend: beta.dwitter.net
Current theme challenge: #Opposites

show FPS hide FPS share fullscreen

katkip

function u(t) {

c.style.background=R(z=255/t),x.font='11cm"';x.fillStyle=R(255-z,0,z/4),x.fillText("🏰⚔️🏯",100,699-99/t)

Jan 11 2020 10:22 AM UTC

}// 103/140

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

#castle

u/katkip

#text #emoji

show FPS hide FPS share fullscreen

pavel

remix of d/17068 by u/pavel

function u(t) {

for(i=c.width|=0;i--;x.fillRect(960-p/h,540+q/h,5,5))j=i>>8,f=g=>2%~j*g(9696*j-t)+3**!j*g(578*i),p=f(C)-3**.5*S(t/16),q=f(S),h=(p*p+q*q)/420

Jan 11 2020 9:02 AM UTC

}// 140/140

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

Eight kissing circles 2

u/pavel

Using map-the-dots method. As you can see circles stay circles but they scrunch and stretch along their path.
u/yukulele

https://en.wikipedia.org/wiki/Steiner_chain
u/katkip

WOW

show FPS hide FPS share fullscreen

KilledByAPixel

function u(t) {

eval(unescape(escape`𭱩𭁨𚁸𚑦𫱲𚁣𛡷𪑤𭁨𯀽𩠽𪐽𞀰𞱩𛐭𞱦𪑬𫁓𭁹𫁥👒𚁷𚠹𞐬𘑷𚡦𛀭𨐪𩠩𛁦𪑬𫁔𩑸𭀨𙱜𭐰𝀱𞁎𙱛嵮𮡝𛀸𚱡𚡱𛰱𞐬𜐲𛑱𛰱𞐩𚑡🐨𪐯𜠰𯀰𚐥𜠿𜐺𛐱𛁺👩🀴𜀬𭰽𪐥𜠰𛁳𨑶𩐨𬡥𬱴𫱲𩐨𬐽𮠿𭰺𭰫𞐰𚐩𛁴𬡡𫡳𩡯𬡭𚁦𛁡𚠴𜀬𜀬𩠬𛑡𚠲𜰰𛀭𨐪𝀶𜀩`.replace(/u../g,'')))

Jan 10 2020 8:33 PM UTC

}// 140/140

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

NINTENDO 64!

u/sigveseb

woow!
u/KilledByAPixel

#logo

show FPS hide FPS share fullscreen

katkip

function u(t) {

for(c.width|=j=5,z=600;j--;)for(i=2*z;i--;)x.fillRect(960+C(i*52e-4)*600+S(i*j+t)*99,540+S(i*52e-4)*300+C(i*j+t)*99,s=C(i*52e-4-1.5)*2+5,s)

Jan 10 2020 1:02 PM UTC

}// 139/140

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

#ellipse inside a #torus

u/DataMeta

#opticalillusion

show FPS hide FPS share 1 remix fullscreen

tylertoomey

function u(t) {

c.width=1920 // clear the canvas
for(i=0;i<36;i++)
for(k=0;k<20;k++)
x.fillRect(i*53+(C(t*10+k)*10),k*53+(S(t*10+i)*10),50,50)

Jan 5 2020 4:42 AM UTC

}// 126/140

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

show FPS hide FPS share 4 remixes fullscreen

pavel

function u(t) {

for(c.width=640,i=8;i--;x.stroke())x.beginPath(r=150*2/3*(i>1)),x.arc(320+r*C(a=Math.PI/3*i+t),180+r*S(a),150*(i?1/3:1),0,7)

Jan 4 2020 9:07 PM UTC

}// 124/140

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

d/17063 #explanation

u/pavel

If you take every point on this picture, turn it into z=x+i*y and feed it through (sqrt(3)+z)/(1+sqrt(3)*z) then decode the resulting complex number as (x', y') and put a point there, you will get d/17063.
u/pavel

Of course you can't take infinitely many points so you will get a pixelated version. To get a proper version you need to solve the equation for the new, mapped, circle given the old circle so that you can use x.arc..

show FPS hide FPS share fullscreen

pavel

function u(t) {

for(c.width=640,i=8;i--;x.stroke())x.beginPath(R=3+12**.5*C(t+=22/21)),j=i<2,x.arc(320+150*(2*!i-j),180+260*S(t)*!j/R,130/(j||R*R)**.5,0,7)

Jan 4 2020 12:23 AM UTC

}// 139/140

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

Eight kissing circles

Show more comments…
u/pavel

These are the circles e^is, 1/3*e^is, 1/3*e^is + 2/3*e^i(n*pi/3+t) for n=0..5 transformed via the conformal map (3^.5+z)/(1+3^.5*z)
u/yonatan

Fascinating, but incomprehensible :)
u/yonatan

my best guess: z in the map is coords as a complex number, i is sqrt(-1), e is euler's const? no idea what's s
u/pavel

You got it. s is just a parameter, a real number. If you plot e^is in the complex plane you get a circle (https://en.wikipedia.org/wiki/Euler%27s_form…). Then that map magically moves and resizes things but keeps circles as circles.
u/pavel

This d/17068 is what the circles look like before the mapping. The mapping moves the inner one sideways, outside of the outer circle, and resizes it to be the same size, meanwhile the moving circles keep touching.
u/pavel

Check out https://jsfiddle.net/umL3t1he/9/ on desktop
u/katkip

#apolloniangasket

show FPS hide FPS share fullscreen

pavel

function u(t) {

for(i=c.width|=m=0;i--;m=1)x.globalAlpha=.3+m/3,z=C(i*i)-1.07,x.fillRect(m&&960*(z+2-(i**.2+t/3)%4)/z,540-m*32/z,s=m?i%9/z:2e3,32*s)

Jan 3 2020 1:46 AM UTC

}// 132/140

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

Train ride

u/KilledByAPixel

👍
u/katkip

#perspective

show FPS hide FPS share fullscreen

pavel

remix of d/17040 by u/pavel

function u(t) {

for(i=c.width|=f=g=>g(a=S(t))*(Math.asin(S(z+t))-2*a+i%2*2-1)+z*g(a-8);i--;x.strokeRect(960+f(C)*h,540-h/2,h/42,h))z=(i/60+t)%32,h=1500/f(S)

Jan 3 2020 12:32 AM UTC

}// 140/140

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

Strafing through wireframes

u/pavel

Alternatively, Dweetenstein 3D
u/KilledByAPixel

👍
u/katkip

#d3 #perspective
u/jylikangas

This is a fresh and inspiring idea - thanks!
u/aleamb

absolutely amazing!

show FPS hide FPS share fullscreen

winku

function u(t) {

c.width|=0
x.fillStyle=R(S(t)*255,0,99)
for(i=0;i<9;)y=i/9+S(i+t+t*i/8),x.lineTo(960+(a=99*(2+S(y)+C(y*2)))*S(p=i++*.7),540+a*C(p))
x.fill()

Jan 2 2020 11:55 AM UTC

}// 140/140

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

wobble

u/pavel

Pro tip: x.lineTo(X+r*C(a),Y+r*S(a)) is the same as x.arc(X,Y,r,a,a)
u/KilledByAPixel

👍

dwitter.net | trupples (15393)