روش Canvas translate()
تعریف و استفاده
translate() روش برای تغییر مختصات (0,0) روی صفحه کاری استفاده می‌کنید.
نکته:وقتی که پس از translate() از روش‌هایی مانند 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);
نحوه استفاده
context.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 |
نکته:اینترنت اکسپلورر 8 و نسخه‌های قدیمی‌تر از عنصر <canvas> پشتیبانی نمی‌کنند.
