byObservable

外観

APIインデックス ​

D3は、連携して動作するように設計されたモジュールの集合体です。モジュールは個別に使用することも、デフォルトビルドの一部としてまとめて使用することもできます。

d3-array ​

配列操作、順序付け、検索、サマリーなど。

加算 ​

浮動小数点値を完全な精度で加算します。

  • new Adder - 完全な精度を持つ加算器を作成します。
  • adder.add - 加算器に値を追加します。
  • adder.valueOf - 加算器の値の倍精度表現を取得します。
  • fcumsum - 数値の完全な精度の累積和を計算します。
  • fsum - 数値のイテラブルの完全な精度の合計を計算します。

Bin ​

離散サンプルを連続した、重複しない区間へビニングします。

  • bin - 新しいビニングジェネレーターを作成します。
  • bin - 与えられたサンプル配列をビニングします。
  • bin.value - 各サンプルの値アクセサを指定します。
  • bin.domain - 観測可能な値の区間を指定します。
  • bin.thresholds - 値をどのようにビンに分割するかを指定します。
  • thresholdFreedmanDiaconis - フリードマン・ディアコニスビニングルール。
  • thresholdScott - スコットの正規基準ビニングルール。
  • thresholdSturges - スタージェスのビニング式。

Bisect ​

ソート済みの配列から値を迅速に見つけます。

  • bisector - アクセサまたはコンパレーターを使用して二分探索を行います。
  • bisector.right - 指定されたコンパレーターによるbisectRight。
  • bisector.left - 指定されたコンパレーターによるbisectLeft。
  • bisector.center - ソート済みの配列内の値を二分探索します。
  • bisect - ソート済みの配列内の値を二分探索します。
  • bisectRight - ソート済みの配列内の値を二分探索します。
  • bisectLeft - ソート済みの配列内の値を二分探索します。
  • bisectCenter - ソート済みの配列内の値を二分探索します。

Blur ​

1次元または2次元の量的値をぼかします。

  • d3.blur - 数値の配列をインプレースでぼかします。
  • d3.blur2 - 2次元数値配列をインプレースでぼかします。
  • d3.blurImage - RGBA ImageDataをインプレースでぼかします。

Group ​

離散値をグループ化します。

  • d3.group - イテラブルをネストされたMapにグループ化します。
  • d3.groups - イテラブルをネストされた配列にグループ化します。
  • d3.rollup - イテラブルをネストされたMapに集約します。
  • d3.rollups - イテラブルをネストされた配列に集約します。
  • d3.index - イテラブルをネストされたMapにインデックス付けします。
  • d3.indexes - イテラブルをネストされた配列にインデックス付けします。
  • d3.flatGroup - イテラブルをフラットな配列にグループ化します。
  • d3.flatRollup - イテラブルをフラットな配列に集約します。
  • d3.groupSort - グループ化された値に従ってキーをソートします。

Intern ​

日付などの非プリミティブ値を持つマップとセットを作成します。

Sets ​

集合に対する論理演算。

  • d3.difference - 集合の差を計算します。
  • d3.disjoint - 2つの集合が互いに素かどうかをテストします。
  • d3.intersection - 集合の共通部分を計算します。
  • d3.superset - 集合が別の集合のスーパーセットかどうかをテストします。
  • d3.subset - 集合が別の集合のサブセットかどうかをテストします。
  • d3.union - 集合の和集合を計算します。

Sort ​

値の配列をソートして並べ替えます。

  • d3.ascending - 2つの値の自然順序を計算します。
  • d3.descending - 2つの値の自然順序を計算します。
  • d3.permute - インデックスのイテラブルに従って、要素のイテラブルを並べ替えます。
  • d3.quickselect - 数値の配列を並べ替えます。
  • d3.reverse - 値の順序を反転します。
  • d3.shuffle - イテラブルの順序をランダム化します。
  • d3.shuffler - イテラブルの順序をランダム化します。
  • d3.sort - 値をソートします。

Summarize ​

サマリー統計を計算します。

  • d3.count - イテラブル内の有効な数値をカウントします。
  • d3.min - イテラブル内の最小値を計算します。
  • d3.minIndex - イテラブル内の最小値のインデックスを計算します。
  • d3.max - イテラブル内の最大値を計算します。
  • d3.maxIndex - イテラブル内の最大値のインデックスを計算します。
  • d3.least - イテラブルの最小要素を返します。
  • d3.leastIndex - イテラブルの最小要素のインデックスを返します。
  • d3.greatest - イテラブルの最大要素を返します。
  • d3.greatestIndex - イテラブルの最大要素のインデックスを返します。
  • d3.extent - イテラブル内の最小値と最大値を計算します。
  • d3.mode - 数値のイテラブルの最頻値（最も一般的な値）を計算します。
  • d3.sum - 数値のイテラブルの合計を計算します。
  • d3.mean - 数値のイテラブルの算術平均を計算します。
  • d3.median - 数値のイテラブルの中央値（0.5分位数）を計算します。
  • d3.medianIndex - 数値のイテラブルの中央値インデックス（0.5分位数）を計算します。
  • d3.cumsum - イテラブルの累積和を計算します。
  • d3.quantile - 数値のイテラブルの分位数を計算します。
  • d3.quantileIndex - 数値のイテラブルの分位数インデックスを計算します。
  • d3.quantileSorted - ソート済みの数値配列の分位数を計算します。
  • d3.rank - イテラブルの順位を計算します。
  • d3.variance - 数値のイテラブルの分散を計算します。
  • d3.deviation - 数値のイテラブルの標準偏差を計算します。
  • d3.every - すべての値が条件を満たすかどうかをテストします。
  • d3.some - 任意の値が条件を満たすかどうかをテストします。

Ticks ​

連続区間から代表的な値を生成します。

  • d3.ticks - 数値範囲から代表的な値を生成します。
  • d3.tickIncrement - 数値範囲から代表的な値を生成します。
  • d3.tickStep - 数値範囲から代表的な値を生成します。
  • d3.nice - 目盛りに合わせて範囲を拡張します。
  • d3.range - 数値の範囲を生成します。

Transform ​

新しい配列を導出します。

  • d3.cross - 2つの反復可能オブジェクトの直積を計算します。
  • d3.merge - 複数の反復可能オブジェクトを1つの配列にマージします。
  • d3.pairs - 隣接する要素のペアの配列を作成します。
  • d3.transpose - 配列の配列を転置します。
  • d3.zip - 可変数の配列を転置します。
  • d3.filter - 値をフィルタリングします。
  • d3.map - 値をマッピングします。
  • d3.reduce - 値を削減します。

d3-axis ​

目盛りの人間が読みやすい参照マーク。

  • d3.axisTop - 上向き軸ジェネレータを新規作成します。
  • d3.axisRight - 右向き軸ジェネレータを新規作成します。
  • d3.axisBottom - 下向き軸ジェネレータを新規作成します。
  • d3.axisLeft - 左向き軸ジェネレータを新規作成します。
  • axis - 指定された選択要素に対して軸を生成します。
  • axis.scale - スケールを設定します。
  • axis.ticks - 目盛りの生成方法とフォーマットをカスタマイズします。
  • axis.tickArguments - 目盛りの生成方法とフォーマットをカスタマイズします。
  • axis.tickValues - 目盛りの値を明示的に設定します。
  • axis.tickFormat - 目盛りのフォーマットを明示的に設定します。
  • axis.tickSize - 目盛りのサイズを設定します。
  • axis.tickSizeInner - 内側の目盛りのサイズを設定します。
  • axis.tickSizeOuter - 外側の（範囲の）目盛りのサイズを設定します。
  • axis.tickPadding - 目盛りとラベル間の余白を設定します。
  • axis.offset - シャープなエッジのためのピクセルオフセットを設定します。

d3-brush ​

マウスまたはタッチを使用して、1次元または2次元の領域を選択します。

  • d3.brush - 新しい2次元ブラシを作成します。
  • d3.brushX - *x*軸に沿ったブラシを作成します。
  • d3.brushY - *y*軸に沿ったブラシを作成します。
  • brush - 選択要素にブラシを適用します。
  • brush.move - ブラシの選択範囲を移動します。
  • brush.clear - ブラシの選択範囲をクリアします。
  • brush.extent - ブラシ可能な領域を定義します。
  • brush.filter - ブラッシングを開始する入力イベントを制御します。
  • brush.touchable - タッチサポート検出器を設定します。
  • brush.keyModifiers - キーインタラクションを有効または無効にします。
  • brush.handleSize - ブラシハンドルのサイズを設定します。
  • brush.on - ブラシイベントをリスンします。
  • d3.brushSelection - 指定されたノードのブラシ選択を取得します。

d3-chord ​

  • d3.chord - 新しいコードレイアウトを作成します。
  • chord - 指定された行列に対してレイアウトを計算します。
  • chord.padAngle - 隣接するグループ間の余白を設定します。
  • chord.sortGroups - グループの順序を定義します。
  • chord.sortSubgroups - グループ内のソースとターゲットの順序を定義します。
  • chord.sortChords - グループ間のコードの順序を定義します。
  • d3.chordDirected - 有向コードジェネレータを作成します。
  • d3.chordTranspose - 転置されたコードジェネレータを作成します。
  • d3.ribbon - リボンシェイプジェネレータを作成します。
  • ribbon - リボンシェイプを生成します。
  • ribbon.source - ソースアクセサを設定します。
  • ribbon.target - ターゲットアクセサを設定します。
  • ribbon.radius - リボンのソースとターゲットの半径を設定します。
  • ribbon.sourceRadius - リボンのソースの半径を設定します。
  • ribbon.targetRadius - リボンのターゲットの半径を設定します。
  • ribbon.startAngle - リボンのソースまたはターゲットの開始角度を設定します。
  • ribbon.endAngle - リボンのソースまたはターゲットの終了角度を設定します。
  • ribbon.padAngle - パッド角度アクセサを設定します。
  • ribbon.context - レンダリングコンテキストを設定します。
  • d3.ribbonArrow - 矢印リボンジェネレータを作成します。
  • ribbonArrow.headRadius - 矢印の半径アクセサを設定します。

d3-color ​

色の操作と色空間の変換。

  • d3.color - 指定されたCSS色指定子を解析します。
  • color.opacity - 色の不透明度。
  • color.rgb - この色のRGB等価物を計算します。
  • color.copy - この色のコピーを返します。
  • color.brighter - この色のより明るいコピーを作成します。
  • color.darker - この色のより暗いコピーを作成します。
  • color.displayable - 色が標準のハードウェアで表示できる場合はtrueを返します。
  • color.formatHex - この色の16進数のRRGGBB文字列表現を返します。
  • color.formatHex8 - この色の16進数のRRGGBBAA文字列表現を返します。
  • color.formatHsl - この色のRGB文字列表現を返します。
  • color.formatRgb - この色のHSL文字列表現を返します。
  • color.toString - この色のRGB文字列表現を返します。
  • d3.rgb - 新しいRGB色を作成します。
  • rgb.clamp - RGB色空間にクランプされたこの色のコピーを返します。
  • d3.hsl - 新しいHSL色を作成します。
  • hsl.clamp - HSL色空間にクランプされたこの色のコピーを返します。
  • d3.lab - 新しいLab色を作成します。
  • d3.gray - 新しいLabグレイを作成します。
  • d3.hcl - 新しいHCL色を作成します。
  • d3.lch - 新しいHCL色を作成します。
  • d3.cubehelix - 新しいCubehelix色を作成します。

d3-contour ​

マーチングスクエアを使用して等高線ポリゴンを計算します。

  • d3.contours - 新しい等高線ジェネレータを作成します。
  • contours - 指定された値のグリッドに対して等高線を計算します。
  • contours.contour - 指定された値に対して等高線を計算します。
  • contours.size - 等高線ジェネレータのサイズを設定します。
  • contours.smooth - 生成された等高線がスムーズ化されるかどうかを設定します。
  • contours.thresholds - 等高線ジェネレータの閾値を設定します。
  • d3.contourDensity - 新しい密度推定器を作成します。
  • density - 指定されたサンプル配列の密度を推定します。
  • density.x - 密度推定器の*x*アクセサを設定します。
  • density.y - 密度推定器の*y*アクセサを設定します。
  • density.weight - 密度推定器の*weight*アクセサを設定します。
  • density.size - 密度推定器のサイズを設定します。
  • density.cellSize - 密度推定器のセルサイズを設定します。
  • density.thresholds - 密度推定器の閾値を設定します。
  • density.bandwidth - 密度推定器の帯域幅を設定します。
  • density.contours - 密度等高線を計算します。

d3-delaunay ​

2次元点の集合のボロノイ図を計算します。

d3-dispatch ​

名前付きコールバックを使用して懸念事項を分離します。

  • d3.dispatch - カスタムイベントディスパッチャを作成します。
  • dispatch.on - イベントリスナーを登録または登録解除します。
  • dispatch.copy - ディスパッチャのコピーを作成します。
  • dispatch.call - 登録されたリスナーにイベントをディスパッチします。
  • dispatch.apply - 登録されたリスナーにイベントをディスパッチします。

d3-drag ​

マウスまたはタッチ入力を使用して、SVG、HTML、またはCanvasをドラッグアンドドロップします。

  • d3.drag - ドラッグ動作を作成します。
  • drag - 選択範囲にドラッグ動作を適用します。
  • drag.container - 座標系を設定します。
  • drag.filter - 一部の開始入力イベントを無視します。
  • drag.touchable - タッチサポート検出器を設定します。
  • drag.subject - ドラッグされるものを設定します。
  • drag.clickDistance - クリック距離のしきい値を設定します。
  • drag.on - ドラッグイベントをリスンします。
  • d3.dragDisable - ネイティブのドラッグアンドドロップとテキスト選択を防止します。
  • d3.dragEnable - ネイティブのドラッグアンドドロップとテキスト選択を有効にします。
  • event.on - 現在のジェスチャでドラッグイベントをリスンします。

d3-dsv ​

区切り文字で区切られた値（最も一般的なのはCSVとTSV）を解析およびフォーマットします。

  • d3.csvParse - 指定されたCSV文字列を解析し、オブジェクトの配列を返します。
  • d3.csvParseRows - 指定されたCSV文字列を解析し、行の配列を返します。
  • d3.csvFormat - 指定されたオブジェクトの配列をCSVとしてフォーマットします。
  • d3.csvFormatBody - 指定されたオブジェクトの配列をCSVとしてフォーマットします。
  • d3.csvFormatRows - 指定された行の配列をCSVとしてフォーマットします。
  • d3.csvFormatRow - 指定された行をCSVとしてフォーマットします。
  • d3.csvFormatValue - 指定された値をCSVとしてフォーマットします。
  • d3.tsvParse - 指定されたTSV文字列を解析し、オブジェクトの配列を返します。
  • d3.tsvParseRows - 指定されたTSV文字列を解析し、行の配列を返します。
  • d3.tsvFormat - 指定されたオブジェクトの配列をTSVとしてフォーマットします。
  • d3.tsvFormatBody - 指定されたオブジェクトの配列をTSVとしてフォーマットします。
  • d3.tsvFormatRows - 指定された行の配列をTSVとしてフォーマットします。
  • d3.tsvFormatRow - 指定された行をTSVとしてフォーマットします。
  • d3.tsvFormatValue - 指定された値をTSVとしてフォーマットします。
  • d3.dsvFormat - 指定された区切り文字に対して新しいパーサーとフォーマッターを作成します。
  • dsv.parse - 指定された文字列を解析し、オブジェクトの配列を返します。
  • dsv.parseRows - 指定された文字列を解析し、行の配列を返します。
  • dsv.format - 指定されたオブジェクトの配列をフォーマットします。
  • dsv.formatBody - 指定されたオブジェクトの配列をフォーマットします。
  • dsv.formatRows - 指定された行の配列をフォーマットします。
  • dsv.formatRow - 指定された行をフォーマットします。
  • dsv.formatValue - 指定された値をフォーマットします。
  • d3.autoType - 指定されたオブジェクトの値の型を自動的に推測します。

d3-ease ​

スムーズなアニメーションのためのイージング関数です。

d3-fetch ​

Fetch APIの上位にある便利なメソッドです。

  • d3.blob - ファイルをBlobとして取得します。
  • d3.buffer - ファイルをArrayBufferとして取得します。
  • d3.csv - カンマ区切り値（CSV）ファイルを取得します。
  • d3.dsv - 区切り文字で区切られた値（CSV）ファイルを取得します。
  • d3.html - HTMLファイルを取得します。
  • d3.image - 画像を取得します。
  • d3.json - JSONファイルを取得します。
  • d3.svg - SVGファイルを取得します。
  • d3.text - プレーンテキストファイルを取得します。
  • d3.tsv - タブ区切り値（TSV）ファイルを取得します。
  • d3.xml - XMLファイルを取得します。

d3-force ​

速度Verlet積分を使用した力指向グラフレイアウトです。

d3-format ​

人間が理解しやすいように数値をフォーマットします。

d3-geo ​

地理投影、形状、数学。

パス ​

  • d3.geoPath - 新しい地理パスジェネレーターを作成します。
  • path - 指定されたフィーチャーを投影してレンダリングします。
  • path.area - 指定されたフィーチャーの投影された平面面積を計算します。
  • path.bounds - 指定されたフィーチャーの投影された平面バウンディングボックスを計算します。
  • path.centroid - 指定されたフィーチャーの投影された平面中心点を計算します。
  • path.digits - 出力精度を設定します。
  • path.measure - 指定されたフィーチャーの投影された平面長さを計算します。
  • path.projection - 地理投影を設定します。
  • path.context - レンダリングコンテキストを設定します。
  • path.pointRadius - ポイントフィーチャーを表示する半径を設定します。

投影 ​

生の投影 ​

方位投影 ​

円錐投影 ​

円柱投影 ​

ストリーム ​

球面形状 ​

球面数学 ​

  • d3.geoArea - 指定されたフィーチャの球面面積を計算します。
  • d3.geoBounds - 指定されたフィーチャの緯度経度境界ボックスを計算します。
  • d3.geoCentroid - 指定されたフィーチャの球面中心を計算します。
  • d3.geoDistance - 2点間の測地線距離を計算します。
  • d3.geoLength - ラインストリングの長さ、またはポリゴンの周囲長を計算します。
  • d3.geoInterpolate - 測地線に沿って2点間を補間します。
  • d3.geoContains - ポイントが指定されたフィーチャの内側にあるかどうかをテストします。
  • d3.geoRotation - 指定された角度の回転関数を作成します。

d3-hierarchy ​

階層データの視覚化のためのレイアウトアルゴリズム。

  • d3.hierarchy - 階層データからルートノードを構築します。
  • node.ancestors - 祖先の配列を生成します。
  • node.descendants - 子孫の配列を生成します。
  • node.leaves - 葉ノードの配列を生成します。
  • node.find - 階層内のノードを検索します。
  • node.path - 別のノードへの最短パスを生成します。
  • node.links - リンクの配列を生成します。
  • node.sum - 定量的な値を評価し集計します。
  • node.count - 葉ノードの数を数えます。
  • node.sort - すべての子孫兄弟をソートします。
  • node[Symbol.iterator] - 階層を反復処理します。
  • node.each - 幅優先探索。
  • node.eachAfter - 後順探索。
  • node.eachBefore - 前順探索。
  • node.copy - 階層をコピーします。
  • d3.stratify - 新しいstratify演算子を作成します。
  • stratify - 表形式データからルートノードを構築します。
  • stratify.id - ノードIDアクセッサを設定します。
  • stratify.parentId - 親ノードIDアクセッサを設定します。
  • stratify.path - パスアクセッサを設定します。
  • d3.cluster - 新しいクラスタ（デンドログラム）レイアウトを作成します。
  • cluster - 指定された階層をデンドログラムにレイアウトします。
  • cluster.size - レイアウトサイズを設定します。
  • cluster.nodeSize - ノードサイズを設定します。
  • cluster.separation - 葉ノード間の分離を設定します。
  • d3.tree - 新しい整然としたツリーレイアウトを作成します。
  • tree - 指定された階層を整然としたツリーにレイアウトします。
  • tree.size - レイアウトサイズを設定します。
  • tree.nodeSize - ノードサイズを設定します。
  • tree.separation - ノード間の分離を設定します。
  • d3.treemap - 新しいツリーマップレイアウトを作成します。
  • treemap - 指定された階層をツリーマップとしてレイアウトします。
  • treemap.tile - タイル方法を設定します。
  • treemap.size - レイアウトサイズを設定します。
  • treemap.round - 出力座標を丸めるかどうかを設定します。
  • treemap.padding - パディングを設定します。
  • treemap.paddingInner - 兄弟間のスペースを設定します。
  • treemap.paddingOuter - 親と子間のスペースを設定します。
  • treemap.paddingTop - 親の上端と子間のスペースを設定します。
  • treemap.paddingRight - 親の右端と子間のスペースを設定します。
  • treemap.paddingBottom - 親の下端と子間のスペースを設定します。
  • treemap.paddingLeft - 親の左端と子間のスペースを設定します。
  • d3.treemapBinary - バランスのとれた二分木を使用してタイル化します。
  • d3.treemapDice - 水平方向の列にタイル化します。
  • d3.treemapSlice - 垂直方向の列にタイル化します。
  • d3.treemapSliceDice - スライスとダイスを交互に行います。
  • d3.treemapSquarify - Bruls *et. al.*による正方形化された行を使用してタイル化します。
  • d3.treemapResquarify - d3.treemapSquarifyに似ていますが、安定した更新を実行します。
  • squarify.ratio - 必要な長方形のアスペクト比を設定します。
  • d3.partition - 新しいパーティション（アイシクルまたはサンバースト）レイアウトを作成します。
  • partition - 指定された階層をパーティション図としてレイアウトします。
  • partition.size - レイアウトサイズを設定します。
  • partition.round - 出力座標を丸めるかどうかを設定します。
  • partition.padding - パディングを設定します。
  • d3.pack - 新しい円パッキングレイアウトを作成します。
  • pack - 指定された階層を円パッキングを使用してレイアウトします。
  • pack.radius - 半径アクセッサを設定します。
  • pack.size - レイアウトサイズを設定します。
  • pack.padding - パディングを設定します。
  • d3.packSiblings - 指定された円の配列をパックします。
  • d3.packEnclose - 指定された円の配列を囲みます。

d3-interpolate ​

数値、色、文字列、配列、オブジェクトなどを補間します！

値の補間 ​

色の補間 ​

変換補間 ​

ズーム補間 ​

d3-path ​

CanvasパスコマンドをSVGにシリアライズします。

  • d3.path - 新しいパスシリアライザを作成します。
  • path.moveTo - 指定された点に移動します。
  • path.closePath - 現在のサブパスを閉じます。
  • path.lineTo - 直線セグメントを描画します。
  • path.quadraticCurveTo - 2次ベジェセグメントを描画します。
  • path.bezierCurveTo - 3次ベジェセグメントを描画します。
  • path.arcTo - 円弧セグメントを描画します。
  • path.arc - 円弧セグメントを描画します。
  • path.rect - 長方形を描画します。
  • path.toString - SVGパスデータ文字列にシリアライズします。
  • d3.pathRound - 固定された出力精度を持つ新しいパスシリアライザを作成します。

d3-polygon ​

2次元ポリゴンの幾何学的演算。

d3-quadtree ​

2次元再帰的空間分割。

  • d3.quadtree - 新しい空のクアドツリーを作成します。
  • quadtree.x - xアクセサを設定します。
  • quadtree.y - yアクセサを設定します。
  • quadtree.extent - 範囲をカバーするようにクアドツリーを拡張します。
  • quadtree.cover - 点をカバーするようにクアドツリーを拡張します。
  • quadtree.add - データをクアドツリーに追加します。
  • quadtree.addAll - データの配列をクアドツリーに追加します。
  • quadtree.remove - データをクアドツリーから削除します。
  • quadtree.removeAll - データの配列をクアドツリーから削除します。
  • quadtree.copy - クアドツリーのコピーを作成します。
  • quadtree.root - クアドツリーのルートノードを取得します。
  • quadtree.data - クアドツリーからすべてのデータを取得します。
  • quadtree.size - クアドツリー内のデータ数をカウントします。
  • quadtree.find - クアドツリー内で最も近いデータをすばやく検索します。
  • quadtree.visit - クアドツリー内のノードを選択的に訪問します。
  • quadtree.visitAfter - クアドツリー内のすべてのノードを訪問します。

d3-random ​

様々な分布から乱数を生成します。

d3-scale ​

抽象的なデータを視覚的な表現にマッピングするエンコーディング。

線形スケール ​

連続的な量的ドメインを連続的な範囲にマッピングします。

  • d3.scaleLinear - 量的線形スケールを作成します。
  • linear - 指定されたドメイン値に対応する範囲値を計算します。
  • linear.invert - 指定された範囲値に対応するドメイン値を計算します。
  • linear.domain - 入力ドメインを設定します。
  • linear.range - 出力範囲を設定します。
  • linear.rangeRound - 出力範囲を設定し、丸めを有効にします。
  • linear.clamp - ドメインまたは範囲へのクランプを有効にします。
  • linear.unknown - 不明な入力に対する出力値を設定します。
  • linear.interpolate - 出力インターポレータを設定します。
  • linear.ticks - ドメインから代表的な値を計算します。
  • linear.tickFormat - 人間が理解できる形式でティックをフォーマットします。
  • linear.nice - ドメインを適切な丸い数字に拡張します。
  • linear.copy - このスケールのコピーを作成します。
  • d3.tickFormat - 人間が理解できる形式でティックをフォーマットします。
  • d3.scaleIdentity - アイデンティティスケールを作成します。
  • d3.scaleRadial - 放射状スケールを作成します。

累乗スケール ​

  • d3.scalePow - 量的累乗スケールを作成します。
  • d3.scaleSqrt - 指数0.5の量的累乗スケールを作成します。
  • pow.exponent - 累乗指数を設定します。

対数スケール ​

  • d3.scaleLog - 量的対数スケールを作成します。
  • log.base - 対数の底を設定します。
  • log.ticks - ドメインから代表的な値を計算します。
  • log.tickFormat - 人間が理解できる形式でティックをフォーマットします。
  • log.nice - ドメインを適切な丸い数字に拡張します。

対称対数スケール ​

時間スケール ​

  • d3.scaleTime - 時間に対する線形スケールを作成します。
  • time.ticks - ドメインから代表的な値を計算します。
  • time.tickFormat - 人間が理解できる形式でティックをフォーマットします。
  • time.nice - ドメインを適切な丸い時間値に拡張します。
  • d3.scaleUtc - UTCに対する線形スケールを作成します。

連続スケール ​

連続的な量的ドメインを連続的な固定インターポレータにマッピングします。

発散スケール ​

連続的な量的ドメインを連続的な固定インターポレータにマッピングします。

量的スケール ​

連続した数量的なドメインを離散的な範囲にマッピングします。

分位数スケール ​

閾値スケール ​

順序尺度 ​

離散的なドメインを離散的な範囲にマッピングします。

バンドスケール ​

  • d3.scaleBand - 順序バンドスケールを作成します。
  • band - 指定されたドメイン値に対応するバンドの開始位置を計算します。
  • band.domain - 入力ドメインを設定します。
  • band.range - 出力範囲を設定します。
  • band.rangeRound - 出力範囲を設定し、丸めを有効にします。
  • band.round - 丸めを有効にします。
  • band.paddingInner - バンド間の埋め込みを設定します。
  • band.paddingOuter - 最初のバンドと最後のバンドの外側の埋め込みを設定します。
  • band.padding - バンドの外側と間の埋め込みを設定します。
  • band.align - 余分なスペースがある場合、バンドの配置を設定します。
  • band.bandwidth - 各バンドの幅を取得します。
  • band.step - 隣接するバンドの開始位置間の距離を取得します。
  • band.copy - このスケールの複製を作成します。

ポイントスケール ​

  • d3.scalePoint - 順序ポイントスケールを作成します。
  • point - 指定されたドメイン値に対応する点を計算します。
  • point.domain - 入力ドメインを設定します。
  • point.range - 出力範囲を設定します。
  • point.rangeRound - 出力範囲を設定し、丸めを有効にします。
  • point.round - 丸めを有効にします。
  • point.padding - 最初の点と最後の点の外側の埋め込みを設定します。
  • point.align - 余分なスペースがある場合、点の配置を設定します。
  • point.bandwidth - 0 を返します。
  • point.step - 隣接する点の開始位置間の距離を取得します。
  • point.copy - このスケールの複製を作成します。

d3-scale-chromatic ​

数量、順序、カテゴリスケールのためのカラーランプとパレット。

カテゴリカル ​

循環的 ​

発散的 ​

順次的 ​

d3-selection ​

要素を選択し、データに結合することでDOMを変換します。

要素の選択 ​

要素の変更 ​

  • selection.attr - 属性を取得または設定します。
  • selection.classed - CSSクラスを取得、追加、または削除します。
  • selection.style - スタイルプロパティを取得または設定します。
  • selection.property - (生の)プロパティを取得または設定します。
  • selection.text - テキストコンテンツを取得または設定します。
  • selection.html - 内部HTMLを取得または設定します。
  • selection.append - 新しい要素を作成、追加、選択します。
  • selection.insert - 新しい要素を作成、挿入、選択します。
  • selection.remove - ドキュメントから要素を削除します。
  • selection.clone - 選択された要素のクローンを挿入します。
  • selection.sort - データに基づいてドキュメント内の要素をソートします。
  • selection.order - ドキュメント内の要素を選択範囲に合わせて並べ替えます。
  • selection.raise - 各要素を親の最後の子として並べ替えます。
  • selection.lower - 各要素を親の最初の子として並べ替えます。
  • d3.create - 切り離された要素を作成して選択します。
  • d3.creator - 名前で要素を作成します。

データの結合 ​

  • selection.data - 要素をデータにバインドします。
  • selection.join - データに基づいて要素を入力、更新、または終了します。
  • selection.enter - 入力選択範囲（データが存在しない要素）を取得します。
  • selection.exit - 終了選択範囲（データが存在しない要素）を取得します。
  • selection.datum - 要素データを取得または設定します（結合なし）。

イベントの処理 ​

  • selection.on - イベントリスナーを追加または削除します。
  • selection.dispatch - カスタムイベントをディスパッチします。
  • d3.pointer - イベントのポインタの位置を取得します。
  • d3.pointers - イベントのポインタの位置を取得します。

制御フロー ​

ローカル変数 ​

  • d3.local - 新しいローカル変数を宣言します。
  • local.set - ローカル変数の値を設定します。
  • local.get - ローカル変数の値を取得します。
  • local.remove - ローカル変数を削除します。
  • local.toString - ローカル変数のプロパティ識別子を取得します。

名前空間 ​

  • d3.namespace - 接頭辞付きXML名（例：「xlink:href」）を修飾します。
  • d3.namespaces - 組み込みのXML名前空間。

d3-shape ​

視覚化のためのグラフィカルプリミティブ。

円弧 ​

円グラフやドーナツグラフのような円形または環状の扇形。

円グラフ ​

表形式のデータセットを円グラフまたはドーナツグラフとして表現するために必要な角度を計算します。

  • d3.pie - 新しい円グラフジェネレーターを作成します。
  • pie - 指定されたデータセットの円弧の角度を計算します。
  • pie.value - 値アクセサを設定します。
  • pie.sort - ソート順の比較関数を設定します。
  • pie.sortValues - ソート順の比較関数を設定します。
  • pie.startAngle - 全体的な開始角度を設定します。
  • pie.endAngle - 全体的な終了角度を設定します。
  • pie.padAngle - 隣接する円弧間の角度を設定します。

線 ​

線グラフのようなスプラインまたはポリライン。

  • d3.line - 新しい線ジェネレーターを作成します。
  • line - 指定されたデータセットの線を生成します。
  • line.x - xアクセサを設定します。
  • line.y - yアクセサを設定します。
  • line.defined - 定義済みアクセサを設定します。
  • line.curve - 曲線補間器を設定します。
  • line.context - レンダリングコンテキストを設定します。
  • line.digits - 出力精度を設定します。
  • d3.lineRadial - 新しい放射状線ジェネレーターを作成します。
  • lineRadial - 指定されたデータセットの線を生成します。
  • lineRadial.angle - 角度アクセサを設定します。
  • lineRadial.radius - 半径アクセサを設定します。
  • lineRadial.defined - 定義済みアクセサを設定します。
  • lineRadial.curve - 曲線補間器を設定します。
  • lineRadial.context - レンダリングコンテキストを設定します。

面積 ​

面積グラフのような、境界となる上線と下線で定義された面積。

曲線 ​

点を補間して連続的な形状を生成します。

ソースからターゲットへの滑らかな3次ベジエ曲線。

  • d3.link - 新しいリンクジェネレータを作成します。
  • d3.linkVertical - 新しい垂直リンクジェネレータを作成します。
  • d3.linkHorizontal - 新しい水平リンクジェネレータを作成します。
  • link - リンクを生成します。
  • link.source - ソースアクセッサを設定します。
  • link.target - ターゲットアクセッサを設定します。
  • link.x - 点の x アクセッサを設定します。
  • link.y - 点の y アクセッサを設定します。
  • link.context - レンダリングコンテキストを設定します。
  • link.digits - 出力精度を設定します。
  • d3.linkRadial - 新しい極座標リンクジェネレータを作成します。
  • linkRadial.angle - 点の角度アクセッサを設定します。
  • linkRadial.radius - 点の半径アクセッサを設定します。

シンボル ​

散布図などにおけるカテゴリカルな形状エンコーディング。

スタック ​

積み重ね棒グラフなどにおいて、形状を隣接して配置します。

d3-time ​

人類特有の時間に関する慣習のための計算機。

d3-time-format ​

strptime および strftime を参考に、時刻の解析とフォーマットを行います。

d3-timer ​

数千もの同時実行アニメーションを管理するための効率的なキュー。

  • d3.now - 高解像度の現在時刻を取得します。
  • d3.timer - 新しいタイマーをスケジュールします。
  • timer.restart - タイマーの開始時刻とコールバックをリセットします。
  • timer.stop - タイマーを停止します。
  • d3.timerFlush - 適格なタイマーをすぐに実行します。
  • d3.timeout - 最初のコールバックで停止するタイマーをスケジュールします。
  • d3.interval - 設定可能な周期で呼び出されるタイマーをスケジュールします。

d3-transition ​

選択要素のためのアニメーション付きトランジション。

  • selection.transition - 選択された要素に対してトランジションをスケジュールします。
  • selection.interrupt - 選択された要素のトランジションを中断およびキャンセルします。
  • d3.interrupt - 指定されたノードのアクティブなトランジションを中断します。
  • d3.transition - ルートドキュメント要素でトランジションをスケジュールします。
  • transition.select - 選択された要素に対してトランジションをスケジュールします。
  • transition.selectAll - 選択された要素に対してトランジションをスケジュールします。
  • transition.selectChild - 各選択要素の子要素を選択します。
  • transition.selectChildren - 各選択要素の子要素を選択します。
  • transition.selection - このトランジションの選択要素を返します。
  • transition.filter - データに基づいて要素をフィルタリングします。
  • transition.merge - このトランジションを別のトランジションとマージします。
  • transition.transition - このトランジションに続いて新しいトランジションをスケジュールします。
  • d3.active - 指定されたノードのアクティブなトランジションを選択します。
  • transition.attr - デフォルトのインターポレータを使用して、指定された属性をトゥイーンします。
  • transition.attrTween - カスタムインターポレータを使用して、指定された属性をトゥイーンします。
  • transition.style - デフォルトのインターポレータを使用して、指定されたスタイルプロパティをトゥイーンします。
  • transition.styleTween - カスタムインターポレータを使用して、指定されたスタイルプロパティをトゥイーンします。
  • transition.text - トランジション開始時にテキストコンテンツを設定します。
  • transition.textTween - カスタムインターポレータを使用してテキストをトゥイーンします。
  • transition.remove - トランジション終了時に選択された要素を削除します。
  • transition.tween - トランジション中にカスタムコードを実行します。
  • transition.delay - 要素ごとの遅延をミリ秒単位で指定します。
  • transition.duration - 要素ごとの持続時間をミリ秒単位で指定します。
  • transition.ease - イージング関数を指定します。
  • transition.easeVarying - イージング関数ファクトリを指定します。
  • transition.end - トランジションが終了したときに解決されるPromise。
  • transition.on - トランジションの終了を待ちます。
  • transition.each - 各要素に対して関数を呼び出します。
  • transition.call - このトランジションに関数を呼び出します。
  • transition.empty - このトランジションが空の場合はtrueを返します。
  • transition.nodes - 選択されたすべての要素の配列を返します。
  • transition.node - 最初の（nullではない）要素を返します。
  • transition.size - 要素数を返します。

d3-zoom ​

マウスまたはタッチ入力を使用して、SVG、HTML、またはCanvasをパンとズームします。