Javascript 将视频和画布调整为最大大小

我必须在画布上播放本地视频文件。画布位于div内，div具有最大宽度和高度。 如果我尝试将视频和画布的大小调整为该大小，而不是显示已调整大小，则视频将被裁剪。如何调整大小

HTML

我已经解决了！ 在画布中绘制视频时，需要使用新的视频尺寸，如下所示：

ctx.drawImage(video, 0, 0, videoInfo.width, videoInfo.height);    

---

您在>848行

处有一个打字错误，该行的
宽度应为
宽度。不知道这是在你输入问题时发生的，还是真实的代码。Ups，是的，谢谢。无论如何，这不是问题，不幸的是这里的代码太少（什么是videoInfo，如何绘制框架，canvas元素在哪里，canvas如何设置…）。您可以设置一个小提琴（或内联演示）来显示您的场景吗？（我知道视频链接可能有点棘手，但有一些开源视频可以用来代替实际视频）
if (videoInfo.height > 480)    
    { 
        var AR = videoInfo.width/videoInfo.height;
        videoInfo.height = 480;
        videoInfo.width = 480*AR; 
    }

if (videoInfo.whidth > 848)  
{ 
    var AR = videoInfo.width/videoInfo.height;
    videoInfo.width = 848; 
    videoInfo.height = 848/AR;
}

video.setAttribute('width', videoInfo.width);
video.setAttribute('height', videoInfo.height + VIDEO_HEIGHT_SHIFT);

displayedCanvas.setAttribute('width', videoInfo.width);
displayedCanvas.setAttribute('height', videoInfo.height); 

ctx.drawImage(video, 0, 0, videoInfo.width, videoInfo.height);