在“处理"中没有在鼠标下绘制. [英] Not drawing under the mouse in "Processing"

问题描述

我想通过拖动鼠标在一个位置进行绘制，并在画布中心周围的3个位置绘制线条，包括光标本身下方的一个位置.我正在使用以下代码，该代码确实绘制了3条线，但是它们都不在鼠标光标下方:

I want to draw at one place by dragging the mouse and have the line drawn at 3 places around the center of canvas, including one under the cursor itself. I am using following code which does draw 3 lines but none of them is under the mouse cursor:

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);  }}

如何更正此代码，以使一个图形位于鼠标光标的正下方，而另两个图形相应地旋转?

How can I correct this code so that one drawing is right under mouse cursor and other 2 are rotated accordingly?

推荐答案

您必须考虑与translate()和rotate()调用相关的点.

You have to think about where your points are in relation to your translate() and rotate() calls.

首先翻译，所以原点位于屏幕的中心，而不是左上角.因此，所有点都必须相对于中心而不是相对于左上角.

First you translate, so the origin is in the center of the screen instead of in the upper-left corner. So all of your points need to be relative to the center instead of relative to the upper-left corner.

要调试此功能，我将从摆脱for循环开始，然后简单地绘制一个点或一条直线:

To debug this, I'd start by getting rid of the for loop and simply drawing a single point, or a single line:

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);
  }
}

您会看到这是关闭的，这意味着您计算线位置的逻辑是错误的.您可以使用它来注意到一个模式，并且可以考虑一些示例点.

You'll see that this is off, which means your logic for computing the line's position is wrong. You can play with this to notice a pattern, and you can think about some example points.

中心点是150,150.因此，如果鼠标位于160,160处，我们应该画点到什么位置?请记住，它是相对于150,150的，所以160,160变为10,10.

The center point is 150,150. So if the mouse is at 160,160, what position should we draw the point? Remember it's relative to 150,150, so 160,160 becomes 10,10.

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

In other words, we're subtracting the center from the mouse to figure out where to draw the point.

但是您的代码将鼠标从中心向后减去.

But your code subtracts the mouse from the center, which is backwards.

如果将来遇到类似的问题，我强烈建议您仔细考虑示例要点并弄清楚应该去哪里.方格纸是您最好的朋友，像这样的东西.

If you have similar problems in the future, I highly suggest going through the process of thinking of example points and figuring out where they should go. Graph paper is your best friend with stuff like this.

注意:我意识到您是根据我对您还有其他问题，所以这很糟糕.我输入的命令有误，但是在您提出的其他问题中都没有关系，因为您进行了4次翻译(因此无论如何鼠标光标都被遮住了).

Note: I realize that you're basing your code off my answer to your other question, so that's my bad. I got the order wrong, but it didn't matter in your other question because you were translating 4 times (so the mouse cursor got covered anyway).

这篇关于在“处理"中没有在鼠标下绘制.的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！