0

In this jsfiddle a force layout is implemented, with special feature of highlighting selected node (together with all links from that node, and nodes that are on the other end of these links).

Most of the time the method works, however when I hit the boundary while dragging selected node, suddenly all layout is highlighted, and it returns to desired state once the node is dragged away from the boundary. This is illustrated in the following animation:

(ERROR IS WHEN DRAGGED NODE HITS THE WALL)

enter image description here

Can this be fixed?

(This example is implemented based on this question, there one can read explanation of the code etc.)

EDIT: Please see Dragging and highlighting for different approach to this problem.

enter image description here

This is achieved by adding lines:

force.drag().on('drag', fade(.1));
force.drag().on('dragend', fade(1));

Modified fiddle is here.

Community
  • 1
  • 1
VividD
  • 10,456
  • 6
  • 64
  • 111
  • I think this is just an artifact coming from the cursor no longer being over the selected node. When hitting the wall, as can be seen in the illustration, you hover out of the selected node. If you are careful to hit the wall and still keep the cursor over the selected node, then it works. But, if I am speaking the obvious, then you are looking for a way to identify when the node hits the svg viewport border and make sure the cursor stays on it? – FernOfTheAndes Jan 27 '14 at 13:12
  • You are right! @FernOfTheAndes Now that you told me this, i am wondering whether I should try to do something about it or just leave it as ti is... – VividD Jan 27 '14 at 13:15
  • Should I post this as an answer that you can accept? I have a mission to catch up with Lars, say, in a couple of days... – FernOfTheAndes Jan 27 '14 at 13:17
  • Let me just think for 15 min... WIll be back... @FernOfTheAndes – VividD Jan 27 '14 at 13:18
  • @FernOfTheAndes, please enter your explanation as the answer. If possible, some explanation that you think it would sound nice to a custumer, whom I intend to tell this is a feature, not a bug. Thanks! :) – VividD Jan 27 '14 at 13:34

1 Answers1

1

I think this is just an artifact coming from the cursor no longer being over the selected node. When hitting the wall, as can be seen in the illustration, you hover out of the selected node. If you are careful to hit the wall and still keep the cursor over the selected node, then it works.

In my view this is not a bug nor a feature, but the desired behavior: when node is no longer selected, the hightlight effect is gone.

FernOfTheAndes
  • 4,975
  • 2
  • 17
  • 25
  • I accept the answer because it definitely sheds some light on the situation. But it is hard to explain to the user - he didn't release the mouse, and highlighting was as if he did. But certainly helps if we know what happens and why. Thanks! – VividD Jan 27 '14 at 14:01
  • I agree and sorry if I sounded dismissive re. the user situation...it is not an easy one. I did spend some time thinking of a solution such as trapping the mouse coordinates and doing something when they were outside the viewport, etc. Are you thinking of pursuing some solution? – FernOfTheAndes Jan 27 '14 at 14:04
  • No, not at this time. There wasn't anything dismissive, I was just thinking aloud, commenting etc. ... Thanks again! :) – VividD Jan 27 '14 at 14:06