<p>Left side is without setting start point, right side is with `moveTo()`</p>
<canvas></canvas>
const canvas = document.querySelector('canvas');
const ctx = canvas.getContext('2d');

const radius = 60;
const startAngle = 0;
const endAngle = Math.PI * 0.5; // 90 degree
let origin = {x: 0, y: 0};

ctx.fillStyle = 'red';

// First, without calling moveTo()
ctx.beginPath();
ctx.arc(origin.x, origin.y, radius, startAngle, endAngle, false);
ctx.fill();


// Now, with moveTo()
origin = {x: origin.x + 100, y: origin.y};
ctx.beginPath();
ctx.moveTo(origin.x, origin.y);
ctx.arc(origin.x, origin.y, radius, startAngle, endAngle, false);
ctx.fill();

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.