当我在 D3 中单击鼠标时,我试图返回矩形的“类”和“子任务”属性的值。
var projectRectangles = rectangles.append("rect")
.attr("id", function(d) { return (d)[7]; })
.attr("class", function(d) { return (d)[3]; })
.attr("subtasks", function(d) { return (d)[4]; })
.on("click", function() {expandTasks(this.id, this.class, this.subtask); });
function expandTasks(task_id, task_subtasks, task_class) { alert(task_id + '/' + task_subtasks + '/' + task_class);};
示例响应:1/undefined/undefined
它返回 this.id 很好,但 this.class 和 this.subtasks 总是返回“未定义”。 'class' 和 'subtasks' 在属性中看起来很好,那么为什么它适用于 id,而不适用于其他人?
最后,当然,我想知道将这些属性传递给另一个函数的最佳方式。
谢谢,
基思
最佳答案
您必须在单击监听器中获取类和子任务属性,如下面的代码所示。
d3.select(this).attr("class");
d3.select(this).attr("subtasks");
您也可以使用
this.className
获取类属性。但由于 subtasks
是自定义属性,您必须使用 d3 attr
来获取它方法或 html getAttribute
方法。要将属性从单击监听器传递给其他一些函数,请尝试下面显示的任何方法。
The parameter d gives the data object binded to the corresponding element.
.on("click", function(d) {
expandTasks(d[7],d[3],d[4]);
});
或者
.on("click", function(d) {
var id = d3.select(this).attr("id"); // or this.id
var className = d3.select(this).attr("class");// or this.className
var subtasks = d3.select(this).attr("subtasks"); // or this.getAttribute("subtasks");
expandTasks(id,className,subtasks);
});
关于d3.js - 如何将 SVG 元素的属性传递给 D3 中的新事件?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33275882/