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.

(updated jsfiddle here)


Comments

Popular posts from this blog

Email notification in google apps script -

c++ - Difference between pre and post decrement in recursive function argument -

javascript - IE11 incompatibility with jQuery's 'readonly'? -