روش bezierCurveTo() کانواس

منوی 参考 Canvas

تعریف و استفاده

bezierCurveTo() روش برای اضافه کردن یک نقطه به مسیر فعلی با استفاده از نقطه‌های کنترل مشخص شده برای منحنی بیزری استفاده کنید.

توضیحات:منحنی بیزری سه‌گانه نیاز به سه نقطه دارد. دو نقطه اول برای محاسبات بیزری استفاده می‌شوند و نقطه سوم نقطه پایان منحنی است. نقطه شروع منحنی نقطه آخر مسیر است. اگر مسیر وجود ندارد، لطفاً از beginPath() و moveTo() روش برای تعریف نقطه شروع.

منحنی بی塞尔 سه‌گانه
  • نقطه شروع: moveTo(20,20)
  • نقطه کنترل 1: bezierCurveTo(20,100,200,100,200,20)
  • نقطه کنترل 2: bezierCurveTo(20,100,200,100,200,20)
  • نقطه پایان: bezierCurveTo(20,100,200,100,200,20)

توضیحات:لطفاً ببینید روش quadraticCurveTo()این یک نقطه کنترل دارد، نه دو نقطه کنترل.

مثال

یک منحنی بیزری سه‌گانه بکشید:

مرورگر شما پشتیبانی از تگ کانواس HTML5 را ندارد.

JavaScript:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.beginPath();
ctx.moveTo(20,20);
ctx.bezierCurveTo(20,100,200,100,200,20);
ctx.stroke();

آزمایش کنید

قوانین دستور زبان

context.bezierCurveTo(cp1x,cp1y,cp2x,cp2y,x,y);

مقدار پارامترها

پارامترها توضیحات
cp1x مختصات x نقطه کنترل اول.
cp1y مختصات y نقطه کنترل اول.
cp2x مختصات x نقطه کنترل دوم.
cp2y مختصات y نقطه کنترل دوم.
x مختصات x نقطه پایان.
y مختصات y نقطه پایان.

پشتیبانی مرورگر

تعداد در جدول نشان‌دهنده نسخه مرورگر اولیه‌ای است که این ویژگی را کاملاً پشتیبانی می‌کند.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
4.0 9.0 3.6 4.0 10.1

نکته:اینترنت اکسپلورر 8 و نسخه‌های قدیمی‌تر از عنصر <canvas> پشتیبانی نمی‌کنند.

منوی 参考 Canvas