处理 - 对象上的鼠标悬停

【问题标题】：processing - mouseOver on objects处理 - 对象上的鼠标悬停
【发布时间】：2012-02-12 23:19:56
【问题描述】：

我试图弄清楚当鼠标悬停在屏幕上的某个对象上时如何检测处理/处理 js。在这种情况下，我正在画线。似乎处理无法将“侦听器”附加到对象，所以我必须通过某种坐标检测来做到这一点 - 但我还没有找到任何好的例子。到目前为止，这是我的代码：

void draw() {
 for(int i = 0; i < commLength; i ++) { 
  ...
  line(circ.x, circ.y, circ.x + dir.x, circ.y + dir.y);
 }
}

void mouseOver(){
 //need to detect if mouse is over one of the lines.
}

【问题讨论】：

标签： processing processing.js

【解决方案1】：

我这样做的方法是检查鼠标是否在距行首和行尾一定距离内：

boolean mouseIsOverLine(float x1, float y1, float x2, float y2) {
  float d = dist(x1, y1, x2, y2);
  float d1 = dist(x1, y1, mouseX, mouseY);
  float d2 = dist(x2, y2, mouseX, mouseY);

  // distance between vertices must be similar to sum of distances from each vertex to mouse
  if (d1 + d2 < d + MOUSE_OVER_LINE_DISTANCE_THRESHOLD) {
    return true;
  }

  return false;
}

线从(x1, y1) 到(x2, y2) 的位置。此图像粗略地显示了一个返回 false（红线）和一个返回 true（绿线）的示例，具体取决于 MOUSE_OVER_LINE_DISTANCE_THRESHOLD 的值。在每种情况下，鼠标坐标都位于橙色点处。

【讨论】：