从数据访问 d3.js 元素属性？

我正在尝试访问一些特定 svg 圆圈的 cx 和 cy 属性，我已经使用 d3.js 的 .data() 函数将这些圆圈绘制到屏幕上，有人可以帮忙吗？尝试访问它的代码如下。

d3.selectAll(".mynode").each( function(d, i){
  if(d.someId == targetId){
    console.log( d.attr("cx") );    // just trying to demo my point, doesn't work
  }
}

我对 d3.js 和 javascript 很陌生，所以我不确定我是否正在从后到前处理这个问题，或者我可能错过了一个内置的解决方案？

您的代码试图从数据项中获取 svg 属性，而您真正想要的是从 svg DOM 元素中获取该属性，如下所示：

console.log(d3.selectAll(".mynode").attr("cx"));

这只会为您提供选择的第一个非空元素的属性；你也可以filter https://github.com/mbostock/d3/wiki/Selections#wiki-filter您选择获取您要查找的 DOM 元素：

console.log(d3.selectAll(".mynode").filter(_conditions_).attr("cx"));

或者，如果您想访问所有选定元素的属性，请使用this在你的每个函数中：

d3.selectAll(".mynode").each( function(d, i){
  if(d.someId == targetId){
    console.log( d3.select(this).attr("cx") );
  }
}