D3js, как добавить 2 детей на одном уровне в контексте .enter

У меня возникла проблема с тем, чтобы поместить круг и текст внутри группы (одинаковый уровень, а не внутри друг друга) в контексте .enter()

var categorized = g1.selectAll("g.node").data(dataset, function(d){return d.id})

categorized
.enter()
    .append("g")
    .attr("id", function(d,i){return d.id;});

categorized
.enter().append("circle")
    .style("fill", "#ddd");
// throws an error

categorized
.append('text')
    .text(function(d,i){return d.count});
// this is working but is an update so I have to remove the text on exit

Есть ли способ вернуться к родительскому, sg вот так:

categorized
.enter()
.append("g")
.append("circle")
.getBackToParent // the g
.append("text");

Ответы

Ответ 1

Просто назначьте родительскую оболочку d3 переменной:

var g = categorized.enter().append("g");
g.append("circle").style("fill", "#ddd");
g.append("text").text(function(d,i){return d.count});