Javascript 将视频的上半部分绘制到画布html

我正在使用

context.drawImage

从

视频元素绘制到
画布，但我的相机的纵横比为4x3

假设我的
视频
宽度为400，高度为300，然后我想将上半部分（400x150）绘制到画布上（或者中间部分，只要是高度的一半就行）

我尝试过的所有方法要么改变扭曲图像的纵横比，要么以相同的4x3纵横比绘制，这意味着它将缩小到200x150，然后缩放以适合我的400x150画布，即，它绘制高度的一半，但也将宽度减半

有什么办法解决这个问题吗？
根据评论，下面是一个例子：


let video=document.createElement（'video'）；
video.addEventListener（'canplay'，function（）{
设w=video.videoWidth；
设h=video.videoHeight；
让canvas=document.getElementById（'canvas'）；
//切割上半部分并将其缩放至50%画布
画布宽度=w/2；
帆布高度=h/4；
设ctx=canvas.getContext（'2d'）；
ctx.drawImage（视频、0、0、w、h/2、0、0、w/2、h/4）
});
video.src=”https://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4#t=10";
ctx.drawImage（视频，0，0，video.videoWidth，video.videoHeight/2，0，0，video.videoWidth，video.videoHeight/2）
你试过吗？我只是尝试了一下，但没有成功，同样的行为，也剪了宽度。