0

我有 HTML 5 圆形拖放示例，

http://jsfiddle.net/eGjak/503/

我想关注事情

  1. 防止在画布外拖动圆圈

  2. 在圆圈上隐藏线条

  3. 防止拖过另一个圆圈

我玩了一些代码，但没有运气。任何人都可以通过逻辑或一些有用的资源帮助我

4

1 回答 1

3

  1. 这是个简单的。它只是检查 x 不会离开屏幕的左侧或右侧， y 不会离开屏幕的顶部或底部

    如果 (x>0 || x<(canvas.width - circle.width) && y>0 || y<(canvas.height - circle.height)) {

    ...update...

    }

  2. 在这里，您需要进行线/圆碰撞检查。见这里。

  3. 为此，您需要圆/圆碰撞检测。如果发生碰撞，以下将返回 true，否则返回 false：

    this.isIntersecting = function(c1center, c1radius, c2center, c2radius)
{

    var dX = Math.pow(c1center.x - c2center.x, 2);
    var dY = Math.pow(c1center.y - c2center.y, 2);
    var r2 = Math.pow(c1radius.radius() + c2radius.radius(), 2);
    return (dX + dY <= r2);
}

c1center 和 c2center 是具有 x, y 属性的对象（例如c1center = {x:0, y:0 }：）

于 2012-06-17T23:26:37.200 回答