我试图将一个值传递给一个 d3 单击事件绑定到一个由一个圆圈和一个字母组成的组。然而,这个值在回调函数中仍然是“未定义”。另一方面,如果我将相同的值传递给同一组的另一个函数,例如 .text(d => d.value) 可以正常工作。问题仅在于点击事件。请找到我的一段代码:
//The parent svg
var s = d3.select("#"+this.id) //this refers to the current object
.append("svg")
.attr("id",this.svgid)
.attr("width","100%")
.attr("height","100%");
//The value to be passed to the click event
const dd = [{value:"whatever"}];
var group1 = s.data(dd).append("svg:g");
//First element of the group = a circle
group1.append("svg:circle")
.attr("cx","85%")
.attr("cy","20%")
.attr("r","10px")
.attr("fill","#FFFFFF");
//Second element of the group = letter i
group1.append("svg:text").text("i")
.attr("x","85%")
.attr("y","25%")
.attr("fill","#555555");
group1.append("svg:text").text(d => d.value).attr("x","50%").attr("y","50%");//This line works fine
group1.on("click",d => console.log(d.value));//This line returns 'undefined'--> Why?
我尝试了多种回调函数,例如 function(d){console.log(d.value);} 但没有成功。有什么想法吗?
替换
group1.on("click",d => console.log(d.value));
与
group1.on("click",(e, d) => console.log(d.value));
从 D3 V6 开始, event 作为第一个参数传递给鼠标事件回调
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句