使用d3将圆圈附加到组内的所有rects

时间:2015-08-28 11:22:18

标签: javascript d3.js svg hover append

我试图将圆圈附加到一个组内的所有嵌套矩形,这个矩形与我正在悬停/点击的矩形相同。我已经将一个mouseover事件添加到rect并使用了d3选择

.on("mouseover", function (d, i){

    var ypos = d3.selectAll("g." + this.id).selectAll("rect").attr('y');
    var xpos = d3.selectAll("g." + this.id).selectAll("rect").attr('x');

    d3.selectAll("g." + this.id).append("circle")
                            .attr("cx", xpos)
                            .attr("cy", ypos)
                            .attr("r", 30)
                            .style("fill" , "red")
                            .style("opacity", 0.1);

                          d3.selectAll("g." + this.id).select("*").style("fill", "red");

                      })

虽然圆圈被附加到具有该类的每个组,但是它们被附加了符合选择标准的第一个矩形的x,y协调,并且我正在努力寻找获取坐标的方法每个矩形并将圆圈应用于每组坐标。

0 个答案:

没有答案