当前位置:  开发笔记 > 编程语言 > 正文

如何通过javascript访问屏幕显示的DPI设置?

如何解决《如何通过javascript访问屏幕显示的DPI设置?》经验,为你挑选了3个好方法。

有没有办法在Javascript函数中访问屏幕显示的DPI设置?

我试图在页面上放置一个HTML面板,当用户的DPI设置为大(120)时,它会关闭该位置.我需要能够知道DPI是什么,所以我可以相应地调整位置.



1> 小智..:

看起来你可以在IE中使用'screen'DOM对象,它具有deviceXDPI,deviceYDPI,logicalXDPI,logicalYDPI的属性.

hxxp://www.w3schools.com/htmldom/dom_obj_screen.asp

这是来自http://www.webdeveloper.com/forum/showthread.php?t=175278的解决方案 (我没有尝试过,看起来像是一个彻底的黑客攻击:)只需创建1英寸宽的东西并以像素为单位进行测量!

HTML:

样式:

#dpi {
  height: 1in;
  left: -100%;
  position: absolute;
  top: -100%;
  width: 1in;
}

使用Javascript:

function getDPI() {
  return document.getElementById("dpi").offsetHeight;
}


http://jsfiddle.net/AvVH4/有这段代码.它总是为我返回96.
此代码从Windows的显示属性返回"DPI设置",即96 ="正常大小",120 ="大尺寸",或其他自定义设置值,例如106 ="正常大小的110%".
似乎没有工作.jsfiddle在我的iPhone5S上返回96.
它不起作用.不要这样做.我只是在我的测试系统上尝试了200%DPI设置,IE和Chrome都没有正确报告.两人都给了我96.

2> Ates Goral..:

首先,为了帮助解决术语DPI(每英寸点数)可能(并且非常常见)的混淆:

DPI不完全是"显示设置"的一部分.它(错误)用于两种不同的环境:

    显示器(或视频)的每英寸原始像素数.它决定了像素的小小.您可以在14英寸笔记本电脑屏幕和17英寸液晶显示器上使用相同的1024x768分辨率.前者约为1280/14 = 91 DPI,后者约为1280/17 = 75 DPI.屏幕的DPI是不可变的; 它无法通过显示设置进行更改.更多...

    打印过程中每英寸点涂在纸上.这是打印机/复印机/传真机可以在一英寸纸张内打印的并排点数.大多数打印机可以设置为以较低的DPI打印,只需将每个点打印为两个,四个等点.更多...

打印图像时,有许多因素会影响纸张上图像的最终尺寸:

源图像的尺寸 - 这是像素或数据的数量.

源图像的DPI.此值确定打印图像时应如何解释尺寸.

如果源图像没有嵌入的DPI信息(JPEG可以有一个,GIF从不这样做),正在使用的程序可能具有指定DPI的设置.这可以是图像查看器/编辑器甚至是Web浏览器.

通常在打印对话框中指定的缩放系数.

打印机的当前DPI设置.

打印机的物理(最大)DPI.

最重要的是,您正在打印的图像将被有效地重新采样(缩小或放大)以匹配打印过程中使用的最终DPI.任何被调用方都可能导致此问题(程序,打印驱动程序,打印机).

现在,回到你的问题.不,您无法确定屏幕的DPI,因为它不在软件域中.它是一个硬件域术语,描述了用户可以买得起的监视器有多大. 更新:我最初在2009年写了这个答案,我对当前的技术有所了解.正如@thure指出的那样,你现在可以(自2012年起?)使用window.matchMedia函数来确定屏幕的DPI.

如果您正在努力实现打印HTML布局的精确度,正如其他人所建议的那样,您的CSS应该使用打印尺寸,如em,pt或pc而不是px.但是,最终结果可能仍取决于浏览器的使用情况.如果将HTML转换为PDF(或从头开始生成PDF)是一种选择,打印PDF将在屏幕和纸张上为您提供最真实的WYSIWYG.

关于dpi的误解

DPI,PPI,像素 - 事实和谬误


不,有很多情况下,从软件中了解DPI和屏幕尺寸等物理属性 - 包括与Javascript一样高的水平 - 是有用的.API设计师没有暴露这些显而易见的东西,因为他们无法想到需要它的情况必须既缺乏远见,也有全知的妄想.
虽然您无法更改物理DPI,但您可以*更改将测量值映射到像素的软件,这些像素由软件控制,具有任意值,通常通过EDID从监视器探测,但可以被覆盖.这就是我认为OP的目标.

3> ygoe..:

您可以使用该window.devicePixelRatio属性来获取屏幕/页面的缩放比例.这在桌面(Windows)上的当前IE,Edge,Chrome和Firefox中运行良好,但它似乎不是当前的标准.它在我的桌面PC上使用传统显示器返回1,在Surface上以2%缩放返回2.这些天的值应该在1.0到3.0之间.我可以使用它来校正动态图像的服务大小,以便在高分辨率屏幕上提供更清晰的图像.

如果你需要一些逻辑dpi/ppi,那么将该值乘以96.虽然它不是实际的物理ppi,只是操作系统对待它的样子.


[W3规范](https://drafts.c​​sswg.org/cssom-view/#dom-window-devicepixelratio)
推荐阅读
ar_wen2402851455
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有