বেজিয়ার কার্ভ (Bezier curve) আঁকতে HTML-এ BezierCurveTo() মেথড ব্যবহার করুন। প্রথমে সিনট্যাক্স দেখি:
ctx.bezierCurveTo(cp1x,cp1y,cp2x,cp2y,x,y);
এখানে,
- cp1x - প্রথম বেজিয়ার কন্ট্রোল পয়েন্টের x-কর্ডিনেট
- cp1y - প্রথম বেজিয়ার কন্ট্রোল পয়েন্টের y-কর্ডিনেট
- cp2x - দ্বিতীয় বেজিয়ার কন্ট্রোল পয়েন্টের x-কর্ডিনেট
- cp2y - দ্বিতীয় বেজিয়ার কন্ট্রোল পয়েন্টের y-কর্ডিনেট
- x - শেষ বিন্দুর x-কর্ডিনেট
- y - শেষ বিন্দুর y-কর্ডিনেট
নিচে একটি উদাহরণ দেওয়া হল:
উদাহরণ
<!DOCTYPE html> <html> <head> <title>HTML5 Canvas Tag</title> </head> <body> <canvas id = "newCanvas" width = "550" height = "300" style = "border:2px solid blue;"></canvas> <script> var c = document.getElementById('newCanvas'); var ctx = c.getContext('2d'); ctx.beginPath(); ctx.moveTo(50, 20); ctx.bezierCurveTo(100, 150, 200, 100, 200, 50); ctx.stroke(); </script> </body> </html>আউটপুট
