City scene drawn with only 256 characters JavaScript I don’t understand because the animation is so amazing – Yajiuma no Mori –Window no Mori

This video is titled “City in a Bottle”. At first glance, it looks like you’re playing a video file, but in reality, everything is written in JavaScript. And it’s only 256 characters! !!

City in a Bottle 🌆

pic.twitter.com/N3WelPqtMY

– Frank Force 🌻 (@KilledByAPixel)April 22 2022

I already saved the following code as an HTML file and opened it with “Microsoft Edge”, but the city reproduced correctly.

<canvas style=width:99% id=c onclick=setInterval('for(c.width=w=99,++t,i=6e3;i--;c.getContext`2d`.fillRect(i%w,i/w|0,1-d*Z/w+s,1))for(a=i%w/50-1,s=b=1-i/4e3,X=t,Y=Z=d=1;++Z<w&(Y<6-(32<Z&27<X%w&&X/9^Z/8)*8%46||d|(s=(X&Y&Z)%3/Z,a=b=1,d=Z/w));Y-=b)X+=a',t=9)>

Please click the “Edge” browsing screen when playing. If you don’t want to bother creating a file, click “JSFiddleYou can try it with .

Looks like it’s already running on “Microsoft Edge”

You can try it easily with “JS Middle”

I have no idea why this code would be able to highlight a beautiful city, but I’m not familiar with JavaScript, but some people have parsed the code to make it easier to understand.

brilliant! Tried to figure out how it works, which is a fully 3D engine?! Not just for blocks. 🤯
My notes:https://t.co/yJ39naoVCH
(I’m not sure if I understood everything correctly.)pic.twitter.com/fGJQhfINp2

Daniel DarabosApril 24, 2022

this isExplanation pageNow you can try how to change the display of “City in a Bottle” while changing various parameters. It also appears to do extensive ray tracing (ray tracing), and even that’s refreshing for the hobbyist, but if you’re interested, please take a look.

Comment page where you can learn about the mechanism of “City in a Bottle” while playing with parameters.

Additionally, Frank Force who produced the movie “A City in a Bottle” (Tweet embed) is also a “very short but amazing code”More than 1,000 people have posted on a JavaScript sharing site called “Dwitter”It looks like. Please take this too