Question

我正在使用d3.js强制布局。不是在json中每个节点都有属性“extraData”和它的数组。并非所有节点都具有此属性。我需要检查这个属性何时在带有节点

的“extraData”中为每个属性添加圆圈

我用它做了一些代码

gStates = gStates.data(nodes);

    var gState = gStates.enter()
        .append("g")
        .attr({
            "transform": function (d) {
                return "translate(" + [d.x, d.y] + ")";
            },
            'class': 'node'
        })
        .call(drag);

    gState.append("circle")
        .attr({
            r: radius + 5,
            class: 'outer'
        });
gStates
        .filter(function(d) { if(d.extraData)return d; })
        .append("circle")
        .attr("r", function(d,i) { return 5+i; });

但它只添加一个圆圈任何使用完整示例或链接将是伟大的

当节点在“extraData”中有3个元素时，节点应该显示一个大圆圈和3个小圆圈包围它。就像文字一样

这里我在fiddle中创建场景json在javascript开始时有两个数组inputList和outputList，我需要为每个输入显示圆圈并输出环绕到主圆圈

Answer 1

过滤gStates选择

gStates.filter(function(d){ return d.extraData; })

进行阴影选择：

     .selectAll('.extraCircles')

将extraData数组附加到它

        .data(function(d){ return d.extraData; ).enter()

并附加一个圆圈

      .append('circle')
        .attr("r", function(d,i) { return 5+i; });

d3.js将元素追加到节点取决于实体

1 个答案: