canvas.drawImage () отображает только верхнюю половину исходного изображения

Question

Я пытаюсь сделать изображение JS кроппера с нуля. Я получаю обрезку практически нормально, но когда я пытаюсь визуализировать обрезанную часть изображения на холст, используя drawImage(), на выходе отображается только верхняя половина изображения. Есть идеи, что может быть не так?

Ссылка CodePen: https://codepen.io/virtuoso/full/MxrWrN

Answer 1

Нашел решение из этого поста: canvas drawimage draw увеличенное изображение

Проблема заключалась в том, что я изменял атрибут style элемента <canvas>, чтобы установить его ширину и высоту,когда я должен был использовать вместо него атрибуты width и height.