Используя save
, translate
и restore
, вы можете выполнять свои задачи, не беспокоясь об изменениях стиля, например,
ctx.save();
ctx.translate(X,Y);
ctx.shadowColor = 'rgba(255, 0, 0, 0.5)';
// do some stuff
ctx.restore();
здесь X
& Y
координаты, где вы намеревались рисовать, и вы делаете свои вещи относительно координат 0,0
.
Этот метод решает проблему кэширования и восстановления предыдущих стилей / значений, а также очень полезен, когда выработать с градиентами, так как они всегда строятся относительно начала координат (0,0)