জাভাস্ক্রিপ্টে ক্যানভাসের মাধ্যমে বৃত্ত আঁকা

পরবর্তী মেথড arc একটি নির্দিষ্ট বিন্দুকে কেন্দ্র করে একটি চাপ আঁকে। এটি নিম্নলিখিত প্যারামিটারগুলি গ্রহণ করে: x, y, ব্যাসার্ধ r, শুরুর কোণ startAngle, শেষের কোণ endAngle, ঘড়ির কাঁটার দিকে বা বিপরীতে আঁকা direction।

প্যারামিটার direction নিম্নলিখিত মানগুলি গ্রহণ করে: true ঘড়ির কাঁটার দিকে আঁকতে বাধ্য করে, false ঘড়ির কাঁটার বিপরীতে (ডিফল্ট)।

এক্ষেত্রে মেথড arc-এ কোণগুলি রেডিয়ানে পরিমাপ করা হয়, ডিগ্রীতে নয়। ডিগ্রীকে রেডিয়ানে রূপান্তর করতে আপনি নিম্নলিখিত ফাংশনটি ব্যবহার করতে পারেন:

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

একটি বৃত্ত আঁকা যাক

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();

Результат:

একটি বৃত্তের অর্ধেক আঁকা যাক

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();

Результат:

একটি বৃত্তাকার ডিস্কের অর্ধেক আঁকা যাক

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(); // কনটুরটি পূরণ করি

Результат:

ব্যবহারিক সমস্যা