مثال
رسم منحنى بيزيه من الدرجة الثانية:
جافا سكريبت:
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.beginPath();
ctx.moveTo(20,20);
ctx.quadraticCurveTo(20,100,200,20);
ctx.stroke(); انها محاولة لنفسك » دعم المتصفح
الأرقام في الجدول تحدد أول نسخة متصفح يدعم بشكل كامل الأسلوب.
| طريقة | |||||
|---|---|---|---|---|---|
| quadraticCurveTo() | 4.0 | تسعة | 3.6 | 4.0 | 10.1 |
تعريف والاستخدام
و quadraticCurveTo() يضيف الأسلوب أشر إلى المسار الحالي باستخدام نقاط التحكم المحددة التي تمثل منحنى بيزيه من الدرجة الثانية.
يتطلب منحنى بيزيه الدرجة الثانية نقطتين. النقطة الأولى هي نقطة تحكم يستخدم في حساب بيزيه من الدرجة الثانية والنقطة الثانية هي نقطة النهاية للمنحنى. نقطة انطلاق لمنحنى هي النقطة الأخيرة في المسار الحالي. حالة عدم وجود مسار، استخدم beginPath() و moveTo() أساليب لتحديد نقطة البداية.
نقطة البداية:
moveTo( 20,20 ) نقطة تحكم:
quadraticCurveTo( 20,100 ,200,20) نقطة النهاية:
quadraticCurveTo(20,100, 200,20 ) Tip: راجع bezierCurveTo() الأسلوب. فقد اثنين من ضبط نقاط بدلا من واحدة.
| جافا سكريبت بناء الجملة: | context . quadraticCurveTo( cpx,cpy,x,y ) . |
|---|
قيم معلمة
| معامل | وصف | العبها |
|---|---|---|
| cpx | الإحداثي س من نقطة مراقبة بيزيه | العبها " |
| cpy | الإحداثي ص من نقطة مراقبة بيزيه | العبها " |
| x | الإحداثي س من نقطة النهاية | العبها " |
| y | الإحداثي ص من نقطة النهاية | العبها " |