Javascript d3js强制布局为每个节点动态添加图像或圆

我是D3JS新手，我需要为每个节点创建带有图像或圆圈的强制布局。 也就是说，可以动态添加图像节点或圆节点。

---

这是可能的吗？如果有任何例子，请回答< /P> < P>如果你只想在圆圈中间有一个图像，试试这个：

/* Create nodes */
var node = vis.selectAll("g.node")
    .data(json.nodes) // get the data how you want
    .enter().append("svg:g")
    .call(node_drag);

/* append circle to node */
node.append("svg:circle")
    .attr("cursor","pointer")
    .style("fill","#c6dbef")
    .attr("r", "10px"})

/* append image to node */
node.append("image")
    .attr("xlink:href", "https://github.com/favicon.ico")
    .attr("x", -8)
    .attr("y", -8)
    .attr("width", 16)
    .attr("height", 16);

---

你也可以附加一个标题，一些文字。。。有关更多信息，请参阅

选择。附加（名称）

对于动态图像，可以将图像保留在本地，使用图像名称可以从本地使用动态图像

要制作圆，可以使用：

 var groups = node.enter().append("g")
        .attr("class", "node")
        .attr("id", function (d) {
            return d.entityType;
        })
        .on('click', click)

    groups.append("circle")
       .attr("cursor", "pointer")
       .style("fill", function(d) { return color(d.entityType); })
       .style("fill", "#fff")
       .style("stroke-width", "0")
       .style("stroke", "#ddd")
     .attr("r", 20);

groups.append("text")
        .attr("dy", 18)
        .style("font-size", "2.5px")
        .style("text-anchor", "middle")
        .style('fill','#000')
        .attr("refX", 15)
        .attr("refY", -1.5)
        .text(function (d) {
            return d.entityName;
        });

这里，d.entityType将是图像示例的名称：favicon.png

groups.append("image")
       .attr("xlink:href",function (d) {
            return "../assets/images/"+d.entityType+".png";
            })
        .attr("x", -14)
        .attr("y", -15)
        .attr("width", 30)
        .attr("height", 30)

如果要在圆内添加文本，可以使用：

 var groups = node.enter().append("g")
        .attr("class", "node")
        .attr("id", function (d) {
            return d.entityType;
        })
        .on('click', click)

    groups.append("circle")
       .attr("cursor", "pointer")
       .style("fill", function(d) { return color(d.entityType); })
       .style("fill", "#fff")
       .style("stroke-width", "0")
       .style("stroke", "#ddd")
     .attr("r", 20);

groups.append("text")
        .attr("dy", 18)
        .style("font-size", "2.5px")
        .style("text-anchor", "middle")
        .style('fill','#000')
        .attr("refX", 15)
        .attr("refY", -1.5)
        .text(function (d) {
            return d.entityName;
        });

---

谢谢克里斯·詹姆斯。是否可以用文字和图像圈出圆圈？是的，总的来说，它只是加起来。了解如何操作的最好方法是在www.d3js.org上浏览force graph的示例