HTML canvas-এর strokeRect() মেথডটি ওয়েব পেজে একটি রেক্ট্যাঙ্গেল (আয়তক্ষেত্র) তৈরি করতে ব্যবহৃত হয়। <canvas> এলিমেন্ট আপনাকে JavaScript ব্যবহার করে ওয়েব পেজে গ্রাফিক্স আঁকার অনুমতি দেয়। প্রতিটি canvas-এর দুটি অ্যাট্রিবিউট থাকে যা canvas-এর উচ্চতা এবং প্রস্থ বর্ণনা করে: height এবং width।
সিনট্যাক্স:
context.strokeRect(p,q,width,height);
উপরে,
- p - রেক্ট্যাঙ্গেলের উপরের বাম কোণার x-কর্ডিনেট
- q - রেক্ট্যাঙ্গেলের উপরের বাম কোণার y-কর্ডিনেট
- width - রেক্ট্যাঙ্গেলের প্রস্থ
- height - রেক্ট্যাঙ্গেলের উচ্চতা
এখন canvas-এর strokeStyle প্রপার্টি বাস্তবায়নের উদাহরণ দেখি:
উদাহরণ
<!DOCTYPE html> <html> <body> <canvas id="newCanvas" width="550" height="400" style="border:2px solid orange;"></canvas> <script> var c = document.getElementById("newCanvas"); var ctx = c.getContext("2d"); ctx.strokeRect(120, 120, 220, 120); </script> </body> </html>আউটপুট
