Kuchora Duara Kupitia Canvas kwenye JavaScript

Mbinu inayofuata arc inachora arc na katikali kwenye hatua fulani. Inakubua vigezo vinavyofuata: x, y, nusu kipenyo r, angle ya kuanzia startAngle, angle ya mwisho endAngle, kuchora kwa mwendo wa saa au kinyume cha mwendo wa saa direction.

Kigezo direction kinakubua maadili yafuatayo: true husababisha kuchora kwa mwendo wa saa, false kinyume cha mwendo wa saa (kwa chaguo-msingi).

Wakati huo huo, pembe katika mbinu arc hupimwa kwa radiani, sio kwa digrii. Ili kubadilisha digrii kuwa radiani unaweza kutumia kazi ifuatayo:

javascriptfunction getRadians(degrees) {
  return (Math.PI / 180) * degrees;
}

Tuchore duara

html<canvas width="200" height="200" style="background: #f4f4f4;"></canvas>

javascriptlet canvas = document.querySelector('canvas');
let ctx = canvas.getContext('2d');

ctx.arc(100, 100, 75, 0, getRadians(360));
ctx.stroke();

Результат:

Tuchore nusu duara

html<canvas width="200" height="200" style="background: #f4f4f4;"></canvas>

javascriptlet canvas = document.querySelector('canvas');
let ctx = canvas.getContext('2d');

ctx.arc(100, 100, 75, 0, getRadians(180));
ctx.stroke();

Результат:

Tuchore nusu ya duara iliyojaa

html<canvas width="200" height="200" style="background: #f4f4f4;"></canvas>

javascriptlet canvas = document.querySelector('canvas');
let ctx = canvas.getContext('2d');

ctx.arc(100, 100, 75, 0, getRadians(180));
ctx.fill(); // tutaijaza mchoro

Результат:

Kazi za vitendo