1

我正在用 HTML5 画布编写游戏。如果一条线触及自己或对手线的任何点，则该线停止移动。我写的函数如下。

function hasPoints(x, y) {
  for (var i = 0; i < points.length; i++) {

    if (Math.abs(points[i][0] - x) < 2 && Math.abs(points[i][1] - y) < 2) {
        return true;
        break;
    }
  }
  return false;
}

//check if this point crosses other players' points
if (hasPoints(p1.x,p1.y) || canPlay==false) {
    clearLoop();
}else{
    context.fillStyle = "green";
    context.fillRect(p1.x,p1.y, 5,5);
    addPoints(p1.x,p1.y);       
    sendMyPoints();     
    loopTimer = setTimeout('drawLine()', 50);
}

它大部分时间都有效。但在某些特殊情况下（如下图所示），它根本无法返回 false。

任何人都可以帮助我改进此功能，使其完美运行吗？

线崩溃

4

2 回答 2

2

不要使用点，使用向量。向量数组。要找出一个点是否与一条线（矢量）接触，只需用两个点安装一个三角形并进行点矢量分析，如果三角形的面积接近零（设置一个限制），那么这个接触。

y1 x1 1
y2 x2 1 = (y1*x2*1)+(x1*1*y3)+(1*y2*x3)-(x1*y2*1)-(y1*1*x3)-(1*x2*y3)
y3 x3 1
结果应该接近于零（0.012121 ...）
这是一种发现线是否与目标对齐的方法
http://en.wikipedia.org/wiki/行列式

于 2013-01-27T03:02:50.943 回答
-1

对向量使用数学表达式，然后您可以检查向量是否相互交叉

于 2013-01-27T03:50:15.570 回答