Drkcore

02042013 javascript coffeescript d3.js

D3をはじめようを快適に写経するためにlivereloadを使って更新時にブラウザをリロードする

日本語の入門書はD3をはじめようがあるけど、ほんのさわりだけなので、日本語の簡単なチュートリアルが読みたいというヒト以外には積極的に読む必要性を感じないかな。ただ、あのイディオム(selectAll().data().enter()ってやつ)とメソッドチェインに慣れてないのだったら読んだほうがいいのかなぁ。日本語のほうがわかりやすいしなぁ。

ちゃんと読むつもりならInteractive Data Visualization for the Webのほうが良いと思う(まだ書評かいてないけど)。

Interactive Data Visualization for the Web
Scott Murray
Oreilly & Associates Inc / 2997円 ( 2013-04-02 )

javascriptを書き写すだけなのはつまらなかったのでcoffeescriptで書いたのと、coffee --watchだとコンパイル時にブラウザリロードしないのでlivereloadを使った。

Guardfileはこんな感じ。更新されたファイル名をfuncに渡せないのでハードコードしている。

#!/usr/bin/env python

from livereload.task import Task
import logging

def coffee():
    from subprocess import Popen, PIPE
    argv = ["/Users/kzfm/.nvm/v0.8.10/bin/coffee", "-c", "-m", "js/mean.coffee"]
    p = Popen(argv, stdin=PIPE, stdout=PIPE, stderr=PIPE)
    stdout, stderr = p.communicate()
    if stderr:
        logging.error(stderr)

Task.add('js/mean.coffee', coffee)

あとは編集してセーブすると自動コンパイルして、ブラウザもリロードしてくれる。

livereload_coffee

Drkcore

Interactive Data Visualization for the Web

やる気が出てきたのでやる気の無さをD3.jsで可視化してみた

エンジニアのためのデータ可視化

selectAll().data().enter()のわかりやすい説明

IE11でD3.jsを使うときにmetaタグでedgeしておかないといけない

D3をはじめようを快適に写経するためにlivereloadを使って更新時にブラウザをリロードする

Drkcore

Interactive Data Visualization for the Web

やる気が出てきたのでやる気の無さをD3.jsで可視化してみた

エンジニアのための データ可視化

selectAll().data().enter()のわかりやすい説明

IE11でD3.jsを使うときにmetaタグでedgeしておかないといけない

D3をはじめようを快適に写経するためにlivereloadを使って更新時にブラウザをリロードする

エンジニアのためのデータ可視化