p5.js使用if语句不满足条件时画一个方框

Question

我已经为此苦恼了好几次 hours.I 必须在光标位于特定位置时使用 if 语句创建形状，我已经完成了。如果两个条件都不满足，我还需要画一个形状，我只完成了一半。是否有人可以就我完成任务需要考虑的事项提供一些指导？enter image description here

function draw()
{
    // draw the image
    image(img,0,0);

    //Write your code below here ...

//91m distance dark circle  
if(dist(mouseX, mouseY,1491, 585)<= 91)
{
    fill(0,139,139);
    ellipse(1491, 585,91 * 2, 91 * 2);

}
//Fish wholsalers   
if(mouseX > 1590 && mouseX < 1691
    && mouseY > 614 && mouseY < 691)
{
    fill(25, 25, 112)
    rect(1590,614,104,77) 

}
//neither position
if(dist(mouseX, mouseY,1491, 585)>= 91 && (mouseX > 1690 && mouseX < 1590 && mouseY < 614 && mouseY > 691) )
{
    fill(124, 252, 0)
    rect(1564, 183, 322, 173 )  
}

Answer 1

我认为你必须这样做：

//91m dist dark circle
if( yourCondition )
{

    yourCode;

}

// Fish wholsalers
else if( yourOtherCondition )
{

    yourOtherCode;

}

// neither position
else
{

    yourOtherOtherCode;

}

Answer 2

最简单的解决方案是使用 2 个变量。

判断鼠标是否in_range:

var in_range = dist(mouseX, mouseY,1491, 585)<= 91;

判断鼠标是否在边界内：

var in_bounds = mouseX > 1590 && mouseX < 1691 && mouseY > 614 && mouseY < 691;

分别根据条件in_range、in_bounds绘制矩形!in_range && !in_bounds.

var in_range = dist(mouseX, mouseY,1491, 585)<= 91;
var in_bounds = mouseX > 1590 && mouseX < 1691 && mouseY > 614 && mouseY < 691; 

if (in_range)
{
    fill(0,139,139);
    ellipse(1491, 585,91 * 2, 91 * 2);
}

if (in_bounds)
{
    fill(25, 25, 112)
    rect(1590,614,104,77) 
}

if(!in_range && !in_bounds)
{
    fill(124, 252, 0)
    rect(1564, 183, 322, 173 )  
}

如果不允许使用变量：

<的反义词是>=，>的反义词是<=。
A && B的反义词分别是!(A && B)!A || !B.
x > A && x < B 的反义词是 x >= A || x <= B。

你的情况是：

if (!(dist(mouseX, mouseY,1491, 585) <= 91) &&
    !(mouseX > 1590 && mouseX < 1691 && mouseY > 614 && mouseY < 691))
{
    fill(124, 252, 0)
    rect(1564, 183, 322, 173 )  
}

或

if (dist(mouseX, mouseY,1491, 585) > 91 &&
    (mouseX <= 1590 || mouseX >= 1691 || mouseY <= 614 || mouseY >= 691))
{
    fill(124, 252, 0)
    rect(1564, 183, 322, 173 )  
}

p5.js使用if语句不满足条件时画一个方框

p5.js Draw a box when the conditions are not met using an if statement

javascript

processing

p5.js