Tooltip when I hover over a node

Questions
1

I am implementing a network graph with nodes and edges.

  1. ) Is there a way to mouse over the node and display the details of the particular node in tooltip
  2. ) Can I click the node and navigate to another page in three js.

Any help would be appreciated. I am completely new to three js
Thanks in advance!:slight_smile:

2

Iā€™m not quite 100% sure what you mean by a node, but:

  • if your nodes are meshes, you can use raycasting to interact with them (display tooltips / navigate to other pages), see this example (source code)
  • if your nodes are DOM elements, you can handle interaction with basic javascript, and, if necessary, align them with 3D objects using CSS2DRenderer (source code)
1 Like
3

I am referring to nodes in a graph (eg. nodes representing ip addresses in network traffic)

4

I understand - what I meant is how you represent these nodes in your app, depending on whether you use DOM nodes or Three.Meshes, the solution is a bit different.

1 Like
5

This is how the code looks like, I am completely new to this, so I am finding it difficult to put the piece of code that you sent in a right place

index.html (4.0 KB)Common.js (848 Bytes) Graph.js (10.0 KB) OrbitControls.js (25.4 KB)