ついカッとなって書いてみました。大量のノードをJavaScriptのDOMで生成・操作するので、親の敵のような重さですが。
その名のとおり、JavaScriptで木を描くコードです。コードの洗練度は無視で面白さ重視。
再帰的な木を書くJavaScript
SafariとFirefoxでしかテストしてません。IEはもしかすると動かないかも？
結城さんの「再帰的な木を描くJavaのソースコード」を公開が元ネタ。
しくみはなんの事は無い、昔ネタでやった画像ファイルを読み込んでHTMLテーブルだけで画像を表現するってのの応用で、HTMLテーブルで表示領域を作りその上に画素をTDタグで配置しているだけです。座標の計算と描写の処理はJavaScript + DOMの操作。ピクセルの操作はCSS。
Lineオブジェクトとかの中身はチョーテキトウなので、そこんとこよろしくです。傾きが90度の線が引けないとか、書き手が小中学校の算数を忘れてるとかツッコミどころ満載です。
これ書きながら、この辺の処理が高速になったらJavaScriptとDOMでムービー再生とかいけないかなぁとか、画面を小さなブロックに分割して多数のホストでDOMを分散レンダリングとかできるなぁとか、それはもうダメな妄想して喜んでいたのは秘密です。
