Как получить размеры изображения?

Question

[Антон]

В эту строку нужно вставить ширину и высоту изображения

image1.drawImage(img2, eyesRect[0], eyesRect[1], ШИРИНА, ВЫСОТА);

как получить эти цифры для изображения
img2.src = '/upload/c376b.png';
Полный код

$(document).ready(function() {
const video = $('#webcam')[0];
const ctrack = new clm.tracker();
ctrack.init();
const overlay = $('#overlay')[0];
const overlayCC = overlay.getContext('2d');
function trackingLoop() {
  requestAnimationFrame(trackingLoop);
  let currentPosition = ctrack.getCurrentPosition();
  overlayCC.clearRect(0, 0, 800, 600);
 if (currentPosition) {
 //   ctrack.draw(overlay);
  };

 if (currentPosition) {
  const eyesRect = getEyesRectangle(currentPosition);
  overlayCC.strokeStyle = 'transparent';
  //  overlayCC.strokeStyle = 'red';
  overlayCC.strokeRect(eyesRect[0], eyesRect[1], eyesRect[2], eyesRect[3]);
var img2=new Image();  // Создаём изображение
img2.src = '/upload/c376b.png';
var canvas=document.getElementById("lenses")
var image1=overlay.getContext("2d");
image1.drawImage(img2, eyesRect[0], eyesRect[1], ШИРИНА, ВЫСОТА);
console.log(eyesRect);
}
}
function onStreaming(stream) {
video.srcObject = stream;
ctrack.start(video);
trackingLoop();
  }
  navigator.mediaDevices.getUserMedia({ video: true }).then(onStreaming);
});

function getEyesRectangle(positions) {
  const minX = positions[0][0] + 0;
  const maxX = positions[14][0] + 0;
  const minY = positions[22][1] + 0;
  const maxY = positions[34][1] + 0;
  const width = maxX - minX;
  const height = maxY - minY;
  return [minX, minY, width, height];
}

Answer 1

[0xD34F]

const getImageSizes = src => new Promise((resolve, reject) => {
  const img = new Image();
  img.onload = () => resolve({ width: img.width, height: img.height });
  img.onerror = reject;
  img.src = src;
});


getImageSizes(здесь путь к вашей картинке).then(sizes => {
  ...
});

Comments

[Антон]

Не получается у меня понять.
Что должно быть вместо троеточия?

getImageSizes(здесь путь к вашей картинке).then(sizes => {
  ...
});

[0xD34F]

[бьётся лбом об монитор]

Антон, ваш код, использующий размеры.

[Антон]

0xD34F,

const getImageSizes = src => new Promise((resolve, reject) => {
  const img = new Image();
  img.onload = () => resolve({ width: img.width, height: img.height });
  img.onerror = reject;
  img.src = src;
});

getImageSizes('тут мой url').then(sizes => {
console.log(sizes); // тут я теперь вижу размер
});

Простите, тут я вижу размер
console.log(sizes);
{width: 300, height: 89}
Хотел получить просто такую запись
300, 89
Убираю в этой строчке слово width: и height:

img.onload = () => resolve({ width: img.width, height: img.height });

получаю ошибку.
Как можно получить запись в таком формате: 300, 89? т.е. без слов width и height

[0xD34F]

Антон, ну склейте строку:

.then(sizes => {
  const s = `${sizes.width}, ${sizes.height}`;