search

dash14 / v-network-graph

An interactive network graph visualization component for Vue 3
https://dash14.github.io/v-network-graph/
MIT License
485 stars 44 forks source link

Bug in Tooltip example #85

Closed jjackevans closed 1 year ago

jjackevans commented 1 year ago

Hi,

There's a small issue in the tooltip example. If a tooltip is created on a node and then a pan/zoom operation is performed, if the user hovers over the same node, it will position the tooltip relative to the old position (before the pan/zoom).

I have fixed this simply by setting the targetNodeId to null on the node:pointerout event.

  "node:pointerout": () => {
    tooltipOpacity.value = 0 // hide
    targetNodeId.value = null
  },
dash14 commented 1 year ago

Hi @jjackevans, Thank you for reporting the problem in the example! In my environment, when targetNodeId was set to null, the tooltip position was momentarily displayed as (0, 0) when the pointer was removed from the node, so it was modified to use watch to calculate the position. Similarly, the Tooltip example in Edge has been fixed. https://dash14.github.io/v-network-graph/examples/event.html#tooltip

Thank you for your support!