Bola Canvas HTML

Contoh

Browser Anda tidak mendukung tag HTML5 canvas.
const canvas = document.getElementById("myCanvas");
const ctx = canvas.getContext("2d");
ctx.beginPath();
ctx.arc(95, 50, 40, 0, 2 * Math.PI);
ctx.stroke();

Coba sendiri

Gambar lingkaran

Untuk menggambar lingkaran di atas kanvas, gunakan metode berikut:

  • beginPath() - Mulai jalur
  • arc(x,y,r,start,end) - Definisi lingkaran
  • stroke() - Menggambar

arc(x,y,r,start,end) - Membuat bagian lingkaran (garis lurus).

Untuk membuat lingkaran, atur sudut awal menjadi 0 dan sudut akhir menjadi 2 * Math.PI.

Koordinat x dan y menentukan pusat lingkaran.

Parameter r menentukan jari-jari lingkaran.

Lihat Juga:

Panduan Referensi Lengkap Canvas CodeW3C.com