Developing with web browser_ja

ブラウザで開発する

データ可視化テンプレートの作成は、いきなりExcel上で開発するのではなく、Chrome等のブラウザ上で開発を行い、ある程度形が出来てからExcel上で確認をするのが効率が良いです。

簡易サーバを立ち上げた後、 http://localhost:8000/ にアクセスすると、Excel上のE2D3プログラムと同じように、いくつかチャートが表示されると思います。これらはcloneしてきたe2d3-contribディレクトリの内容を表示したものになっています。

簡易サーバではブラウザのLiveReload機能が有効になっており、この状態でファイルを変更すると自動的にブラウザが更新されるようになっています。

例えばブラウザで"Simple Bar Chart"のテンプレートにアクセスして表示させている状態で、エディタでbarchart-javascript/main.jsを開き、13行目あたりの

var color = d3.scale.category10();

を

var color = d3.scale.category20c();

に変更してください。ファイルを保存すると、開いているブラウザが勝手に更新されチャートの色が変わっているのがわかると思います。

普段はこの状態で開発すると良いです。