如何通过变量名为id选择svg元素

Question

如何创建一个SVG，附加一个TEXT，然后在SVG下添加一个G，它将托管一些CIRCLE？我正在创建其中的几个构造，所以只是引用.select（'svg'）不起作用，因为所有G元素都堆叠到targetDIV中的第一个SVG，而不是相应的。谢谢！ - Corbin Supak

//done in a loop several times...
svg = d3.select(targetDIV)
                        .append('svg')
                        .attr('id', targetSVG)
                        .attr('height', svgHeight)
                        .append('text')
                        .attr("transform", "translate(0,"+markSize+")")
                        .text(status)
                        .style("font-size",markSize+"px")
                        ;
                    g = d3.select(targetSVG)
                        .append('g')
                        .attr("transform", "translate("+markSize/2+", "+markSize/2+")");
                        ;
                    g.selectAll("circle")
                        .data(statusAlerts)
                        .enter()
                        .append("circle")
                        .attr("cx", function(d,i) {
                            return (i*markSize) + markSize/2 + 50;//50 is to give room for text label
                            })
                        .attr("cy", 0)
                        .attr("r", markSize/2)
                        .attr("fill", alertColor)
                        ;

Answer 1

最小的骨架......

var svg = d3.select("body").append("svg")
...;

var g = svg.select("g").append("g")
...;

svg.append("text")
...;

g.append("circle")
...;