@DarkRover
Местный дурочёк

Почему canvas.drawImage() растягивает моё изображение?

Разве он не должен по идее вывести его также как и обычный тэг img?

HTML
<canvas id="display">
    <p>Ваш браузер не поддерживает элемент canvas!</p>
    <script src="logic.js"></script>
</canvas>
<img src="images/ava.png">


CSS
#display {
    background: whitesmoke;
    width: 320px;
    height: 320px;
}


JS
const spr = new Image();
spr.src = "images/ava.png";
ctx.drawImage(spr, 0, 0);


5de82d3b3cf29846328817.png
  • Вопрос задан
  • 61 просмотр
Решения вопроса 1
SagePtr
@SagePtr
Еда - это святое
Задайте тэгу canvas атрибуты width и height, иначе он не будет знать, какого он на самом деле размера, и будет рисовать во вьюпорте 300x150, а потом средствами CSS его растягивать до заданного вами.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
Freeway Games Москва
До 180 000 ₽
2Reallife Москва
от 110 000 до 130 000 ₽
LEVEL Москва
от 130 000 до 200 000 ₽
17 февр. 2020, в 00:30
1500 руб./за проект
16 февр. 2020, в 22:28
2000 руб./за проект