javascript - d3 single node moving with cursor repelling other nodes -
i saw example on mike bostock video on youtube repelled nodes single node moved mouse cursor.
i've tried replicate , put works of 5s before starts struggling , stops altogether. jsfiddle - http://jsfiddle.net/hiwilson1/p6hxop7m/. can explain why comes halt after such short period of time?
function movenode() { var m = d3.mouse(this); force.nodes()[0].x = m[0]; force.nodes()[0].y = m[1]; } function tick() { svg.selectall(".node") .attr("cx", function(d, i) { if (i != 0) return d.x}) .attr("cy", function(d, i) { if (i != 0) return d.y}) } my best guess problem has tick event , mousemove event working hard , running concurrently, although have other examples of 2 working harmoniously.
any appreciated.
update: adding force.start() @ end of movenode(), directly after manually influencing force.nodes()[0] coordinates has fixed it. can explain me does?
from d3 documentation (my emphasis):
force.start()
starts simulation; method must called when layout first created, after assigning nodes , links. in addition, should called again whenever nodes or links change.
you're not calling start() in tick function, animation ending gracefully. add force.start() end of tick() , should work fine.
Comments
Post a Comment