Перейти к содержанию

translate()

Метод translate() ретранслирует позицию (0,0) в новое место растрового холста.

Примечание: Если после метода translate() вызывается, например, такой метод как fillRect(), то его значение добавляется к значениям x- и y-координат.

translate

Синтаксис

context.translate(x, y);

Параметры

x
Значение, добавляемое к горизонтальным (x) координатам
y
Значение, добавляемое к вертикальным (y) координатам

Спецификация

Пример

Нарисуем прямоугольных в позиции (10, 10), установим новую нулевую позицию по координатам (70, 70). Снова нарисуем тот же прямоугольник (обратите внимание, что теперь прямоугольник начинается в координатах (80, 80):

Ваш браузер не поддерживает HTML5 тег canvas.

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)

Ссылки