0

HTML5の円のドラッグアンドドロップの例があります。

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

私は物事をフォローしたい

  1. キャンバスの外側に円をドラッグしないようにする

  2. 円の上に線を隠す

  3. 別の円の上にドラッグしないようにする

私はいくつかのコードで遊んでいますが、運がありません。ロジックまたは役立つリソースで、誰かが私を助けてくれますか？

4

1 に答える 1

3

  1. これは簡単なものです。xが画面の左側または右側を離れず、yが画面の上部または下部を離れないことを確認するだけです。

    if（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 に答える