Purescript MouseEvent得到x y的鼠标 [英] Purescript MouseEvent to get x y of mouse

问题描述

我是purescript的新手，并试图让鼠标事件上的3D立方体旋转。但我无法在鼠标移动事件中获得鼠标指针的x和y坐标。我附上我的代码，下面有一个事件监听器。有人可以帮助我获取鼠标的x和y坐标，或者可以告诉我为鼠标编写事件监听器的更好方法。

I am new to purescript and was trying to make a 3d cube rotate on mouse events. But I cannot get x and y coordinates of mouse pointer on mouse move event. I am attaching my code below which have a event listener. Can somebody help me in getting x and y coordinates of mouse or can tell me better way to write event listener for mouse.

node <- querySelector "#canvas"
   for_ node $ addEventListener "mousedown" $ void do
     modifyRef drag \d -> true
     xz <- getPageX
     log (show xz)
     x <- liftEff $ Window.screenX =<< window
     y <- liftEff $ Window.screenX =<< window
     modifyRef old_x \ox ->  toNumber x
     modifyRef old_y \oy ->  toNumber y
     log (show y)
   for_ node $ addEventListener "mouseup" $ void do
     modifyRef drag \d -> false
   for_ node $ addEventListener "mouseout" $ void do
     modifyRef drag \d -> false
   for_ node $ addEventListener "mousemove" $ void do
     --log "Mouse Moved!"
     x <- liftEff $ Window.screenX =<< window
     y <- liftEff $ Window.screenX =<< window
     ox <- readRef old_x
     oy <- readRef old_y
     modifyRef dX \dx -> (toNumber x - ox) * 2.0 * pi / 600.0
     modifyRef dY \dy -> (toNumber y - oy) * 2.0 * pi / 650.0
     dx <- readRef dX
     dy <- readRef dY
     dg <- readRef drag
     if dg == true then do
      modifyRef alpha \al -> al + dx
      modifyRef beta \bt -> bt + dy
      modifyRef old_x \ox -> toNumber x
      modifyRef old_y \oy -> toNumber y
      --modifyRef gamma \ga -> ga + 3.0 * pi/180.0
      else
        pure unit

推荐答案

您正在使用 window.screenX 和 window.screenY ，其中不是你想要的。您需要使用 <$而是来自 MouseEvent 类型的c $ c> screenX 和 screenY 。

You are using window.screenX and window.screenY, which is not what you want. You need to use screenX and screenY from the MouseEvent type instead.

这篇关于Purescript MouseEvent得到x y的鼠标的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！