Incorrect Hover Behavior on Nodes and a Potential Solution

[foxton9]

• Sigma.js version : 3.0.0-beta.4
• Graphology version : 0.23.0
• Operating system: Windows 10
• Web browser: Firefox 121.0.1
   
• Steps to reproduce
  • Run the Code Sandbox example
  • Move the cursor towards any hoverable node, and then move around it.
  • Observe the point at which the node becomes hovered.
     
• Expected behavior
  The node should become hovered as the cursor enters the node.
• Actual behavior
  Only when the cusor positioned at the buttom-right side of the node with some offset, the intended node will become hovered.

#1398 reported similar issues.
 

• Possible cause and solution

The issue might be due to DPI scaling not being accounted for in the coordinate calculation in the getNodeAtPosition function.

sigma.js/packages/sigma/src/sigma.ts

Lines 450 to 451 in a4a6893

	const { x, y } = position;
	const color = getPixelColor(this.webGLContexts.nodes, this.frameBuffers.nodes, x, y, this.pickingDownSizingRatio);

Updating the coordinate calculation to consider the device's pixel ratio could solve this this issue, however, it's worth considering that there may be other potential problems that have been missed.

The code change could be as follows:

const { x, y } = position;
const canvasX = x * this.pixelRatio
const canvasY = y * this.pixelRatio

const color = getPixelColor(this.webGLContexts.nodes, this.frameBuffers.nodes, canvasX, canvasY, this.pickingDownSizingRatio);

 

Pixel ratio should also be the considered when binding pickingTexture.

sigma.js/packages/sigma/src/sigma.ts

Lines 407 to 408 in a4a6893

	this.width / this.pickingDownSizingRatio,
	this.height / this.pickingDownSizingRatio,

by multiplying the ratio

this.width * this.pixelRatio / this.pickingDownSizingRatio,
this.height * this.pixelRatio / this.pickingDownSizingRatio,

This method appears to resolve an error that was reported in the browser console.

WebGL warning: drawArraysInstanced: Drawing to a destination rect smaller than the viewport rect. (This warning will only be given once)

[temuera]

+1

[jacomyal]

Thanks a lot for this very detailed report. I just pushed the fix (based on your inquiry, thanks again), and I hope to release a new beta tomorrow, with fixes on the other issues you linked.

[jacomyal]

Version 3.0.0-beta.5 has just been published, and includes the fix for this issue.