HTML کانواس bezierCurveTo() طریق
تعریف اور استعمال
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() طریق۔ یہ ایک کنٹرول پوائنٹ ہے، نہ کہ دو.
مثال
ایک تین بار بیزیئر کرونیم کا راستہ بکشائیں:
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 坐标。 |
浏览器支持
表中的数字注明了首个完全支持该属性的浏览器版本。
| کروم | ایج | فائرفاکس | سافری | آپریا |
|---|---|---|---|---|
| کروم | ایج | فائرفاکس | سافری | آپریا |
| 4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
نوٹ:اینٹرنٹ ایکسپلورر 8 اور اس سے پہلے کی نسلیں <canvas> عنصر کو نہیں دعومت دیتے ہیں。
