تقدم هذه المقالة أساسًا دليل استخدام طريقة Canvas لـ HTML5. إنه بسيط للغاية وواضح. إنه مقال جيد جدًا. أوصي به هنا.
طريقة قماش
حفظ () يحفظ حالة البيئة الحالية
استعادة () إرجاع حالة المسار والخصائص التي تم حفظها من قبل
CreateVent ()
GetContext () إرجاع كائن يشير إلى واجهة برمجة التطبيقات اللازمة للوصول إلى وظيفة الرسم
Todataupl () إرجاع عنوان URL لصورة قماش
خصائص وطرق أنماط الخط
ملكية:
يقوم Linecap بتعيين أو إرجاع نمط نقطة النهاية للخط
يقوم Linejoin بتعيين أو إرجاع نوع الزاوية الذي تم إنشاؤه عند تقاطع سطرين.
قم بتعيين أو إرجاع عرض الخط الحالي.
Miterlimit يحدد أو يعيد الحد الأقصى لطول ميتري
خصائص وأساليب اللون والأناقة والظلال
ملكية
تقوم FillStyle بتركيبات أو إرجاع اللون أو التدرج أو الوضع المستخدم لملء اللوحة
مجموعة Strokestyle أو إرجاع اللون أو التدرج أو الوضع المستخدم للسكتات الدماغية
مجموعة ShadowColor أو إرجاع اللون المستخدم للظلال
يضع Shadowblur أو يعيد مستوى التمويه المستخدم للظلال
Shadowoffsetx يضبط أو إرجاع المسافة الأفقية من الظل إلى الشكل
يحدد Shadowoffsety أو يعيد المسافة العمودية للظل إلى الشكل
طريقة
CreateLineArgradient () ينشئ التدرج الخطي (المستخدم على محتوى القماش)
CreatePattern () يكرر العنصر المحدد في الاتجاه المحدد
CreaterAdialGradient () يخلق تدرجات شعاعي/حلقة (المستخدمة على محتوى القماش)
AddColorStop () يحدد لون أو توقف في كائن التدرج
طريقة المسار
ملء () يملأ الرسم الحالي (المسار)
السكتة الدماغية () يرسم المسار المحدد
يبدأ BeginPath () مسارًا ، أو يعيد ضبط المسار الحالي
ينقل Moveto () المسار إلى النقطة المحددة في القماش دون إنشاء خطوط
Closepath () يخلق مسارًا من النقطة الحالية إلى نقطة البداية
يضيف Lineto () نقطة جديدة لإنشاء خط من تلك النقطة إلى النقطة المحددة الأخيرة
مقطع () يقطع مساحة من أي شكل وحجم من اللوحة الأصلية
QuadraticCurveto () ينشئ منحنى بيزييه الثاني
Beziercureto () يخلق منحنى بيزيير الأخير
ARC () ينشئ القوس/المنحنى (يستخدم لإنشاء دوائر أو دوائر جزئية)
Arcto () يخلق قوس/منحنى بين اثنين من الظلال
isPointInpath () إرجاع قيمة منطقية إذا كانت النقطة المحددة في المسار الحالي
المستطيل
Rect () يخلق مستطيل
FillRect () يرسم المستطيل المملوء
strokerect () يرسم المستطيل (بدون ملء)
CLARRECT () يمسح وحدات البكسل المحددة داخل المستطيل المعطى
تعيين خصائص النص والأساليب
ملكية:
يقوم الخط بتعيين أو إرجاع خصائص الخط الحالي لمحتوى النص
قم بتعيين أو إرجاع المحاذاة الحالية لمحتوى النص
يقوم إعداد TextBaseline بإرجاع خط الأساس النص الحالي المستخدم عند رسم النص.
طريقة:
FillText () يرسم النص المملوء على القماش
Stroketext () يرسم النص على قماش (بدون ملء)
يرجع MESURETEXT () كائن يحتوي على عرض النص المحدد
طريقة التحويل
Scale () يقيس المؤامرة الحالية إلى أكبر أو أصغر
تدوير () يدور الرسم الحالي
ترجمة () إعادة تعيين موضع (0،0) للقميص الأزهار
تحويل () يحل محل مصفوفة التحويل الحالية للرسم
setTransform () إعادة تعيين التحويل الحالي إلى مصفوفة الوحدة. ثم قم بتشغيل Transform ()