Chart movement after mouse over

GoJS
#1

Hello,

I try to use the mouseEnter and mouseLeave events in order to emphasize a node (and all the connected nodes and links) during the mouse over. So what I do is to create a thicker border for these nodes and a thicker line for the links by changing the strokeWidth when I enter a node. Then, when I leave the node, I change everything back to the initial values.

This works fine. The only problem is that, in the end, this mouse over produces a movement in the whole chart (or in a part of the chart). I mean that the nodes seem to move a bit from their initial position during the mouse over event. So, is there a way to highlight the border of the nodes and the lines without having this movement?

Thanks a lot!

P.S. I have tried this in both LayeredDigraph and ForceDirected layout.

#2

Just change the Part.layoutConditions for your Nodes:

layoutConditions: go.Part.LayoutStandard & ~go.Part.LayoutNodeSized

I am guessing that what is happening is that by changing the size of a node you are causing another layout to be performed. I hope you can understand why the default behavior is to update the layout when a node changes size, typically because the node’s contents have changed.

#3

Hi walter. Thanks for the answer.
As far as I can understand you mean something like this:

nodeTemplate (
g(
go.Node
,‘Auto’
,{ isShadowed: false, selectionAdorned: false, mouseEnter: ndMouseEnter,
<span =“Apple-tab-span” style=“white-space:pre”> mouseLeave: ndMouseLeave, selectionChanged: nodeSelectionChanged,
<span =“Apple-tab-span” style=“white-space:pre”> layoutConditions: go.Part.LayoutStandard & ~go.Part.LayoutNodeSized })


Right? Well, after using this, I have a little less movement of the nodes, but the difference is not really so noticeable. The nodes are still moving…
Is something missing? Any other ideas?
Thanks again!

#4

Yes, that was what I meant for you to try.

Is everything moving by the same offset? If so, then maybe the nodes are not moving but the viewport is scrolling. Have you set the Diagram.contentAlignment or Diagram.autoScale properties? FYI: Intro to initial views.

#5

Yes I have already set this properties but there is still no improvement.
However I found another solution for my case, so now I don’t need to change the thickness of the border of the nodes and consequently I don’t have any movement :)

Thanks a lot for your answers :)

#6

Sorry, but you misunderstood my question. I was asking if you had set Diagram.contentAlignment or Diagram.autoScale, because doing so might cause scrolling in order to maintain content alignment or fit within the viewport, as discussed on that Introduction page.

If you didn’t set those properties, my guess was that you wouldn’t see that shifting.

#7

Well yes I misunderstood indeed Embarrassed
I have set these properties because I need them to be set. However I tried to unset these properties and nothing changed regarding the movement.

But finally this is not a problem any more since I found another solution (as I said above). Smile