像素到MM方程式?

时间:2011-10-04 15:36:13

标签: jquery pixel

是否有一个可靠的公式可以计算出MM的像素大小?或者这不可能跨设备吗?

我们正在使用一个定制系统,为不同屏幕尺寸的设备提供内容,它可以检测MM的屏幕宽度,但我们希望将其精确地转换为像素大小,以便使用简单的动态提供正确大小的图像jquery脚本!?

有什么想法吗?

干杯 保罗

9 个答案:

答案 0 :(得分:28)

我做了什么:

 <div id="my_mm" style="height:100mm;display:none"></div>

然后:

var pxTomm = function(px){   
   return Math.floor(px/($('#my_mm').height()/100)); //JQuery returns sizes in PX
 };

答案 1 :(得分:17)

tl; dr:如果你不知道设备的DPI,你将无法推断出现实世界中像素的大小。< / p>


像素本身是不是现实世界的测量单位。

如果您考虑显示它们的设备的 DPI值,它们可以成为真实世界的测量值。

公式为:

  • mm = ( pixels * 25.4 ) / DPI

因此在96-DPI屏幕设置上观看了8个像素:

  • ( 8 * 25.4 ) / 96 = 2.116mm

所有这些假设设备未缩放/缩放。

答案 2 :(得分:3)

您需要知道设备的DPI以及是否缩放显示器。这意味着您必须拥有每个设备的物理屏幕尺寸和屏幕分辨率的数据库。

答案 3 :(得分:1)

由于无法检测物理屏幕大小,因此无法可靠地计算此值。

答案 4 :(得分:1)

老帖子,但我今天偶然发现了这个问题,不得不让它发挥作用。

诀窍是创建一个尺寸为英寸的元素并请求其宽度,这将为您提供每英寸的px。

 function inch2px(inches) {
                $("body").append("<div id='inch2px' style='width:1in;height:1in;display:hidden;'></div>");
                var pixels = $("#inch2px").width();
                $("#inch2px").remove();

                return inches * pixels;
            }

            function px2inch(px) {
                $("body").append("<div id='inch2px' style='width:1in;height:1in;display:hidden;'></div>");
                var pixels = $("#inch2px").width();
                $("#inch2px").remove();

                return px / pixels;
            }

现在,如果您需要毫米,请执行px2inch(10)*25.4

答案 5 :(得分:1)

不需要jQuery。

function xToPx(x) {
    var div = document.createElement('div');
    div.style.display = 'block';
    div.style.height = x;
    document.body.appendChild(div);
    var px = parseFloat(window.getComputedStyle(div, null).height);
    div.parentNode.removeChild(div);
    return px;
}


pixels = xToPx('10cm'); // convert 10cm to pixels
pixels = xToPx('10mm'); // convert 10mm to pixels

请注意,以像素为单位的值取决于设备浏览器告诉您的分辨率。一些浏览器(在某些手机上)撒谎了,并告诉您一些与实际屏幕分辨率不同的内容,以尝试与较旧的网站兼容。重要的是不要将转换值从一台设备移植到另一台设备,而要始终使用实时计算。即使在台式机上,用户也可以更改屏幕分辨率。

要了解有关单位的更多信息,请查看W3上的这篇(简短的)文章:

https://www.w3.org/Style/Examples/007/units.en.html

答案 6 :(得分:0)

基于上面的@Dawa答案,这是我的解决方案:

var mmToPx = function(mm) {
    var div = document.createElement('div');
    div.style.display = 'block';
    div.style.height = '100mm';
    document.body.appendChild(div);
    var convert = div.offsetHeight * mm / 100;
    div.parentNode.removeChild(div);
    return convert;
};

请注意,100mm的高度,将为您提供更好的精度因子。 计算将是即时的,div将不可见。不需要jQuery

答案 7 :(得分:0)

我使用这个简单的功能

function pix2mm(val,dpi){
    return (val/0.0393701)/dpi;
}

测试输出300,600,900 DPI

var r = pix2mm(100,300);  // converting 100 pixels it 300 DPI 
console.log(r);  // output : 8.4 mm
var r1 = pix2mm(100,600);  // converting 100 pixels it 600 DPI
console.log(r1);  // output : 4.2 mm
var r2 = pix2mm(100,900);  // converting 100 pixels it 900 DPI
console.log(r2);  // output : 2.8 mm

DEMO:https://jsfiddle.net/xpvt214o/29044/

答案 8 :(得分:-1)

后期但可能有用。 1 px = 0.26458333333719毫米

百万米像素 1毫米= 3.779527559 px

因此,如果您说10px。等于10 * 0.26458 .. = 2.64mm 参考:https://everythingfonts.com/font/tools/units/px-to-mm 享受:)