実践! D3.jsで可視化入門
- 24. 2. スケール (scale) を設定する
一つひとつのデータについて、
scaleを使ってマッピングをする
{datum}
d3.scale.domain()!
メソッドに対応
scale
特徴
d3.scale.range()!
メソッドに対応
例) 一人のアスリートを、scaleAgeで年齢に対応づける
The Grammar of Graphicsでもscaleという概念がある
- 27. レイヤー化
•
The Grammar of Graphicsにならってレイヤー化
•
javascriptの変数名もレイヤーに対応させるといいかも
•
軸のレイヤー axesLayer
•
ラベルのレイヤー labelsLayer
•
地図のレイヤー mapLayer
•
アスリートのレイヤー athletesLayer
- 33. 参考資料
オススメ!
•
julia http://julialang.org/
•
jq http://stedolan.github.io/jq/
•
pandas http://pandas.pydata.org/
•
GDAL http://www.gdal.org/
•
mapshaper http://www.mapshaper.org/
•
mbostock/d3.js http://d3js.org
•
mbostock/topojson https://github.com/mbostock/topojson
•
mbostock/queue https://github.com/mbostock/queue
•
SVG 1.1 Coordinate Systems, Transformations and Units http://www.w3.org/TR/SVG/coords.html
•
Interactive Map with d3.js http://www.tnoda.com/blog/2013-12-07
•
Interactive Data Visualization for the Web (O’Reilly) http://chimera.labs.oreilly.com/books/1230000000345
•
A Layered Grammar of Graphics http://www.stat.columbia.edu/~gelman/bayescomputation/Wickham2010.pdf
•
VIZBI: D3 Workshop http://bost.ocks.org/mike/d3/workshop
•
The (un)official Sochi Olympics API http://www.kimonolabs.com/sochi/explorer
•
Natural Earth http://www.naturalearthdata.com/
•
Phoca Flag Icons - Flags of the World http://www.phoca.cz/flag-icons
•
ColorHexa http://www.colorhexa.com/
•
HSL Color Picker http://hslpicker.com/
オススメ!
オススメ!
オススメ!