作成者Observable

外観

ポイントスケール ​

ポイントスケールは、バンド幅がゼロに固定されたバンドスケールのバリアントです。ポイントスケールは通常、順序またはカテゴリ次元を持つ散布図に使用されます。

scalePoint(domain, range) ​

例 · ソース · 指定されたドメインと範囲、パディングなし、丸めなし、中央アライメントで新しいポイントスケールを構築します。ドメインが指定されていない場合、デフォルトは空のドメインになります。範囲が指定されていない場合、デフォルトは単位範囲 [0, 1] になります。

point(value) ​

例 · ソース · 入力ドメイン内の値が与えられた場合、出力範囲から導出された対応するポイントを返します。

js
const x = d3.scalePoint(["a", "b", "c"], [0, 960]);
x("a"); // 0
x("b"); // 480
x("c"); // 960
x("d"); // undefined

指定された値がスケールのドメイン内にない場合、undefinedを返します。

point.domain(domain) ​

abcdef

例 · ソース · ドメインが指定された場合、ドメインを指定された値の配列に設定します。

js
const x = d3.scalePoint([0, 960]).domain(["a", "b", "c", "d", "e", "f"]);

ドメインの最初の要素は最初のポイントにマップされ、2番目のドメイン値は2番目のポイントにマップされるといった具合です。ドメイン値は、プリミティブ値からインデックスへのInternMapに内部的に格納されます。その結果のインデックスがポイントを決定するために使用されます。したがって、ポイントスケールの値はプリミティブ値に強制的に変換可能である必要があり、プリミティブドメイン値は対応するポイントを一意に識別します。ドメインが指定されていない場合、このメソッドは現在のドメインを返します。

point.range(range) ​

例 · ソース · 範囲が指定された場合、スケールの範囲を指定された2要素の数値配列に設定し、このスケールを返します。

js
const x = d3.scalePoint().range([0, 960]);

指定された配列の要素が数値でない場合、数値に強制的に変換されます。範囲が指定されていない場合、スケールの現在の範囲（デフォルトは[0, 1]）を返します。

point.rangeRound(range) ​

例 · ソース · スケールの範囲を指定された2要素の数値配列に設定すると同時に、丸めを有効にします。このスケールを返します。

js
const x = d3.scalePoint().rangeRound([0, 960]);

これは、次の同等の便利なメソッドです。

js
point.range(range).round(true)

丸めはアンチエイリアスによるアーティファクトを回避するのに役立つことがありますが、shape-renderingの「crispEdges」スタイルも検討してください。

point.round(round) ​

abcdefghij

例 · ソース · 丸めが指定された場合、それに応じて丸めを有効または無効にします。

js
const x = d3.scalePoint(["a", "b", "c"], [0, 960]).round(false);

丸めが指定されていない場合、丸めが有効になっているかどうかを返します。

js
x.round() // false

丸めが有効になっている場合、各ポイントの位置は整数になります。丸めはアンチエイリアスによるアーティファクトを回避するのに役立つことがありますが、shape-renderingの「crispEdges」スタイルも検討してください。ドメインの幅が範囲のカーディナリティの倍数でない場合、パディングがなくても未使用のスペースが残ることがあることに注意してください。残りのスペースをどのように分散するかを指定するには、point.alignを使用してください。

point.padding(padding) ​

abcdefghij

例 · ソース · パディングが指定された場合、外側のパディングを指定された数値に設定します。これは通常、[0, 1] の範囲です。

js
const x = d3.scalePoint(["a", "b", "c"], [0, 960]).padding(0.1);

パディングが指定されていない場合、デフォルトで0である現在の外側のパディングを返します。

js
x.padding() // 0.1

外側のパディングは、最初のポイントの前と最後のポイントの後に予約する空白スペースの量を、ステップの倍数で指定します。band.paddingOuterと同等です。

point.align(align) ​

abcdefghij

例 · ソース · アライメントが指定された場合、アライメントを指定された値に設定します。この値は [0, 1] の範囲内である必要があります。

js
const x = d3.scalePoint(["a", "b", "c"], [0, 960]).align(0.5);

アライメントが指定されていない場合、デフォルトで0.5である現在のアライメントを返します。

js
x.align() // 0.5

アライメントは、範囲内の未使用の残りのスペースがどのように分散されるかを指定します。値が0.5の場合、残りのスペースが最初のポイントの前と最後のポイントの後に均等に分散されることを示します。つまり、ポイントは範囲内の中央に配置される必要があります。0または1の値を使用して、ポイントを片側にシフトして、たとえば軸に隣接する位置に配置することができます。

point.bandwidth() ​

例 · ソース · ゼロを返します。

point.step() ​

abcdefghij

例 · ソース · 隣接するポイント間の距離を返します。

point.copy() ​

例 · ソース · このスケールの正確なコピーを返します。このスケールへの変更は、返されたスケールに影響を与えず、その逆も同様です。