javascript - 如何在 javascript 中确定计算机屏幕的分辨率？

Question

我注意到 <canvas>元素可以有不同的比例。例如，如果我将 CSS 宽度和高度设置为 100px，但让 javascript 将元素的宽度和高度设置为 200px，则元素的尺寸会缩小，因此打印在其上的所有内容都是尺寸的 1/2。 (或分辨率的 2 倍)

我有一个视网膜屏幕 Macbookpro，所以在开发过程中，我将缩放比例设置为 2 倍，这样图像和对象在我的屏幕上看起来清晰明快。

我听说其他屏幕可以有 1.2 倍的分辨率(CSS 像素与实际像素)

有没有办法找出设备屏幕的分辨率/缩放比例，以便让我的 Canvas 对用户来说尽可能清晰明了？

如果有帮助的话，我正在尝试使用 canvas 作为我的图形输出在 javascript 中制作游戏。

Answer 1

这些属性将为您提供尺寸:

window.screen.availHeight

window.screen.availWidth

对于像素深度，使用这个属性:

window.devicePixelRatio

对于 Canvas 中的应用，给出了一个有用的脚本和解释here .