选择元素

d3.selection | Function

入参: 无

描述: 选择根元素，即 document.documentElement

返回值: Selection

注: 该函数可用于检测一个对象是否是一个 Selection 实例: object instanceof d3.selection，或者用于在 d3.selection 的原型上进行扩展

d3.selectAll | Function

入参: selector，有两种形式：

传入 CSS 选择器，类型为字符串。d3 支持所有的 CSS 选择器(类选择器，标签选择器，ID 选择器，属性选择器，通配选择器以及组合选择器)
传入节点，这可以与 jQuery 等第三方库合作使用。同时，这在你已经有一个节点的引用时是十分有用的，比如

//将所有链接的字体颜色改为红色
d3.selectAll(document.links).style("color", "red");

描述: 选择选择器匹配的所有元素，如果没有匹配，或者入参为 undefined 和 null，则返回一个空的 selection

返回值: Selection

d3.select | Function

入参: selector，有两种形式：

传入 CSS 选择器，类型为字符串。d3 支持所有的 CSS 选择器(类选择器，标签选择器，ID 选择器，属性选择器，通配选择器以及组合选择器)
传入节点，这可以与 jQuery 等第三方库合作使用。同时，这在你已经有一个节点的引用时是十分有用的，比如

//将所有被点击的段落的字体颜色改为红色
d3.selectAll("p").on("click", function() {
  d3.select(this).style("color", "red");
});

描述: 选择选择器匹配的第一个元素，如果没有，则返回一个空的 selection

返回值: Selection

selection.selectAll | Function

入参: selector，有两种形式：

CSS 选择器
function (d, i, nodes) {}，其中 d 代表当前数据，i 代表当前索引，nodes 代表当前已经被选择的元素集。this 代表当前元素对应的真实 DOM 节点。该函数必须具有返回值，返回值可以是一个元素数组(或伪数组)，如果不存在匹配元素，则返回空数组

描述: 在所有已经被选择的元素下，选择选择器匹配的所有子元素。如果没有元素匹配选择器，则该对应的父元素分组为空的 NodeList；如果入参为 undefined 和 null，那么返回的 selection 下的每一个分组(分组的意义详见注解)都为空的 NodeList；如果当前元素有数据，匹配子元素并不继承该数据，而是需要通过 selection.data 进行进一步操作

返回值: Selection

注：返回结果会根据所有已经被选择的元素进行分组，每个被选择元素为一组。若某个被选择元素下存在匹配选择器的子节点，则该分组具有包含该节点的节点集；否则，若某个被选择元素下不存在任何匹配选择器的子节点，则该分组为空的 NodeList

selection.select | Function

入参: selector，有两种形式：

CSS 选择器
function (d, i, nodes) {}，其中 d 代表当前数据，i 代表当前索引，nodes 代表当前已经被选择的元素集。this 代表当前元素对应的真实 DOM 节点。该函数必须具有返回值，返回值可以是一个元素，如果不存在匹配元素，则返回 null

描述: 在所有已经被选择的元素下，选择选择器匹配的第一个子元素。如果没有元素匹配选择器，则该对应的父元素分组为null；如果入参为 undefined 和 null，那么返回的 selection 下的每一个分组(分组的意义详见注解)都为 null；如果当前元素有数据，那么所有的匹配子元素都会继承该数据

返回值: Selection

注：返回结果会根据所有已经被选择的元素进行分组，每个被选择元素为一组。若某个被选择元素下存在匹配选择器的子节点，则该分组包含该节点；否则，若某个被选择元素下不存在任何匹配选择器的子节点，则该分组为 null

selection.filter | Function

入参: selector，有两种形式：

CSS 选择器，用于筛选当前选择集中匹配选择器的元素创建选择集
function (d, i, nodes) {}，其中 d 代表当前数据，i 代表当前索引，nodes 代表当前已经被选择的元素集。this 代表当前元素对应的真实 DOM 节点。若该函数返回 true，则代表当前元素被保留；否则，代表当前元素被丢弃

描述: 对当前选择集中包含的节点进行筛选

返回值: Selection

selection.merge | Function

入参: other selection

描述: 将当前选择集与其他选择集进行合并，返回的选择集与当前选择集具有相同的 parents 和相同数量的分组。对于当前选择集中缺失的分组，会从其他选择集中选择填充入对应的元素。该方法通常用于合并 enter 和 update 选择集

返回值: Selection

注: 如果当前选择集和其他选择集在相同的索引位置上都存在非空元素，那么会保留当前选择集在该索引位置上的元素，忽略其他选择集在该索引位置上的元素

d3.matcher | Function

入参: selector，CSS 选择器

描述: 对于给定的入参 selector，返回一个函数 - 若 this 元素与该选择器匹配，则返回 true；否则，返回 false。该方法通常用于在 selection.filter 函数中使用，比如

var div = selection.filter("div");

等价于

var div = selection.filter(d3.matcher("div"));

返回值: Function

d3.selector | Function

入参: selector，CSS 选择器

描述: 对于给定的入参 selector，返回一个函数 - 该函数返回 this 元素的第一个与选择器匹配的后代。该方法通常用于在 selection.select 函数中使用，比如

var div = selection.select("div");

等价于

var div = selection.select(d3.selector("div"));

返回值: Function

d3.selectorAll | Function

入参: selector，CSS 选择器

描述: 对于给定的入参 selector，返回一个函数 - 该函数返回 this 元素的所有与选择器匹配的后代。该方法通常用于在 selection.selectAll 函数中使用，比如

var div = selection.selectAll("div");

等价于

var div = selection.selectAll(d3.selectAll("div"));

返回值: Function

d3.window | Function

入参: node，node 可能的取值有三种

node 是节点，则返回所属的文档关联的 window 对象
node 是文档，则返回该文档关联的 window 对象
node 是 window 对象，则直接返回 node

描述: 返回 node 所属的 window 对象

返回值: window

d3.style | Function

入参: (node, name)，其中 node 为节点，name 是字符串

描述: 返回特定 node 节点，特定名称的 CSS 属性值。如果该属性是内联样式，则直接返回属性值；否则，返回属性的计算值(computed value)

返回值: String

修改元素

selection.attr | Function

入参: (name[, value])，其中 value 有两种形式

value 是一个常量，那么所有被选择的元素的对应属性值都会被赋值为相同的 value 值
value 是一个函数，形式为 function (d, i, nodes) {}，其中 d 代表当前数据，i 代表当前索引，nodes 代表当前已经被选择的元素集。this 代表当前元素对应的真实 DOM 节点。此时，函数的返回值会作为当前元素的属性值，如果函数返回 null，则意味着移除该属性

描述: 如果没有指定value，则会返回选择集中第一个非空元素的对应属性值。如果指定了 value ，那么会将所有已被选择的元素的对应属性值设置为 value 并且返回当前选择集

返回值: 如果未指定 value，则返回字符串；否则，返回 Selection

注: 这里的 name 属性可能带有命名空间前缀，例如 xlink:href 就代表 XLink 命名空间中的 href 属性

selection.classed | Function

入参: (name[, value])，其中 value 有两种形式

value 是一个常量，如果 value 值等价于 true，那么所有已经被选择的元素都会添加类 name；否则，如果 value 值等价于 false，那么所有已经被选择的元素都会移除类 name
value 是一个函数，形式为 function (d, i, nodes) {}，其中 d 代表当前数据，i 代表当前索引，nodes 代表当前已经被选择的元素集。this 代表当前元素对应的真实 DOM 节点。此时，函数的返回值决定是当前元素是移除类还是添加类，如果函数返回为 true，则添加；否则，则移除

描述: 如果没有指定 value，则返回选择集中第一个非空元素的 class 是否包含有特定 name，如果包含，则返回 true；否则返回 false。如果指定了 value，那么会添加或移除所有已被选择元素的对应的 class

返回值: 如果未指定 value，则返回布尔值；否则，返回 Selection

注: 这里的 name 是一个以空格作为分隔符的字符串，可以包含多个 class name，比如

selection.classed("foo bar", true);

selection.style | Function

入参: (name[, value[, priority]])，其中 value 有两种形式

value 是一个常量，那么所有被选择的元素的对应 name 的 CSS 样式都会被赋值为相同的 value 值
value 是一个函数，形式为 function (d, i, nodes) {}，其中 d 代表当前数据，i 代表当前索引，nodes 代表当前已经被选择的元素集。this 代表当前元素对应的真实 DOM 节点。此时，函数的返回值会作为当前元素特定 name 的 CSS 样式值，如果函数返回为 null，则意味着移除该 CSS 样式

描述: 如果没有指定 value，则返回选择集中第一个非空元素的特定 name 的样式值。如果该样式是内联样式，则直接返回属性值；否则，返回属性的计算值(computed value)。如果指定了 value，那么会给所有已选择元素的特定 name 的 CSS 样式设置 value 值

返回值: 如果未指定 value，则返回字符串；否则，返回 Selection

注: priority 是可选的，它的取值可以为 null 或者字符串 important

selection.property | Function

入参: (name[, value])，其中 value 有两种形式

value 是一个常量，那么所有被选择的元素的对应属性值都会被赋值为相同的 value 值
value 是一个函数，形式为 function (d, i, nodes) {}，其中 d 代表当前数据，i 代表当前索引，nodes 代表当前已经被选择的元素集。this 代表当前元素对应的真实 DOM 节点。此时，函数的返回值会作为当前元素的属性值，如果函数返回 null，则意味着移除该属性

描述: 如果没有指定 value，则会返回选择集中第一个非空元素的对应属性值。如果指定了 value ，那么会将所有已被选择的元素的对应属性值设置为 value 并且返回当前选择集

返回值: 如果未指定 value，则返回字符串；否则，返回 Selection

注: 一些 HTML 元素具有特殊的属性，这些属性使用 attribute 或 style 都无法寻址，例如多选框的 checked 属性，此时可以考虑使用 property 来进行操作

selection.text | Function

入参: [value]，有两种形式

value 是一个常量，那么所有被选择的元素的 textContent 都会被赋值为相同的 value 值
value 是一个函数，形式为 function (d, i, nodes) {}，其中 d 代表当前数据，i 代表当前索引，nodes 代表当前已经被选择的元素集。this 代表当前元素对应的真实 DOM 节点。此时，函数的返回值会作为当前元素的 textContent，如果函数返回 null，则将 textContent 置空

描述: 如果没有指定 value，则会返回选择集中第一个非空元素的 textContent。如果指定了 value ，那么会将所有已被选择的元素的 textContent 设置为 value 并且返回当前选择集

返回值: 如果未指定 value，则返回字符串；否则，返回 Selection

selection.html | Function

入参: [value]，有两种形式

value 是一个常量，那么所有被选择的元素的 innerHTML 都会被赋值为相同的 value 值
value 是一个函数，形式为 function (d, i, nodes) {}，其中 d 代表当前数据，i 代表当前索引，nodes 代表当前已经被选择的元素集。this 代表当前元素对应的真实 DOM 节点。此时，函数的返回值会作为当前元素的 innerHTML，如果函数返回 null，则将 innerHTML 置空

描述: 如果没有指定 value，则会返回选择集中第一个非空元素的 innerHTML。如果指定了 value ，那么会将所有已被选择的元素的 innerHTML 设置为 value 并且返回当前选择集

返回值: 如果未指定 value，则返回字符串；否则，返回 Selection

selection.append | Function

入参: type，有两种形式

标签名字符串，比如 div，circle 等
function (d, i, nodes) {}，其中 d 代表当前数据，i 代表当前索引，nodes 代表当前已经被选择的元素集。this 代表当前元素对应的真实 DOM 节点。该函数返回一个需要被添加的元素，这个元素可以是一个新的元素，也可以是已经存在的元素

描述: 向所有已经被选择的元素添加子元素或兄弟元素，新增的元素还将继承当前选择集的数据。如果当前选择集是 enter 选择集，则 append 操作的行为是添加兄弟元素；如果当前选择集是非 enter 选择集，则 append 操作的行为是添加子元素

返回值: 包含被添加元素的 Selection

注: 这里的 type 可能带有命名空间前缀，例如 svg:text 就代表 SVG 命名空间中的 text 标签

selection.insert | Function

入参: (type[, before]) 其中 type 有两种形式

标签名字符串，比如 div，circle 等
function (d, i, nodes) {}，其中 d 代表当前数据，i 代表当前索引，nodes 代表当前已经被选择的元素集。this 代表当前元素对应的真实 DOM 节点。该函数返回一个需要被插入的元素，这个元素可以是一个新的元素，也可以是已经存在的元素

其中 before 有两种形式

CSS 选择器，类型为字符串，比如 :first-child，div 等
function (d, i, nodes) {}，其中 d 代表当前数据，i 代表当前索引，nodes 代表当前已经被选择的元素集。this 代表当前元素对应的真实 DOM 节点。该函数返回一个当前选择集中的子节点，用于在该子节点前进行元素的插入

描述: 向所有已经被选择的元素添加子元素。如果指定了 before 参数，那么被添加的子元素会位于 before 指定的元素前面；如果没有指定 before 参数，则 before 默认为 null

返回值: 包含被添加元素的 Selection

注: 这里的 type 可能带有命名空间前缀，例如 svg:text 就代表 SVG 命名空间中的 text 标签

selection.remove | Function

入参: 无

描述: 从文档中移除所有已经被选择的元素

返回值: 被移除的 Selection

selection.sort | Function

入参: [compare 函数]，默认是 ascending 函数。compare 函数有两个参数(数据参数 a 和 b)，并且返回任一正的、负的或零值。如果返回为正，则带有数据 a 的元素在带有数据 b 的元素之后；反之，如果返回为负，则 a 在 b 之前；如果返回为零，a 和 b 的顺序随机

描述: 对当前选择集进行排序，并且返回，由于排序是依照数据来进行的，因而 sort 只能对带有数据的元素进行排序

返回值: 经过排序的 Selection

注：需要注意的是，这种排序方式并不保证是稳定排序，但它与浏览器内置的数据排序方法具有相同的行为

selection.order | Function

入参: 无

描述: 对于所有已经被选择的元素，按照选择集中的顺序重新插入到文档中

返回值: 与原始选择集相同的 Selection

selection.raise | Function

入参: 无

描述: 对于所有已经被选择的元素，重新插入到对应的父元素，每次插入时都作为父元素的最后一个子元素，相当于

selection.each(function(){
  this.parentNode.appendChild(this);
});

返回值: 与重新插入后的元素顺序相同的 Selection

selection.lower | Function

入参: 无

描述: 对于所有已经被选择的元素，重新插入到对应的父元素，每次插入时都作为父元素的第一个子元素，相当于

selection.each(function(){
  this.parentNode.insertBefore(this,this.parentNode.firstChild);
});

返回值: 与重新插入后的元素顺序相同的 Selection

d3.creator | Function

入参: name，标签名字符串，比如 div，circle 等

描述: 对于给定的 name，返回一个函数，该函数的返回值是一个根据 name 创建好的元素。该方法通常用于在 selection.append 和 selection.insert 函数中使用，比如

selection.append("div");

等价于

selection.append(d3.creator("div"));

返回值: Function

selection.data | Function

入参: [data[, key]] 其中 data 有两种形式

数组，可以包含任意类型的数据
function (d, i, nodes) {}，其中 d 代表当前数据，i 代表当前索引，nodes 代表当前已经被选择的元素集。this 代表当前元素对应的真实 DOM 节点。该函数必须返回一个数组

其中 key 是一个函数: function (d, i) {}

d 代表当前数据，i 代表当前索引。默认情况下，data 数组中的第一个数据元素会与第一个被选择的元素绑定，第二个数据元素会与第二个被选择的元素绑定，以此类推。key 方法的存在打破了这种规律，指定了数据元素和 DOM 元素的绑定关系。在不指定 key 函数时，数据元素和元素默认按照索引进行对应，当指定 key 函数后，索引根据 key 函数的返回值而定，即 key 函数会影响节点的索引，当索引改变时，不会自动触发排序，如果需要进行排序，需要手动调用 sort 或 order 函数。key 函数在过程中会被调用两次：一次是由选择集中的元素发起调用，此时 this 是真实的 DOM 节点；一次是 data 数组，此时的 this 是 data 数组。这两次调用返回的数据会进行比较，具有相同返回值的一个元素和一个数据元素会进行数据绑定，然后在最终返回的选择集中加入该元素，该元素在最终选择集中的位置根据其索引的顺序而定。以下是一个使用 key 函数的例子

var data = [
  {name: "Locke", number: 4},
  {name: "Reyes", number: 8},
  {name: "Ford", number: 15},
  {name: "Jarrah", number: 16},
  {name: "Shephard", number: 31},
  {name: "Kwon", number: 34}
];
d3.selectAll("div")
  //如果之前已经绑定过数据，则 d 是存在的，以 d.name 做索引；否则，以 this.id 做索引
  .data(data, function(d) { return d ? d.name : this.id; })
    .text(function(d) { return d.number; });

描述: 给所有已经被选择的元素绑定数据，返回一个 update 集：成功绑定数据的元素集。同时，由于数据元素和元素个数不一定一致，所以在返回的选择集上还会有 enter 和 exit 操作，详见 selection.enter 和 selection.exit。数据成功绑定后，会存储在 data 属性中。如果没有指定 data，则返回一个数组，数组中依次为当前选择集中的元素绑定的数据

返回值: 成功绑定数据的 Selection，并且带有 enter 和 exit 操作

selection.enter | Function

入参: 无

描述: 在 selection.data 操作后调用该方法。当数据元素个数大于元素个数时，调用该方法会返回缺失的元素集，所以通常调用该方法的目的就是为了创建缺失的元素，比如根据数组创建 div 元素

var div = d3.select("body")
  .selectAll("div")
  .data([4, 8, 15, 16, 23, 42])
  .enter().append("div")
    .text(function(d) { return d; });

假设 body 最初是空的，运行上述代码后，结果如下

<div>4</div>
<div>8</div>
<div>15</div>
<div>16</div>
<div>23</div>
<div>42</div>

返回值: 缺失的 Selection

selection.exit | Function

入参: 无

描述: 在 selection.data 操作后调用该方法。当数据元素个数小于元素个数时，调用该方法会返回多余的元素集，所以通常调用该方法的目的就是为了删除缺失的元素，比如根据数组删除多余的 div 元素

前提条件：已经存在包含数据 4, 8, 15, 16, 23, 42 的 div 元素

对 div 重新绑定数据：

div = div.data([1, 2, 4, 8, 16, 32], function(d) { return d; }); 这里使用了 key 方法，选择出 [1, 2, 4, 8, 16, 32] 和 [4, 8, 15, 16, 23, 42] 的交集元素，即带有数据 4, 8, 16 的元素加入 update 集

之前的元素不存在 [1, 2, 32]，则作为 enter 集：

div.enter().append("div").text(function(d) { return d; });

之前的 [15, 23, 42] 没有出现在新的数据中，则作为 exit 集：

div.exit().remove();

经过上述一系列代码的运行，结果如下

<div>1</div>
<div>2</div>
<div>4</div>
<div>8</div>
<div>16</div>
<div>32</div>

返回值: 多余的 Selection

selection.datum | Function

入参: [value]，有两种形式

value 是一个变量，所有已经被选择的元素都会绑定该 value 数据
value 是一个函数，形式为 function (d, i, nodes) {}，其中 d 代表当前数据，i 代表当前索引，nodes 代表当前已经被选择的元素集。this 代表当前元素对应的真实 DOM 节点。此时，函数的返回值会与当前元素进行数据绑定，如果返回 null，则表示删除当前元素所绑定的数据

描述: 如果没有指定 value，则会返回选择集中第一个非空元素绑定的数据。如果指定了 value ，那么会给所有已被选择的元素进行数据绑定

返回值: 进行完数据绑定的 Selection，即在原始 selection 的基础上变化了 data 属性(可能是添加，减少或修改了 data 属性)

注：该方法与 selection.data 完全不同，相较于 selection.data 来说，该方法不关心数据元素和 DOM 元素之间的关系，而只关注于数据绑定

事件处理

selection.on | Function

入参: (typenames[, listener[, capture]]) 其中 typenames 是一个字符串。它的表现形式主要有两种

事件类型，例如 click，mouseover 或 submit 等，支持的事件类型可以参考 DOM event type
事件类型.事件名称，其中事件类型同上，事件名称用来标识该事件，它们中间使用'.'间隔，该形式通常用于给相同类型的事件增加多个不同的监听器

同时，如果要给多个事件注册相同的监听器，则可以将不同的 typename 通过空格分隔来实现，比如input change 或 click.foo click.bar

其中 listener 是一个函数: function (d, i, nodes) {}

d 代表当前数据，i 代表当前索引，nodes 代表当前已经被选择的元素集。this 代表当前元素对应的真实 DOM 节点。当在已被选择的元素上触发指定事件后，对应的 listener 会被调用，如果想在 listener 中访问当前事件，通过 d3.event 来进行访问。当在相同元素上注册多个事件监听时，如果该元素上的 typename 已经存在，那么多次注册会覆盖掉原先的监听器。如果想要移除监听器，则传入 listener 为 null 即可：如果要移除特定事件名称的监听器，则指定 typename 为特定的事件名称，listener 为 null 即可；如果要移除所有不带事件名称的 typename 上的监听器，则指定 typename 为 . 即可

其中 capture 是一个布尔值，默认是 false

capture 标识符指定事件的捕获方式。当为 false 时，事件从内到外冒泡捕获；反正，从外到内捕获

描述: 向所有已被选择的元素添加或移除事件监听器。如果没有指定 listener，则返回选择集中第一个非空元素对应于当前 typename 的监听器；否则，给对应的 typename 增加事件监听器

返回值: 如果未指定 listener，则返回 Function；否则，返回 Selection

selection.dispatch | Function

入参: (type[, parameters]) 其中 type 是一个事件类型字符串，例如 click，mouseover 或 submit 等，支持的事件类型可以参考 DOM event type

其中 parameters 可以指定事件的一些属性，它的表现形式有两种

对象: 可以指定事件的 bubbles, cancelable, detail 属性 bubbles true 代表该事件可以冒泡 cancelable true 与执行 event.preventDefault 效果相同 detail 自定义数据
函数: function (d, i, nodes) {}，其中 d 代表当前数据，i 代表当前索引，nodes 代表当前已经被选择的元素集。this 代表当前元素对应的真实 DOM 节点。这个函数必须返回对象类型

描述: 触发所有当前已被选择元素的特定类型的事件，并且可以携带入指定事件的一些属性

返回值: Selection

d3.event | Attribute

当前的 event。这个属性在事件发生时被设置，并在事件回调结束后被重置。可以通过 d3.event 来访问一些标准的事件对象属性，比如 event.pageX，event.pageY 等，还可以访问一些标准的事件对象方法，比如 event.preventDefault()

d3.customEvent | Function

入参: (event, listener[, that[, arguments]])

描述: 使用特定的 that 上下文和指定的参数 arguments 调用 listener。在调用期间，d3.event 会被设置为指定的 event 对象；在调用结束后，d3.event 会被重置为之前的值

返回值: 取决于 listener 的返回值

d3.mouse | Function

入参: container

描述: 返回当前事件相对于 container 的 x 和 y 坐标(前提是 d3.event 必须是存在的)，container 可以为 HTML 元素或 SVG 元素，比如 G 元素或者 SVG 元素

返回值: [x, y]

d3.touch | Function --待验证

入参: (container[, touches], identifier)

描述: 返回当前标识符为 identifier 的触摸事件相对于 container 的 x 和 y 坐标(前提是 d3.event 必须是存在的)，container 可以为 HTML 元素或 SVG 元素，比如 G 元素或者 SVG 元素。当未指定 touches 时，touches 默认为当前事件的 changedTouches 属性。如果以 identifier 作为标识符的事件不包含在 touches 中，则返回 null

返回值: [x, y] 或 null

d3.touches | Function --待验证

入参: (container[, touches])

描述: 返回当前触摸事件相对于 container 的触摸 x 和触摸 y 坐标(前提是 d3.event 必须是存在的)，container 可以为 HTML 元素或 SVG 元素，比如 G 元素或者 SVG 元素，由于触摸可能是多点的，因而返回值为一个二维数组。当未指定 touches 时，touches 默认为当前事件的 touches 属性

返回值: [[x1, y1], [x2, y2], ...]

控制流

selection.each | Function

入参: function (d, i, nodes) {}，其中 d 代表当前数据，i 代表当前索引，nodes 代表当前已经被选择的元素集。this 代表当前元素对应的真实 DOM 节点

描述: 给当前已经选择的每个元素都调用一次 function 函数

返回值: Selection

selection.call | Function

入参: (function[, arguments…])

描述: 调用一次 function 函数。其中 function 函数的第一个参数为当前的 selection，其它参数可选，如下示例

function name(selection, first, last) {
  selection
  .attr("first-name", first)
  .attr("last-name", last);
d3.selectAll("div").call(name, "John", "Snow");

等价于

name(d3.selectAll("div"), "John", "Snow");

返回值: Selection

selection.empty | Function

入参: 无

描述: 当当前选择集中没有(非空)元素时，返回 true；否则，返回 false

返回值: Boolean

selection.nodes | Function

入参: 无

描述: 返回一个数组，数组中包含当前选择集中的所有非空元素

返回值: Array

selection.node | Function

入参: 无

描述: 返回当前选择集中的第一个非空元素，如果选择集为空，则返回 null

返回值: Node

selection.size | Function

入参: 无

描述: 返回选择集中的元素个数

返回值: Number

本地变量

d3.local | Function

入参: 无

描述: 声明一个本地变量

返回值: Object(本地变量)

local.set | Function

入参: node, value

描述: 设置本地变量的值。设置指定 node 的值为 value，并返回 value。这通常配合 selection.each 使用

selection.each(function(d) { foo.set(this, d.value); });

如果仅仅要给单一变量设值，可以考虑使用

selection.property(foo, function(d) { return d.value; });

local.get | Function

入参: node

描述: 返回该本地变量在指定 node 上的值，如果该本地变量上没有指定当前 node 的值，则会上溯其祖先元素，直至找到有值的祖先元素；否则，返回 undefined

local.remove | Function

入参: node

描述: 删除该本地变量在指定 node 上的值。如果该本地变量上指定了当前 node 的值，返回 true；否则，返回 false。与 local.get 不同，该函数不会上溯到祖先元素

返回值: Boolean

local.toString | Function

入参: 无

描述: 返回自动生成的本地变量标识符。该标识符会以变量的形式存储在 DOM 元素中，并且可以通过 element[local] 或 selection.property 来进行获取。这里的 element 为 DOM 元素，local 为本地变量名称

返回值: String

命名空间

d3.namespace | Function

入参: name，有两种形式

包含了冒号(:)，则冒号之前的子串作为命名空间前缀，且该前缀必须在 d3.namespaces 中注册。如果已注册，那么返回一个对象类似于 {space: "http://www.w3.org/2000/svg", local: "text"}；否则，返回只冒号后的子串
不包含冒号(:)，则直接返回 name

描述: name 中若包含命名空间前缀且该前缀已注册，则返回一个对象；若该前缀未注册，则返回不包含前缀的部分，比如d3.namespace('xxx:name')的返回结果为name，原因是 xxx 不包含在 d3.namespaces 列表中。name 中若不包含命名空间前缀，则直接返回

返回值: Object 或 String

d3.namespaces | Attribute

返回注册的命名空间前缀，初始值为

{
  svg: "http://www.w3.org/2000/svg",
  xhtml: "http://www.w3.org/1999/xhtml",
  xlink: "http://www.w3.org/1999/xlink",
  xml: "http://www.w3.org/XML/1998/namespace",
  xmlns: "http://www.w3.org/2000/xmlns/"
}

Files

d3-selection.md

Latest commit

History

d3-selection.md

File metadata and controls

选择元素

d3.selection | Function

d3.selectAll | Function

d3.select | Function

selection.selectAll | Function

selection.select | Function

selection.filter | Function

selection.merge | Function

d3.matcher | Function

d3.selector | Function

d3.selectorAll | Function

d3.window | Function

d3.style | Function

修改元素

selection.attr | Function

selection.classed | Function

selection.style | Function

selection.property | Function

selection.text | Function

selection.html | Function

selection.append | Function

selection.insert | Function

selection.remove | Function

selection.sort | Function

selection.order | Function

selection.raise | Function

selection.lower | Function

d3.creator | Function

selection.data | Function

selection.enter | Function

selection.exit | Function

selection.datum | Function

事件处理

selection.on | Function

selection.dispatch | Function

d3.event | Attribute

d3.customEvent | Function

d3.mouse | Function

d3.touch | Function --待验证

d3.touches | Function --待验证

控制流

selection.each | Function

selection.call | Function

selection.empty | Function

selection.nodes | Function

selection.node | Function

selection.size | Function

本地变量

d3.local | Function

local.set | Function

local.get | Function

local.remove | Function

local.toString | Function

命名空间

d3.namespace | Function

d3.namespaces | Attribute