Back
Syntax
Study
Editor
Mode:
HTML
CSS
JavaScript
PHP
Reset
Run »
HTML / CSS / JS
const ctx = canvas.getContext("2d"); // Full circle ctx.beginPath(); ctx.arc(150, 150, 80, 0, Math.PI * 2); ctx.fillStyle = "#28a745"; ctx.fill(); // Half circle (pie) ctx.beginPath(); ctx.arc(350, 150, 80, 0, Math.PI); ctx.closePath(); ctx.fillStyle = "#dc3545"; ctx.fill(); // Convert degrees: angle * Math.PI / 180
Result
Open