@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 руб.
Gargol Москва
от 100 000 руб.
GXB Development Йошкар-Ола
от 60 000 до 160 000 руб.
28 янв. 2020, в 21:42
5000 руб./за проект
28 янв. 2020, в 21:40
1000 руб./в час
28 янв. 2020, в 20:58
15000 руб./за проект