Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/398.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 反弹在力布局中不起作用_Javascript_D3.js_Force Layout - Fatal编程技术网

Javascript 反弹在力布局中不起作用

Javascript 反弹在力布局中不起作用,javascript,d3.js,force-layout,Javascript,D3.js,Force Layout,我有四个节点,显示为数据json中给定的位置。拖动每个节点后,我已设法将每个节点设置回其给定位置。它工作正常,但默认反弹不起作用,而是快速设置为固定位置。为了给这一点一个反弹的效果,我需要改变我的代码 请看一个例子 .链接{ 冲程:#dfdfdf; } .节点文本{ 指针事件:无; 字体:10px无衬线; } .link.red{ 笔画:蓝色; } 可变宽度=500, 高度=500 var svg=d3.选择(“正文”).追加(“svg”) .attr(“宽度”,宽度) .attr(“高度”

我有四个节点,显示为数据json中给定的位置。拖动每个节点后,我已设法将每个节点设置回其给定位置。它工作正常,但默认反弹不起作用,而是快速设置为固定位置。为了给这一点一个反弹的效果,我需要改变我的代码

请看一个例子


.链接{
冲程:#dfdfdf;
}
.节点文本{
指针事件:无;
字体:10px无衬线;
}
.link.red{
笔画:蓝色;
}
可变宽度=500,
高度=500
var svg=d3.选择(“正文”).追加(“svg”)
.attr(“宽度”,宽度)
.attr(“高度”,高度);
var-force=d3.layout.force()
.重力(0)
.linkDistance(200)
.收费(0)
.尺寸([宽度、高度]);
变量节点位置=[{x:65,y:43},{x:365,y:43},{x:265,y:243},{x:65,y:243}]
var datajson={
“节点:[{“id”:1,“名称”:“a”,“组”:2,“x”:65,“y”:43,“固定”:“真”},{“id”:2,“名称”:“b”,“组”:1,“x”:265,“y”:43,“固定”:“真”},{“id”:3,“名称”:“c”,“组”:1,“x”:265,“y”:243,“固定”:“真”},{“id”:4,“名称”:“d”,“组”:2,“x”:65,“y”:243,“固定”:“真”},
“链接”:[{“源”:0,“目标”:1,“值”:1},{“源”:0,“目标”:3,“值”:1},{“源”:2,“目标”:3,“值”:1},
{“源”:2,“目标”:1,“值”:1}
]
}
力
.nodes(datajson.nodes)
.links(datajson.links)
.start();
var drag=force.drag()
.on(“dragend”,dragend);
var link=svg.selectAll(“.link”)
.data(datajson.links)
.enter().append(“行”)
.attr(“类”、“链接”);
var node=svg.selectAll(“.node”)
.data(datajson.nodes)
.enter().append(“g”)
.attr(“类”、“节点”)
.呼叫(强制拖动);
node.append(“图像”)
.attr(“x”,-8)
.attr(“y”,-8)
.attr(“类”,“反弹”)
.attr(“宽度”,45)
.attr(“高度”,45)
.attr(“xlink:href”,函数(d){
var rnd=Math.floor(Math.random()*64+1);
var图像路径=
"http://www.bigbiz.com/bigbiz/icons/ultimate/Comic/Comic"
+rnd.toString()+“.gif”;
返回图像路径;
});
node.append(“文本”)
.attr(“dx”,12)
.attr(“dy”,“.35em”)
.text(函数(d){返回d.name});
force.on(“勾号”,函数(){
attr(“x1”,函数(d){返回d.source.x;})
.attr(“y1”,函数(d){返回d.source.y;})
.attr(“x2”,函数(d){返回d.target.x;})
.attr(“y2”,函数(d){返回d.target.y;});
attr(“transform”,函数(d){return“translate”(“+d.x+”,“+d.y+”)”);});
});
函数dragend(d){
force.stop();
位置=(d.id-1);
temp\u x=节点位置[position].x;
temp_y=节点位置[position].y;
d、 x=d.px=temp_x;
d、 y=d.py=temp_y;
d、 固定=正确;
force.start();
}

将节点设置为“固定”时,没有默认反弹。当您启动力时,会出现力效果,但它不会围绕某个位置“反弹”。OK,默认情况下,它不会提供反弹效果,因为它具有固定的位置。是否有任何自定义可以提供反弹效果,即将节点重力设置为固定位置等。因此,当我们释放力时,由于重力,节点将设置为以前的位置,反弹将在那里。我不知道,释放力后如何将每个节点重力设置到固定位置。我找了很多东西,但还没有找到。谢谢你的建议。即使我不知道它是否有效,或者任何其他技巧都可能有效。当你将节点设置为“修复”时,没有默认的反弹。当您启动力时,会出现力效果,但它不会围绕某个位置“反弹”。OK,默认情况下,它不会提供反弹效果,因为它具有固定的位置。是否有任何自定义可以提供反弹效果,即将节点重力设置为固定位置等。因此,当我们释放力时,由于重力,节点将设置为以前的位置,反弹将在那里。我不知道,释放力后如何将每个节点重力设置到固定位置。我找了很多东西,但还没有找到。谢谢你的建议。即使我也不知道它会不会奏效,或者其他的方法可能会奏效。