How to use the @mathigon/fermat.Point.fromPolar function in @mathigon/fermat

function drawDigit(i: number, r: number, a: number) {
    if (i < 5) a += shift[i];  // Fix spacing for = and . symbols
    const point = Point.fromPolar(a, r);

    context.save();
    context.translate(400 + 2 * point.x, 400 + 2 * point.y);
    context.rotate(a + Math.PI / 2);
    context.fillStyle = colours[Math.floor(r)].toString();
    context.font = `${2 * 0.3 * r}px Source Sans Pro, sans-serif`;
    context.textAlign = 'center';
    context.fillText(piString[i], 0, 0);
    context.restore();

    if (i >= piString.length - 1) return;
    setTimeout(() => drawDigit(i + 1, r * 0.992, a + 0.175), 20);
  }

function redraw() {
    const a = p * Math.PI;
    const dx = 60 + a * 100;
    const end = Point.fromPolar(2 * a + Math.PI / 2, 50).shift(dx, 55);

    // Note: .setTransform() breaks in Safari because of transform-origin.
    $wheel.css('transform', `translate(${a * 100}px,0) rotate(${2 * a}rad)`);
    $line.setAttr('d', `M ${60} ${105} L ${dx} ${105}` +
                       `A 50 50 0 ${p < 0.5 ? 1 : 0} 0 ${end.x} ${end.y}`);
  }

function drawTick(i: number, $lines: ElementView) {
  const a = (i - 90) / 180 * Math.PI;
  const $l = $N('line', {}, $lines) as SVGView;
  $l.setLine(Point.fromPolar(a, 362), Point.fromPolar(a, i % 10 ? 370 : 376));
}

await animate((p) => {
      const a = p * 2 * Math.PI;
      const c1 = Point.fromPolar(a, BIG_R).shift(160, 160);
      smallCircle.setCenter(c1);
      earth.setCenter(Point.fromPolar(a * $step.model.n, SMALL_R).add(c1));
      $path.points = points.slice(0, p * 401);
      lastP = p;
    }, 5000).promise;
    $play.reset();

export function threeBodies($step: Step) {
  const $geopad = $step.$('x-geopad') as Geopad;
  const $canvas = $geopad.$('canvas') as CanvasView;
  const $play = $step.$('x-play-toggle') as PlayToggle;
  const $restore = $step.$('.restore')!;

  const initial: Obj = {
    a: Point.fromPolar(0, 120).shift(240, 240),
    b: Point.fromPolar(2 / 3 * Math.PI, 120).shift(240, 240),
    c: Point.fromPolar(4 / 3 * Math.PI, 120).shift(240, 240),
    va: Point.fromPolar(Math.PI / 2, 66),
    vb: Point.fromPolar(2 * Math.PI / 3 + Math.PI / 2, 66),
    vc: Point.fromPolar(4 * Math.PI / 3 + Math.PI / 2, 66)
  };

  const state: Obj = Object.assign({}, initial);
  const trails = [['a', '#cd0e66'], ['b', '#0f82f2'],
    ['c', '#22ab24']] as [string, string][];

  function acceleration(i: string) {
    let gravity = new Point(0, 0);
    for (let j of ['a', 'b', 'c']) {
      if (i === j) continue;
      const dx = state[j].subtract(state[i]);
      gravity = gravity.translate(dx.scale(1600000 / dx.length ** 3));
    }
    return gravity;
  }

await animate((p) => {
      const a = p * 2 * Math.PI;
      const c1 = Point.fromPolar(a, BIG_R).shift(160, 160);
      smallCircle.setCenter(c1);
      earth.setCenter(Point.fromPolar(a * $step.model.n, SMALL_R).add(c1));
      $path.points = points.slice(0, p * 401);
      lastP = p;
    }, 5000).promise;
    $play.reset();

function sector(center: Point, r: number, size: number, angle: number) {
    const startAngle = angle - size / 2 - Math.PI / 2;
    return new Sector(center, Point.fromPolar(startAngle, r).add(center), size);
  }

export function threeBodies($step: Step) {
  const $geopad = $step.$('x-geopad') as Geopad;
  const $canvas = $geopad.$('canvas') as CanvasView;
  const $play = $step.$('x-play-toggle') as PlayToggle;
  const $restore = $step.$('.restore')!;

  const initial: Obj = {
    a: Point.fromPolar(0, 120).shift(240, 240),
    b: Point.fromPolar(2 / 3 * Math.PI, 120).shift(240, 240),
    c: Point.fromPolar(4 / 3 * Math.PI, 120).shift(240, 240),
    va: Point.fromPolar(Math.PI / 2, 66),
    vb: Point.fromPolar(2 * Math.PI / 3 + Math.PI / 2, 66),
    vc: Point.fromPolar(4 * Math.PI / 3 + Math.PI / 2, 66)
  };

  const state: Obj = Object.assign({}, initial);
  const trails = [['a', '#cd0e66'], ['b', '#0f82f2'],
    ['c', '#22ab24']] as [string, string][];

  function acceleration(i: string) {
    let gravity = new Point(0, 0);
    for (let j of ['a', 'b', 'c']) {
      if (i === j) continue;
      const dx = state[j].subtract(state[i]);