コンピューターに指令を与えるプログラムを書くと聞くと膨大な量の文字列を書いて……と思わず連想してしまいますが、「t.d3fc.io」はなんとTwitterのツイート1回分の文字数で完結するソースコードが集められたサイトで、実際にソースコードによって描かれる幾何学模様を楽しめるうえに、自分で書いた自作コードを投稿できるようにもなっています。

t.d3fc.io

https://t.d3fc.io/



サイトを開くと目に入るのが「A collection of tweet-sized d3 creations(ツイートサイズのd3作品のコレクション)」というキャッチコピー。JavaScriptのライブラリ「D3.js」を使ったソースコードが集められています。なお、「ツイート1回分」とは言っても、Twitterの文字数制限である140文字ではなく、実際には116文字+ヘルパーという上限になっている模様。



その下には、実際に作成されたソースコードと動作イメージのサンプルがズラッと並んでいます。いずれも見事な幾何学パターンで、しかも整然と動いているのでいつまででも見入ってしまいそうです。



個別のサンプルを見ると、アニメーションで動く動作イメージと、実際のコードの一部が表示されています。上部の動いている部分をクリックすると……



拡大されらアニメーションが表示され、その下にはソースコードの全文が表示されています。



その内容はこんな感じ。初心者には全く理解できない内容ですが、このようなソースがズラリと投稿されているというわけです。



C(rn(5,55)).a({r:d=>10*(1+c(d*3*t/3e4)),cx:d=>200*s(t*d

/3e4),cy:d=>80*c(t*d/2e4)}) https://t.d3fc.io

また、「PLAYGROUND」のページでは、それぞれのコードをコピペして動かしてみたり、自分で作ったコードを試してみることも可能。腕にある人が新作にチャレンジすることももちろん可能ですが、全くコードが書けない人でも、既存のコードをコピペして数字や数字を書き替えて変化を楽しむことも可能なので、D3の勉強や練習にもなりそうです。

t.d3fc.io