d3.js 在选择上附加基本事件
示例
通常，您将需要为对象创建事件。
function spanOver(d,i){
var span = d3.select(this);
span.classed("spanOver",true);
}
function spanOut(d,i){
var span = d3.select(this);
span.classed("spanOver", false);
}
var div = d3.select('#divID');
div.selectAll('span')
.on('mouseover' spanOver)
.on('mouseout' spanOut)
此示例将鼠标spanOver悬停在具有ID的div内的跨度上时添加类，divID并在鼠标退出跨度时将其删除。
默认情况下，d3将传递当前跨度和索引的原点。this上下文也是当前对象，这非常方便，因此我们可以对其进行操作，例如添加或删除类。
您也可以只在事件上使用匿名函数。
div.selectAll('span')
.on('click', function(d,i){ console.log(d); });
数据元素也可以添加到当前选定的对象。
div.selectAll('path')
.on('click', clickPath);
function clickPath(d,i) {
if(!d.active) {
d.active= true;
d3.select(this).classed("active", true);
}
else {
d.active= false;
d3.select(this).classed("active", false);
}
}
在此示例中，未触发click事件之前未在选择中定义active。如果您要返回路径选择，尽管所有单击的对象都将包含active键。
-
本文向大家介绍d3.js 基本选择和修改，包括了d3.js 基本选择和修改的使用技巧和注意事项，需要的朋友参考一下 示例 如果您熟悉jQuery和Sizzle语法，则d3选择应该不会有太大不同。d3模仿W3C Selectors API，使与元素的交互更加容易。 作为一个基本示例，请选择全部<p>并对其进行更改： 简而言之，这与jQuery中的相对相同 通常，您将对容器div进行一次选择，以添加一
-
本文向大家介绍d3.js 不同的选择器，包括了d3.js 不同的选择器的使用技巧和注意事项，需要的朋友参考一下 示例 您可以使用不同的选择器选择元素： 按标签： "div" 按类别： ".class" 依编号： "#id" 按属性： "[color=blue]" 多个选择器(OR)： "div1, div2, class1" 多个选择器(AND)： "div1 div2 class1"
-
下列选项是根据在第一步选择的文件格式而有所不同。 包含列的标题 如果勾选了这个选项，字段名将会包含在导出的文件。 如果零，留空白 如果字段内容是 0，留空白。 追加 将记录追加至现有的文件。 遇到错误时继续 在导出进程中忽略遇到的错误。 在 XML 中使用属性格式 属性格式 <RECORDS> <RECORD OrderNo="1003" ItemNo="1" PartNo="1313" Qty=
-
下列选项是根据在第一步选择的文件格式而有所不同。 包含列的标题 如果勾选了这个选项，字段名将会包含在导出的文件。 如果零，留空白 如果字段内容是 0，留空白。 追加到输出文件 将记录追加至现有的文件。 遇到错误时继续 在导出进程中忽略遇到的错误。 记录分隔符、字段分隔符、文本标识符号 指定记录的分隔符号、字段的分隔符号和用于括住文本值的字符。 日期排序、日期分隔符 指定日期的格式和日期的分隔符。
-
下列选项是根据在第一步选择的文件格式而有所不同。 包含列的标题 如果勾选了这个选项，字段名将会包含在导出的文件。 如果零，留空白 如果字段内容是 0，留空白。 追加 将记录追加至现有的文件。 遇到错误时继续 在导出进程中忽略遇到的错误。 在 XML 中使用属性格式 属性格式 <RECORDS> <RECORD OrderNo="1003" ItemNo="1" PartNo="1313" Qty=
-
Chrome不使用D3.js选择。在下面的代码中，所有选择都是空的。 如果将替换为，就可以了。