d3通过id获取rect属性

hGe*_*Gen 0 javascript svg selection d3.js

我试图在svg中选择rect对象的属性时遇到了问题.这是我想从中获取值的矩形:

<rect id="2" x="13.761467889908257" y="50" width="49.31192660550459" height="50" fill="rgb(43,0,0)"></rect>
Run Code Online (Sandbox Code Playgroud)

为了计算另一个矩形的x位置,我需要x值.

我尝试了一些不同的想法,如:

svg.selectAll("rect")
   .select("id",2);               // 1st version
   .select("id","2");             // 2nd version
   .select("#2");                 // found in another d3 tutorial -> not working for me
Run Code Online (Sandbox Code Playgroud)

还有更多.有没有办法做到这一点?

//如果您需要更多我的代码,只需在评论中写下我不确定写多少就不要写太多

rkg*_*on2 6

根据HTML 4,id不能以数字开头.HTML 5确实改变了这一点,但CSS和d3仍然不支持这一点.因此,如果没有必要,可能更容易将id值更改为不以数字开头.#2我认为这就是选择器无法正常工作的原因.

如果你想保留id = 2,你可以使用属性选择器在一行中完成,如下所示:

svg.select("rect[id='2']")
Run Code Online (Sandbox Code Playgroud)

你可以在这里阅读Mike Bostock关于id从数字开始的内容.

然后,一旦你做出选择,就行了.attr("x").