d3:可选择根据强制布局中的节点内容添加子元素

sil*_*sil 2 javascript d3.js force-layout

使用d3中的force布局,我可以愉快地添加节点,例如,一个圆圈的SVG组和一些文本:

var node = vis.selectAll(".node")
    .data(nodes)
    .enter().append("svg:g")
    .attr("class", "node");
node.append("svg:circle")
    .attr("r", 5);
node.append("svg:text")
    .text(function(d) { return d.nodetext });
Run Code Online (Sandbox Code Playgroud)

但是,我想根据节点数据选择向组中添加另一个元素:因此,如果此节点的数据包含"image"属性,我想添加一个新的子元素(svg:image) ).将svg:image添加到所有节点很容易(我只是这样做,因为我已经完成了上面的圆圈和文本).动态更改已创建元素的属性也很容易(通过将函数作为属性的值,text如上所述).我不知道如果数据包含属性,如何添加svg:image子元素.实现这一目标的最佳方法是什么?image

mbo*_*ock 11

尝试selection.filter:

node.filter(function(d) { return d.image; }).append("image")
    .attr("xlink:href", function(d) { return d.image; })
    .attr("width", 16)
    .attr("height", 16);
Run Code Online (Sandbox Code Playgroud)