未在 "Processing" 中的所需位置绘图

Question

我试图通过鼠标拖动在一个地方绘制（例如，左上象限中的一个圆圈），并使图形出现在 canvas 中心周围的 4 个位置（包括右下角的一个）鼠标光标）。我尝试了以下代码：

int x=0;
int y=0;

void setup(){
   size(400, 400);  
   background(255); 
   translate(width/2, height/2); 
}
void draw() {
}

void mouseDragged(){
    translate(width/2, height/2); 

    for(int i=0; i<4; i++){
      rotate(PI/2); 
      x= mouseX ; y=mouseY;
      line(x, y, mouseX, mouseY);
    }
  }

但是，在鼠标光标下没有绘制图形。如果我非常靠近左上角，线条会绘制在 canvas 的中心。

其次，总共绘制了 5 个数字，而不是我尝试的 4 个。如果我在左上角附近绘制，不需要的图形会出现在 canvas 的右下角。这个不需要的数字比其他数字更暗。

错误在哪里，如何纠正这两个问题？我想通过旋转命令（围绕 canvas 的中心旋转）来实现这一点，尽管我看到我也可以使用翻译命令在 canvas 上的 4 个位置绘制。

感谢您的帮助。

Answer 1

None 你的点在鼠标下，因为你在绘制点之前翻译了 canvas（到 width/2, height/2），但你使用的是 mouseX, mouseY 来画他们。将 mouseX, mouseY 视为距 upper-left 角的 X 和 Y 距离。如果你想让一个点在鼠标下方，你必须使用你平移到的点的距离！

换句话说，不是这个：

x = mouseX; 
y = mouseY;

你想要这个：

x = width/2 - mouseX; 
y = height/2 - mouseY;

至于多抽点，好像是side-effect使用了mouseDragged()功能。那里发生了一些奇怪的事情，但是您可以通过使用 draw() 函数和 mousePressed 变量而不是 mouseDragged() 函数来解决这个问题。

编辑： 我调换了它们应有的顺序。查看我对您的回答以获得更好的解释。

未在 "Processing" 中的所需位置绘图

Not drawing at desired position in "Processing"

mouse

processing