首页 文章

画布 - 相对于高度保持16:9的宽高比

提问于
浏览
0

这个问题应该很容易,我还没找到!甚至看到关于保持宽高比的其他帖子,因为他们都在谈论保持相对宽度的宽高比 .

例如,如果我希望它具有完整的宽度画布并保持16:9的宽高比,我将使用此代码:

var can = document.getElementById('canvas');
can.width = window.innerWidth;
can.height = can.width * (9 / 16);

我正在尝试将Canvas作为用户浏览器的高度,这是最简单的部分 .

但是如何计算画布应该具有的宽度?例如:

如果我有高度 768 ,我知道宽度应该是 1360 ,这将保持16:9的宽高比,但是计算宽度的公式是什么,看到高度是可变的?

先谢谢你!

1 回答

  • 2

    根据您的代码,相对宽度可以如下计算

    var can = document.getElementById('canvas');
    can.height = window.innerHeight;
    can.width = can.height * (16/9);
    

相关问题