As a contribution to the acepted answer you could use

`

const ctx = this.ctx;
ctx.save();
ctx.translate(pin.x, pin.y);

const scaleFactor = pin.radius * 3;
ctx.scale(scaleFactor, scaleFactor);

const path = new Path2D();
const steps = 100;

// --- Droplet contour polar curve ---
for (let i = 0; i <= steps; i++) {
  const t = Math.PI + i * (Math.PI / steps);
  const x = 0.6 * Math.sin(t) * Math.cos(t);
  const y = Math.sin(t);

  if (i === 0) path.moveTo(x, y);
  else path.lineTo(x, y);
}

// close curve
path.lineTo(0, 0);
path.closePath();

// --- Holle ---
const holeY = -0.7; // topo da gota
const holeRadius = 0.13
path.moveTo(0 + holeRadius, holeY);
path.arc(0, holeY, holeRadius, 0, Math.PI * 2, true);


ctx.fillStyle = pin.color;
ctx.fill(path, 'evenodd'); // importante: 'evenodd' cria o furo

ctx.strokeStyle = "black";
ctx.lineWidth = 0.02;
ctx.stroke(path);

ctx.restore();`