在“处理”中未在鼠标下绘图答案

【问题标题】：Not drawing under the mouse in "Processing"在“处理”中未在鼠标下绘图
【发布时间】：2017-02-01 03:30:29
【问题描述】：

我想通过拖动鼠标在一个地方绘制，并在画布中心周围的 3 个地方绘制线条，包括光标本身下方的一个。我正在使用以下代码，它确实画了 3 条线，但它们都没有在鼠标光标下：

void setup(){
   size(300, 300); }

void draw() {
  translate(width/2, height/2); 
  if(mousePressed)
    for(int i=0; i<3; i++){
      line(width/2 -mouseX,  height/2 -mouseY, 
           width/2 -pmouseX, height/2 -pmouseY);
      rotate(2*PI/3);  }}

如何更正此代码，以使一个图形位于鼠标光标下方，而其他 2 个图形相应地旋转？

【问题讨论】：

请注意，在人们花时间回答问题后删除问题有点粗鲁。减少人们将来帮助您的可能性。 :(
这是一个愚蠢的错误，简短的评论就足够了。我现在尝试查看是否可以取消删除它，但它不再可用。我发现您的许多其他帖子也非常有用。

标签： processing mouse draw

【解决方案1】：

您必须考虑与您的translate() 和rotate() 通话相关的点在哪里。

首先你翻译，所以原点在屏幕的中心，而不是在左上角。所以你所有的点都需要相对于中心而不是相对于左上角。

要调试它，我首先要摆脱 for 循环并简单地绘制一个点或一条线：

void setup() {
  size(300, 300);
}

void draw() {
  translate(width/2, height/2); 
  if (mousePressed) {
    line(width/2 -mouseX,  height/2 -mouseY, 
      width/2 -pmouseX, height/2 -pmouseY);
  }
}

您会看到这是关闭的，这意味着您计算线位置的逻辑是错误的。你可以玩这个来注意一个模式，你可以考虑一些例子。

中心点是150,150。那么如果鼠标在160,160，我们应该在什么位置画点呢？记住它是相对于150,150，所以160,160 变成10,10。

换句话说，我们从鼠标中减去中心，以找出绘制点的位置。

但是您的代码从中心减去鼠标，这是向后的。

如果您以后遇到类似的问题，我强烈建议您通过思考示例点并弄清楚它们应该去哪里的过程。方格纸是你最好的朋友。

注意：我意识到您的代码是基于我对your other question 的回答，所以这是我的错。我的顺序错了，但在你的另一个问题中没关系，因为你翻译了 4 次（所以鼠标光标还是被覆盖了）。

【讨论】：