Javascript - 计算Kappa

Question

在HTML5中绘制椭圆曲线时，Canvas没有内置函数，你必须缩放，或者自己制作，我已经看过了：

function drawEllipse(ctx, x, y, w, h) {
  var kappa = .5522848,
      ox = (w / 2) * kappa, // control point offset horizontal
      oy = (h / 2) * kappa, // control point offset vertical
      xe = x + w,           // x-end
      ye = y + h,           // y-end
      xm = x + w / 2,       // x-middle
      ym = y + h / 2;       // y-middle

  ctx.beginPath();
  ctx.moveTo(x, ym);
  ctx.bezierCurveTo(x, ym - oy, xm - ox, y, xm, y);
  ctx.bezierCurveTo(xm + ox, y, xe, ym - oy, xe, ym);
  ctx.bezierCurveTo(xe, ym + oy, xm + ox, ye, xm, ye);
  ctx.bezierCurveTo(xm - ox, ye, x, ym + oy, x, ym);
  //ctx.closePath(); // not used correctly, see comments (use to close off open path)
  ctx.stroke();
}

但“kappa”来自哪里？你如何计算它，它是一个无限数（小数）？

Answer 1

Kappa以这种方式计算：

Source

然而，它永远不会产生数学上正确的椭圆。为此，您可以使用这样的方法：

function drawEllipse(ctx, cx, cy, rx, ry) {

    var step = 0.01,                 // resolution of ellipse
        a = step,                    // counter
        pi2 = Math.PI * 2 - step;    // end angle

    /// set start point at angle 0
    ctx.moveTo(cx + rx, cy);
    for(; a < pi2; a += step) {
        ctx.lineTo(cx + rx * Math.cos(a), cy + ry * Math.sin(a));
    }
    ctx.closePath();
}

ellipse()方法 actually a part of the specification ，Loktar在评论中指出它在Chrome中可用，稍后会在其他浏览器中显示。

Answer 2

在微分几何中，曲线的curvature由κ（kappa）给出。

因此，kappa的值决定了椭圆的曲线，.5522848可能只是这段代码背后的开发人员的选择。

根据此表（from wikipedia），正曲率确定椭圆：