Question

有没有什么方法可以获得像弧一样的所有弧值（x y radius startangle endangle anticlockwise）？“

我的代码是：

function drawOval(x, y, rw, rh) {
        var canvas = document.getElementById("myCanvas");
        var context = canvas.getContext("2d");
        context.save();
        context.scale(1, rh / rw);
        context.beginPath();
        context.arc(x, y, rw, 0, 2 * Math.PI);
        context.restore();
        context.lineWidth = 4;
        context.strokeStyle = "black";
        context.stroke();
    }
    drawOval(80, 60, 50, 80);
    drawOval(200, 90, 50, 50);


elem.addEventListener('click', function (event) {
            alert('clicked an element');
            var x = event.pageX - elemLeft,
          y = event.pageY - elemTop;
            console.log(x, y);
    });

Answer 1

您可以使用context.isPointInPath(mouseX,mouseY).

对椭圆进行测试

演示：http://jsfiddle.net/m1erickson/stmjW/

isPointInPath将测试最近定义的路径（您的椭圆形）。

要测试你的椭圆形，你可以改变你的drawOval函数来定义 - 但不是中风，椭圆形：

    function drawOval(x, y, rw, rh) {
        context.save();
        context.scale(1, rh / rw);
        context.beginPath();
        context.arc(x, y, rw, 0, 2 * Math.PI);
        context.restore();
    }

然后点击测试任何椭圆形，你会

首先，定义椭圆：drawOval（80,60,50,80）;
第二，定义椭圆的命中测试：context.isPointInPath（mouseX，mouseY）;

点击圆圈获取弧的值（x y radius startangle endangle逆时针）

1 个答案: