
355
16.5 D3 のスケールを使った範囲の調整
最大限利用します。
16.5
D3
のスケールを使った範囲の調整
D3
のスケールの背景にある基本的な考え方は、入力領域から出力範囲へのマッピングです。ス
ケールは簡単に使うことができ、グラフの作成や可視化などで発生する手間のかかる多くの作業が
軽減できます。スケールを使いこなせるようになればなるど、スケールの適用できる場面も増える
でしょう。スケールをマスターすることは、
D3
をストレスなく扱うために必要です。
D3
で提供している多くのスケールは、大きく
3
つに分類できます。定量的スケール、序数ス
ケール、時間スケール
†
です。考えうるほとんどの状況に適した魅力的なマッピングが用意されて
いますが、線形スケールや序数スケールを使う場合が多いでしょう。
D3
スケールはオブジェクトでもあり関数でもあるので、使用するときに違和感を感じるかもし
れません。つまり、スケールを作成したら、スケールでさまざまなメソッドを呼び出してプロパ
ティ(例えば、定義域を設定する
domain
)を設定しますが、定義域引数を指定して関数として呼
び出して範囲値を返すこともできます。以下の例でこの違いが明確になるでしょう。
var scale = d3.scale.linear(); //
線形スケールを作成する
scale.domain([0, 1]).range([0, 100]); #
❶
scale(0.5) // returns 50 #
❷
❶ スケールの
domain
と
range
メソッドを使って ...