javascript - 画布和窗口的比较像素

Question

我目前有一个问题。我想通过在 html5 和 javascript 中使用画布和图像对象来绘制图像我想知道画布像素与窗口像素的大小相等，例如：例如我有 cavas (700 * 400) 然后我想知道大小它需要在窗口屏幕上。因此，如果我想知道 (1*1) 它等于 window.screen.widht * window.screen.height

Answer 1

将元素的实际大小除以您在属性中定义的大小。示例：http : //jsfiddle.net/pjdmN/

var canvas = document.getElementById('canvas');
var xRatio = canvas.offsetWidth / canvas.width;
var yRatio = canvas.offsetHeight / canvas.height;

Answer 2

默认情况下，cavans 上的 1px 等于 window 上的 1px。

在这种情况下，画布的行为类似于元素。它有自己的宽度和高度，但您可以使用 css 将其缩放到不同的大小。