0

HTMLキャンバス要素に描かれた円弧の内側でのマウスクリックをどのように検出しますか？

私は次のようにアークを作成しています：

ctx.beginPath();
ctx.arc(250, 250, outsideRadius, angle, angle + arc, false);
ctx.arc(250, 250, 0, 0, 0, true);
ctx.fill();

描画される各アークのコンテキストオブジェクトを関連付けて、後でmyArc.ctx.isPointInPath（mouseX、mouseY）を使用しようとしましたが、機能しませんでした。したがって、基本的な三角法を使用して、マウスクリックかどうかを判断します。境界内にあるかどうか。

前もって感謝します！

4

1 に答える 1

2

あなたは使用する必要があります

ctx.isPointInPath（x、y）;

私がしたことは、beginPath、パス「描画」を関数に移動し、描画、およびマウスが形状に当たったかどうかを判断するためにも呼び出しました。

function shape() {
    ctx.beginPath();
    ctx.arc(250, 250, outsideRadius, angle, angle + arc, false);
    ctx.arc(250, 250, 0, 0, 0, true);
}

function draw() {
    shape();
    ctx.fill();
}

function checkHit(x, y) {
    shape();
    return ctx.isPointInPath(x, y);
}

このようにアプリを作成すると、他の図形も簡単に追加できます

于 2012-05-01T20:08:54.260 に答える