Javascript d3.js捆绑布局,移动节点inklusiv行
我想移动捆绑布局中的选定节点并重新绘制该行 你对我如何解决那个问题有什么建议吗 首先,我尝试通过translate移动节点:Javascript d3.js捆绑布局,移动节点inklusiv行,javascript,d3.js,Javascript,D3.js,我想移动捆绑布局中的选定节点并重新绘制该行 你对我如何解决那个问题有什么建议吗 首先,我尝试通过translate移动节点: node.attr("transform", function (nodeObject) { var translationValue = nodeObject.y return "rotate(" + (nodeObject.x - 90) + ")translate(" + (nodeObject.y + 20) +
node.attr("transform", function (nodeObject) {
var translationValue = nodeObject.y
return "rotate(" + (nodeObject.x - 90) + ")translate(" + (nodeObject.y + 20) + ")";
})
当然,如果我试着这样移动线路,我将一事无成。它只会移动整条线,我无法控制端点
我试图删除所有行并重新绘制它们。但是连接将指向原始点,而不是移动的连接
var line = d3.svg.line.radial()
.interpolate("bundle")
.tension(.75)
.radius(function (d) {
return d.y;
})
.angle(function (d) {
return d.x / 180 * Math.PI;
});
vis.selectAll("path.link").remove();
vis.selectAll("path.link")
.data(bundle(links))
.enter().append("path")
.each(function (d3Object) {
d3Object.source = d3Object[0], d3Object.target = d3Object[d3Object.length - 1];
})
.attr("d", line);
非常感谢你的帮助 您可以操纵线条属性并重新绘制线条
link.transition()
.attr("d",
function(d, i) {
if (d.target === d3Object || d.source === d3Object) {
line.radius(function (d) {
return d.y - 51;
});
line.angle(function (d) {
return d.x / 180 * Math.PI;
});
} else {
line.radius(function (d) {
return d.y;
});
line.angle(function (d) {
return d.x / 180 * Math.PI;
});
}
return line(splines[i]);
})
.duration(1500);
可以操纵线属性并重新绘制线
link.transition()
.attr("d",
function(d, i) {
if (d.target === d3Object || d.source === d3Object) {
line.radius(function (d) {
return d.y - 51;
});
line.angle(function (d) {
return d.x / 180 * Math.PI;
});
} else {
line.radius(function (d) {
return d.y;
});
line.angle(function (d) {
return d.x / 180 * Math.PI;
});
}
return line(splines[i]);
})
.duration(1500);