【D3.js】サーマーウォーズのワールドクロックを作る
アノ時計っぽいものを作ってみました。 example 解説 基本的には下記事のコードをちょこちょこっと改良しただけです。 【D3.js】 SVGで地球儀を描く 地軸を傾けながらSVGで地球儀を表示する ポイントとしては地形を裏用(グレー)と表用(ピンク)に２重に描画しているところでしょうか。 clipAngleメソッドを使って描画される範囲を変えています。 ・裏用地形描画 var projection180 = d3.geo.orthographic() .scale(windowWidht/4) .rotate([0,0,0]) .translate([windowWidht / 2, windowHeight / 2]) .clipAngle(180); var backPath = d3.geo.path().projection(projection180); //地形(裏) va
D3.js と GeoJSON でポリゴンを描く
こちらの記事を参考にして、東京都のポリゴンを描いてみます。 D3.jsとTopoJSONで地図を作る 違いは２点です。 イギリスではなく「東京都」のポリゴンを使う TopoJSON に変換せず GeoJSON を使う 作成したものは下記のページに置いてみました。 http://s.kitazaki.name/apps/tokyo-polygon/ 「２３区」と「島しょ部除く」のデータはすんなり表示されると思いますが、 「全域」のデータは大きいのでかなり時間がかかります。 これは TopoJSON を使う動機付けになりそうです。 目次 データを探す ツール類のインストール データの変換 データの読み込み ポリゴンの表示 ポリゴンのスタイル設定 インタラクションの追加 終わりに データを探す まずは境界線を持つポリゴンデータを探します。 国土交通省の国土政策局という部署が「国土数値情報ダウンロ
「D3.js」を使ったデータビジュアライゼーション
Webやスマートデバイス、センサーなどあらゆるものから情報を収集出来るようになり、世の中には膨大なデータが溢れかえっています。また、ビッグデータやデータサイエンティストといったキーワードに注目が集まり、データ活用への期待が高まっています。しかし、単純に収集したデータはそのままでは見づらく、そこから意味を汲み取ることは困難です。そこで、データの見せ方や伝え方が重要になってきます。 D3.jsとは D3.jsは、Mike Bostock（mbostock）が作成したデータ可視化用途で人気のJavaScriptライブラリで、データをDOMと結びつけ、データ駆動によりグラフを作成することができます。ソースコードはGithubで公開されており、人気を表すStarの数がGithubに公開されているリポジトリ全体で6番目に多いことからも、注目の高さが伺えます（2013/10現在）。ライセンスは修正BSD
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://ja.d3js.node.ws/blocks/mike/map/
http://ja.d3js.info/alignedleft/tutorials/d3/
