Не работает context.scale(-1, 1);
165
23 июля 2019, 19:20
Не работает context.scale(-1, 1) для отражения картинки на канвасе
ctx.save();
ctx.scale(-1, 1);
ctx.drawImage(head, 100, 100, 50, 50);
ctx.restore();
Answer 1
На самом деле все работает. Просто при вызове restore scale сбрасывается и отрисованное изображение уходит из видимой области.
Чтобы этого избежать можно просто просто исрользовать отрицательные координаты для вывода по оси x.
В этом случае при сбросе scale они становятся положительными и вывод становится нормальным:
Пример:
var ctx = document.getElementById('c').getContext('2d');
function l(img) {
ctx.save();
ctx.scale(-1, 1);
ctx.drawImage(img, -200, 0, 100, 100);
ctx.restore();
ctx.save();
ctx.drawImage(img, 0, 0, 100, 100);
ctx.restore();
}<canvas id="c" width="200" height="200"></canvas><br/>
<img style="display:none" src="http://images.math.cnrs.fr/IMG/png/section8-image.png" width="256" height="256" id="t" onload="l(this)">
-
06:53
Апостиль в Лос-Анджелесе без лишних нервов и бумажной волокиты
-
20:42
-
09:21
Основные этапы разработки сайта для стоматологической клиники
-
12:26
-
10:30
-
18:43
Продвижение своими сайтами как стратегия роста и независимости
-
22:46
-
06:18
-
12:23
ТОП-10
- Почему SERVER_ADDR имеет не тот IP 50307 visits
- Как заменить $_SERVER[REMOTE_ADDR] на IP клиента в PHP за двумя Nginx? 31941 visits
- Хочу вывести несколько строк из массива в один div, выводит только много undefined; подскажите, что делать? 26283 visits
- Как через css изменить цвет png изображения? 11765 visits
- Blob video url download 11312 visits
- Php curl запрос через прокси с авторизацией 10721 visits
- Работа с captcha vk api 9517 visits
© "hostciti.net" 19.3.2026 | 19:46