D3 庫所提供的所有 API 都在 d3 命名空間下。d3 庫使用語義版本命名法(semantic versioning)。 你可以用 d3.version 查看當(dāng)前的版本信息。
d3 (核心部分)
選擇集
過渡效果
- d3.transition - 開始一個(gè)動畫過渡。簡單教程
- transition.delay - 指定每個(gè)元素過渡的延遲時(shí)間(單位:毫秒ms)。
- transition.duration - 指定每個(gè)元素過渡的持續(xù)時(shí)間(單位:毫秒ms)。
- transition.ease - 指定過渡的緩沖函數(shù)。
- transition.attr - 平滑過渡到新的attr屬性值(起始屬性值為當(dāng)前屬性)。
- transition.attrTween - 在不同attr屬性值之間平滑過渡(起始屬性值可在過渡函數(shù)中設(shè)置,甚至整個(gè)過渡函數(shù)都可以自定義)。
- transition.style - 平滑過渡到新的style屬性值。
- transition.styleTween - 在不同style屬性值之間平滑過渡。
- transition.text - 在過渡開始時(shí)設(shè)置文本內(nèi)容。
- transition.tween - 使某個(gè)屬性過渡到一個(gè)新的屬性值,該屬性可以是非attr或非style屬性,比如text。
- transition.select - 選擇每個(gè)當(dāng)前元素的某個(gè)子元素進(jìn)行過渡。
- transition.selectAll - 選擇每個(gè)當(dāng)前元素的多個(gè)子元素進(jìn)行過渡。
- transition.filter - 通過數(shù)據(jù)篩選出當(dāng)前元素中的部分元素進(jìn)行過渡。
- transition.transition - 當(dāng)前過渡結(jié)束后開始新的過渡。
- transition.remove - 過渡結(jié)束后移除當(dāng)前元素。
- transition.empty - 如果過渡為空就返回true。如果當(dāng)前元素中沒有非null元素,則此過渡為空。
- transition.node - 返回過渡中的第一個(gè)元素。
- transition.size - 返回過渡中當(dāng)前元素的數(shù)量。
- transition.each - 遍歷每個(gè)元素執(zhí)行操作。不指定觸發(fā)類型時(shí),立即執(zhí)行操作。當(dāng)指定觸發(fā)類型為'start'或'end'時(shí),會在過渡開始或結(jié)束時(shí)執(zhí)行操作。
- transition.call - 以當(dāng)前過渡為this執(zhí)行某個(gè)函數(shù)。
- d3.ease - 定制過渡的緩沖函數(shù)。
- ease - 緩沖函數(shù)。緩沖函數(shù)可讓動畫效果更自然,比如elastic緩沖函數(shù)可用以模擬彈性物體的運(yùn)動。是一種插值函數(shù)的特例。
- d3.timer - 開始一個(gè)定制的動畫計(jì)時(shí)。功能類似于setTimeout,但內(nèi)部用requestAnimationFrame實(shí)現(xiàn),更高效。
- d3.timer.flush - 立刻執(zhí)行當(dāng)前沒有延遲的計(jì)時(shí)。可用于處理閃屏問題。
- d3.interpolate - 生成一個(gè)插值函數(shù),在兩個(gè)參數(shù)間插值。差值函數(shù)的類型會根據(jù)輸入?yún)?shù)的類型(數(shù)字、字符串、顏色等)而自動選擇。
- interpolate - 插值函數(shù)。輸入?yún)?shù)在[0, 1]之間。
- d3.interpolateNumber - 在兩個(gè)數(shù)字間插值。
- d3.interpolateRound - 在兩個(gè)數(shù)字間插值,返回值會四舍五入取整。
- d3.interpolateString - 在兩個(gè)字符串間插值。解析字符串中的數(shù)字,對應(yīng)的數(shù)字會插值。
- d3.interpolateRgb - 在兩個(gè)RGB顏色間插值。
- d3.interpolateHsl - 在兩個(gè)HSL顏色間插值。
- d3.interpolateLab - 在兩個(gè)L*a*b*顏色間插值。
- d3.interpolateHcl - 在兩個(gè)HCL顏色間插值。
- d3.interpolateArray - 在兩個(gè)數(shù)列間插值。d3.interpolateArray( [0, 1], [1, 10, 100] )(0.5); // returns [0.5, 5.5, 100]
- d3.interpolateObject - 在兩個(gè)object間插值。d3.interpolateArray( {x: 0, y: 1}, {x: 1, y: 10, z: 100} )(0.5); // returns {x: 0.5, y: 5.5, z: 100}
- d3.interpolateTransform - 在兩個(gè)2D仿射變換間插值。
- d3.interpolateZoom - 在兩個(gè)點(diǎn)之間平滑地縮放平移。示例
- d3.interpolators - 添加一個(gè)自定義的插值函數(shù).
數(shù)據(jù)操作(Working with Arrays)
- d3.ascending - 升序排序函數(shù).
- d3.descending - 降序排序函數(shù).
- d3.min - 獲取數(shù)組中的最小值.
- d3.max - 獲取數(shù)組中的最大值.
- d3.extent - 獲取數(shù)組的范圍(最小值和最大值).
- d3.sum - 獲取數(shù)組中數(shù)字之和.
- d3.mean -獲取數(shù)組中數(shù)字的算術(shù)平均值.
- d3.median - 獲取數(shù)組中數(shù)字的中位數(shù) (相當(dāng)于 0.5-quantile的值).
- d3.quantile - 獲取排好序的數(shù)組的一個(gè)分位數(shù)(quantile).
- d3.bisect - 通過二分法獲取某個(gè)數(shù)在排好序的數(shù)組中的插入位置(同d3.bisectRight).
- d3.bisectRight - 獲取某個(gè)數(shù)在排好序的數(shù)組中的插入位置(相等的值歸入右邊).
- d3.bisectLeft - 獲取某個(gè)數(shù)在排好序的數(shù)組中的插入位置(相等的值歸入左邊).
- d3.bisector - 自定義一個(gè)二分函數(shù).
- d3.shuffle - 洗牌,隨機(jī)排列數(shù)組中的元素.
- d3.permute - 以指定順序排列數(shù)組中的元素.
- d3.zip - 將多個(gè)數(shù)組合并成一個(gè)數(shù)組的數(shù)組,新數(shù)組的的第i個(gè)元素是原來各個(gè)數(shù)組中第i個(gè)元素組成的數(shù)組.
- d3.transpose - 矩陣轉(zhuǎn)置,通過d3.zip實(shí)現(xiàn).
- d3.pairs - 返回臨近元素對的數(shù)組,d3.pairs([1, 2, 3, 4]); // returns [ [1, 2], [2, 3], [3, 4] ].
- d3.keys - 返回關(guān)聯(lián)數(shù)組(哈希表、json、object對象)的key組成的數(shù)組.
- d3.values - 返回關(guān)聯(lián)數(shù)組的value組成的數(shù)組.
- d3.entries - 返回關(guān)聯(lián)數(shù)組的key-value實(shí)體組成的數(shù)組, d3.entries({ foo: 42 }); // returns [{key: "foo", value: 42}].
- d3.merge - 將多個(gè)數(shù)組連成一個(gè),類似于原生方法concat. d3.merge([ [1], [2, 3] ]); // returns [1, 2, 3].
- d3.range - 獲得一個(gè)數(shù)列. d3.range([start, ]stop[, step])
- d3.nest - 獲得一個(gè)nest對象,將數(shù)組組織成層級結(jié)構(gòu). 示例:http://bl.ocks.org/phoebebright/raw/3176159/
- nest.key - 為nest層級結(jié)構(gòu)增加一個(gè)層級.
- nest.sortKeys - 將當(dāng)前的nest層級結(jié)構(gòu)按key排序.
- nest.sortValues - 將葉nest層級按value排序.
- nest.rollup - 設(shè)置修改葉節(jié)點(diǎn)值的函數(shù).
- nest.map - 執(zhí)行nest操作, 返回一個(gè)關(guān)聯(lián)數(shù)組(json).
- nest.entries - 執(zhí)行nest操作, 返回一個(gè)key-value數(shù)組. 如果nest.map返回的結(jié)果類似于{ foo: 42 }, 則nest.entries返回的結(jié)果類似于[{key: "foo", value: 42}].
- d3.map - 將javascript的object轉(zhuǎn)化為hash,屏蔽了object的原型鏈功能導(dǎo)致的與hash不一致的問題。
- map.has - map有某個(gè)key就返回true.
- map.get - 返回map中某個(gè)key對應(yīng)的value.
- map.set - 設(shè)置map中某個(gè)key對應(yīng)的value.
- map.remove - 刪除map中的某個(gè)key.
- map.keys - 返回map中所有key組成的數(shù)組.
- map.values - 返回map中所有value組成的數(shù)組.
- map.entries - 返回map中所有entry(key-value鍵值對)組成的數(shù)組.類似于{ foo: 42 }轉(zhuǎn)化成[{key: "foo", value: 42}]
- map.forEach - 對map中每一個(gè)entry執(zhí)行某個(gè)函數(shù).
- d3.set - 將javascript的array轉(zhuǎn)化為set,屏蔽了array的object原型鏈功能導(dǎo)致的與set不一致的問題。set中的value是array中每個(gè)值轉(zhuǎn)換成字符串的結(jié)果。set中的value是去重過的。
- set.has - 返回set中是否含有某個(gè)value.
- set.add - 添加某個(gè)value.
- set.remove - 刪除某個(gè)value.
- set.values - 返回set中的值組成的數(shù)組.set中的value是去重過的.
- set.forEach - 對set中每一個(gè)value執(zhí)行某個(gè)函數(shù).
Math