javascript - arctoをbezierに変換する方法は？

Question

2つの関数（HTML5キャンバス）：

• arcTo（x1、y1、x2、y2、radius）;
• arcTo（x1、y1、x2、y2、rx、ry、rotation）;

ベジェ（または2次）曲線に変換する方法は？

ありがとう。

Answer 1

ありがとう =)。

var from = [200,200],
    to   = [400,300],
    tan  = [300,300], // tangent
    rad  = 50; // radius

var line = [
    from,
    computeVec(tan[0], tan[1], -tan[0]*2, -tan[1]*2, rad)
];

var quad = [
    tan,
    computeVec(tan[0], tan[1], to[0], to[1], rad)
];

ctx.moveTo(line[0][0], line[0][1]);
ctx.lineTo(line[1][0], line[1][1]);
ctx.bezierCurveTo(quad[0][0], quad[0][1], quad[0][0], quad[0][1], quad[1][0], quad[1][1]);

function computeVec(tanx, tany, x, y, rad){
    x -= tanx;
    y -= tany;
    var hypotenuse = Math.sqrt(x * x + y * y),
        proportion = rad / hypotenuse;
    return [
        tanx + (x * proportion),
        tany + (y * proportion)
    ];
}