ネットサービス

ツイートに収まる文字数のソースコードだけで幾何学模様が動く「t.d3fc.io」がおもしろすぎ


コンピューターに指令を与えるプログラムを書くと聞くと膨大な量の文字列を書いて……と思わず連想してしまいますが、「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

この記事のタイトルとURLをコピーする

・関連記事
精妙な幾何学模様の雪の結晶をタイピングで自由自在に生成できる「Flakes」 - GIGAZINE

黄金比が生む美にインスパイアされて考えられた「ハリスの螺旋」 - GIGAZINE

操作する四角形がどんどん入れ子になって最後は全てがゲシュタルト崩壊するクリア不可能ゲーム「Entire Screen of One Game」 - GIGAZINE

数式をイメージ化し直感的な数学の理解を助けてくれるゲーム「SineRider」 - GIGAZINE

世界中の空港の位置を「ボロノイ図」で表現した「World Airports Voronoi」 - GIGAZINE

「数学の概念」を視覚的かつ美しく表現したグラフィックいろいろ - GIGAZINE

雪の結晶みたいな形を自分で自由に作れる「Paper Snowflake Maker」 - GIGAZINE

in ネットサービス, Posted by darkhorse_log

You can read the machine translated English article here.