[英]canvas.drawImage() renders only the top half of the source image
I am trying to make a JS image cropper from scratch. 我正在尝试从头开始制作JS图像裁剪器。 I get the cropping part pretty much okay, but when I try to render the cropped section of the image into a canvas using
drawImage()
, the output displays only the top half of the image. 我可以很好地进行裁剪,但是当我尝试使用
drawImage()
将图像的裁剪部分渲染到画布中时,输出仅显示图像的上半部分。 Any idea what might be wrong? 知道有什么问题吗?
CodePen link: https://codepen.io/virtuoso/full/MxrWrN CodePen链接: https ://codepen.io/virtuoso/full/MxrWrN
Found a solution from this post: canvas drawimage draw zoomed image 从这篇文章中找到了解决方案: canvas drawimage draw zoomed image
The problem was that I was changing the <canvas>
element's style
attribute to set its width and height, when I should have used its width
and height
attributes instead. 的问题是,我是改变
<canvas>
元素的style
属性来设置它的宽度和高度,当我应该用它的width
和height
,而不是属性。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.