ترجمة لوحة HTML () الطريقة

❮ مرجع قماش HTML

مثال

ارسم مستطيلاً في الموضع (10،10) ، اضبط الموضع الجديد (0،0) على (70،70). ارسم نفس المستطيل مرة أخرى (لاحظ أن المستطيل يبدأ الآن في الموضع (80،80):

لا يدعم متصفحك HTML5canvastag.

جافا سكريبت:

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);

دعم المتصفح

تحدد الأرقام الواردة في الجدول إصدار المتصفح الأول الذي يدعم الطريقة بالكامل.

Method
translate() Yes 9.0 Yes Yes Yes

التعريف والاستخدام

تقوم طريقة translate () بإعادة تعيين موضع (0،0) على اللوحة القماشية.

ملاحظة: عند استدعاء طريقة مثل fillRect () بعد translate () ، تُضاف القيمة إلى قيمتي x و y للإحداثيات.

رسم توضيحي لطريقة الترجمة ()

بناء جملة JavaScript: السياق .translate ( x، y ) ؛

قيمه المعامل

ملاحظة: يمكنك تحديد معلمة واحدة أو كلاهما.

Parameter Description Play it
x The value to add to horizontal (x) coordinates
y The value to add to vertical (y) coordinates

❮ مرجع قماش HTML