Question

使用强制布局的d3.js使用phonejs进行应用程序。我想将图像显示为d3的节点。

以下是节点的创建方式：

node = container.append("g").selectAll("image.node")
    .data(nodes_edges_json.nodes)
    .append("svg:image")
    .attr("class", "node")
    .attr("xlink:href", function(nodeObj) { return nodeObj.image; })
    .attr("width", function(nodeObj) { return setHeightWidth(nodeObj); })
    .attr("height", function(nodeObj) { return setHeightWidth(nodeObj); })
    .attr("x", function(nodeObj) { return setXYCoordinates("x", nodeObj); })
    .attr("y", function(nodeObj) { return setXYCoordinates("y", nodeObj); })
    .attr("title",function(nodeObj) { return nodeObj.name;})
    .call(drag);

目前它不会显示图像来代替节点。

Answer 1

您可能需要添加enter（）

node = container.append("g").selectAll("image.node")
.data(nodes_edges_json.nodes).enter() //  <-----------------HERE
.append("svg:image")
.attr("class", "node")
.attr("xlink:href", function(nodeObj) { return nodeObj.image; })
.attr("width", function(nodeObj) { return setHeightWidth(nodeObj); })
.attr("height", function(nodeObj) { return setHeightWidth(nodeObj); })
.attr("x", function(nodeObj) { return setXYCoordinates("x", nodeObj); })
.attr("y", function(nodeObj) { return setXYCoordinates("y", nodeObj); })
.attr("title",function(nodeObj) { return nodeObj.name;})
.call(drag);

将svg图像显示为phonejs中d3.js的节点

1 个答案: