@kirillleogky

Как узнать размеры фото для canvasa?

Есть код:
let canvas = document.getElementById('canvas');

function getLinkToImage() {
const url = 'https://api.unsplash.com/photos/random?query=town,Minsk&client_id=КОД';
fetch(url)
  .then(res => res.json())
  .then(data => data.urls.small)
  .then(image => {
      if (canvas.getContext) {
        let ctx = canvas.getContext('2d');
        ctx.clearRect(0, 0, canvas.width, canvas.height);
        let pic = new Image();
        pic.src = image;
        pic.onload = () => {
          ctx.drawImage(pic, ?, ?, ?, ?);
        }
      }
  })
}




Подскажите как брать ВСЕГДА актуальные размеры фото из fetcha?

Чтобы можно было записывать всегда нужные значения (чтобы фото не растягивалось а было чисто своего размера)?
Что сюда записать вместо "?":
ctx.drawImage(pic, ?, ?, ?, ?);

Примеры что я имею ввиду:

5dced9f157dfe599165067.png
  • Вопрос задан
  • 103 просмотра
Пригласить эксперта
Ответы на вопрос 1
wisgest
@wisgest
Не ИТ-специалист
При наступлении pic.oload (хотя, может быть и раньше) см. pic.naturalWidth и pic.naturalHight или, если эти значения вдруг не определены (в старых обозревателях), то pic.width и pic.hight, но только если они явно не заданы через атрибуты width и height.
Ответ написан
Комментировать
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы