函数returns一个和鼠标一样大的值靠近中心

Question

正如标题所说，我正在寻找一种检测鼠标何时接近中心的功能。这是我到目前为止所做的：

   var posX = mouseX;
   if(posX > width/2) {
      posX = width - posX;
   }
   posX = map(posX, 0, width/2, 0, 1);

   var posY = mouseY;
   if(posY > height/2) {
      posY = height - posY;
   }
   posY = map(posY, 0, height/2, 0, 1);

   speed = map(posX+posY, 0, 2, 0, 30);

如你所想，效果不是很好..

Answer 1

您可以使用一个简单的函数来计算两点之间的距离 (d = sqrt(dx² + dy²)):

function distance(x1, y1, x2, y2){
   return Math.sqrt((x2-x1)*(x2-x1)+(y2-y1)*(y2-y1));
}

并这样称呼它

var d = distance(mouseX,mouseY,width*0.5,height*0.5);

要映射它，您需要距中心的最大距离，即中心与其中一个角之间的距离

var dMax = distance(0,0,width*0.5,height*0.5);

然后你可以简单地将它映射到你喜欢的任何地方：

var mapped = map(d,0,dMax,0,1);

函数returns一个和鼠标一样大的值靠近中心

Function that returns a value as large as the mouse is near the center

javascript

processing

p5.js