Issue with canvas / line not following the mouse cursor

Hello Three js Team,

I hope some one really give answers to my questions.

My first question is in my dummy app the line is following the mouse cursor very nicely but in my real app i see a gap between the cursor tip and line. I guess this is something related to the canvas only.

I am attaching my real app canvas object and also my dummy app for the comparision

Also in my dummy app i need one algorithm by we i can create points that cover my red plane or box i have fixes vertical gap and horizontal also

Let say vertical gap is 0.5 unit and horizontal is 1 unit and user can give any gap and i need points in my plane according to the gaps

let say point1 is at position (0,0,0) right point should be at (1,0,0) and bottom should be at (0,0,0.5)

Something like in the screen shot

Please provide me help

This png have the way i need the points in my entire plane there are black dots indicating them

My dummy project canvas png

my real app canvas png


my dummy app link to zip

Thanks