طريقة HTML canvas translate()
تعريف و استخدام
translate() طريقة لإعادة تعيين موقع (0,0) على اللوحة.
ملاحظة:عندما تدعو إلى مثل fillRect() مثل هذه الطرق، سيتم إضافة القيم إلى x و y القيم الديناميكية
مثال
رسم مستطيل في موقع (10,10)، قم بتعيين الموقع الجديد (0,0) إلى (70,70). أعد رسم المستطيل الجديد (لاحظ أن المستطيل الآن يبدأ في الموقع (80,80)):
JavaScript:
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.fillRect(10,10,100,50);
ctx.translate(70,70);
ctx.fillRect(10,10,100,50);
النصوص
السياق.translate(x,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 |
ملاحظة:لا يدعم متصفح Internet Explorer 8 وأحدث إصداراته عنصر <canvas>.
