JulianLaval / canvas-particle-network

Simple animated particle network using Canvas and JavaScript

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Mouse over location has offset

svcninja opened this issue · comments

Div inside another div, the mouse interaction with the constellation has a x offset

I am also facing the issue.

I also discovered this problem. You can replace the two lines of code as follows so the mouse interaction is properly located.

      // Mouse event listeners
      this.canvas.addEventListener(
        "mousemove",
        function(e) {
          this.mouseParticle.x =
            // e.clientX - this.canvas.offsetLeft; << replace this
            e.clientX - this.canvas.getBoundingClientRec().left; 
          this.mouseParticle.y =
            // e.clientY - this.canvas.offsetTop; << replace this
            e.clientY - this.canvas.getBoundingClientRec().top;
        }.bind(this)
      );