JavaScriptによるガントチャート作ってみた(まだ途中)

タスク管理を作ってます。で、ガントチャートがほしいけど、バーを動かしたりできないといけてないから、どうせJavaScriptだろってことで、JavaScriptで処理するようにしてみました。まだまだ途中。動作確認Firefoxのみ。

下記のようなJSONデータを元に、表示します。

  {
    tasks : {
      1 : {name: "task1", depend: [2], begin : 1, term: 1   },
      2 : {name: "task2", begin: "2007/01/01", end: "2007/01/03"   },
      3 : {name: "task3", begin: "2007/01/03", end: "2007/01/05"   },
      4 : {name: "task4", depend: [1, 2, 3]  , begin : 1, term: 5 }
    },
    order : [1, 2, 3, 4] // 今んとこ無意味
  }

tasksのハッシュのキーがtask_idで、その値に、タスクの各種データをハッシュで持っています。

• name
  • タスクの名前
• depend
  • 依存関係にあるtask_id
• begin
  • dependがある場合は依存関係にあるタスクの終了日からの相対的な開始日
  • dependがない場合は開始日(yyyy/mm/dd)
• end
  • 終了日(yyyy/mm/dd)
• term
  • タスクの期間(今のとこ、dependの場合のみ有効)

下記で動きます。
http://rwds.net/gc.html

UIはもっと改良しないといけませんね。わかりづらい。

しかし、JavaScriptにブロックスコープがないって知って、愕然とした。てか、今まで知らずに使ってた自分にどうよっていう感じが。
withで使えるということですが、遅いので使うなとか、同僚の持ってたオライリーの本(Javascript: The Definitive Guide)に書いてました。

JavaScript関係は、来週あたりに、オライリーから下記の書籍が発売のようですね。

• 初めてのJavaScript
  • http://www.oreilly.co.jp/books/9784873113227/
• JavaScriptクイックリファレンス 第5版
  • http://www.oreilly.co.jp/books/9784873113258/

後者は、Javascript: The Definitive Guide のリファレンス部分って書いてるんで、ってことは、それの日本語版は出ないっつーことかな。