Метод HTML canvas translate()
Пример
Нарисуйте прямоугольник в позиции (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);
Поддержка браузера
Цифры в таблице указывают на первую версию браузера, полностью поддерживающую метод.
| 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