试卷大小和扫描仪扫出图片的大小的关系

发表于 | 分类于
试卷大小和扫描仪扫出图片的大小的关系

前言

首先先抛出一个问题

同样的试卷使用不同的扫描仪，使用同样的DPI 扫出来的图片大小是一样的吗？

在理想情况下，如果使用相同的DPI（每英寸点数）设置，并且试卷的大小和内容完全相同，那么使用不同的扫描仪扫描出来的图片大小应该是相同的。

DPI决定了图像的分辨率，即每英寸包含的像素数。因此，如果DPI设置相同，理论上图像的像素数和文件大小应该是一样的。

但是实际上扫描出来的尺寸会有些许差别。

计算方式

图片大小、试卷大小和DPI（每英寸点数）之间的关系可以通过以下几个方面来理解：

试卷大小：这是指实际试卷的物理尺寸，通常以英寸或厘米表示。例如，标准的A4纸的尺寸为210 mm x 297 mm（约8.27 x 11.69英寸）。

DPI（Dots Per Inch）：这是衡量图像分辨率的单位，表示每英寸多少个像素。当你扫描文档时，DPI越高，生成的图像越清晰，细节越多；但同时，文件的大小也会增大。

图片的像素尺寸：根据试卷尺寸和DPI，可以计算出扫描后图片的像素尺寸。

这个公式可以表示为：

图片宽度（像素）= 试卷宽度（英寸）* DPI

图片高度（像素）= 试卷高度（英寸）* DPI

图片大小(像素)和试卷尺寸(mm)之间的公式

图片宽度（像素）= 试卷宽度（mm）/ 25.4 * DPI

图片高度（像素）= 试卷高度（mm）/ 25.4 * DPI

在200DPI的前提下

图片宽度（像素）= 试卷宽度（mm）* 7.876

图片高度（像素）= 试卷高度（mm）* 7.876

在96DPI的前提下

图片宽度（像素）= 试卷宽度（mm）* 3.78

图片高度（像素）= 试卷高度（mm）* 3.78

例如：

对于A4纸（8.27 x 11.69英寸）在200DPI下的计算:

宽度：8.27 英寸 × 200 DPI = 1654 像素

高度：11.69 英寸 × 200 DPI = 2338 像素

因此，最终生成的图片尺寸为 1654 x 2338 像素。

英寸和mm的换算

毫米（mm）和英寸（inch）是两种不同的长度单位，通常用于测量物体的尺寸或距离。

它们之间的关系可以通过以下转换来理解：

换算关系

1 英寸（inch）等于 25.4 毫米（mm）。这个换算关系是国际标准，用于在不同度量系统之间进行转换。

公式

从英寸到毫米：

毫米 = 英寸 × 25.4

从毫米到英寸：

英寸 = 毫米 / 25.4

常见长度转换示例

  • 1英寸 等于 25.4 毫米
  • 2英寸 等于 50.8 毫米
  • 3英寸 等于 76.2 毫米
  • 4英寸 等于 101.6 毫米
  • 5英寸 等于 127 毫米

A4/A3的扫描图片尺寸

A3 和 A4 是国际标准 ISO 216 中定义的纸张尺寸，常用于打印和复印。

它们的尺寸如下：

A4 纸张（210 mm x 297 mm）

  • 宽度：210 毫米 (8.27 英寸)
  • 高度：297 毫米 (11.69 英寸)

A3 纸张（297 mm x 420 mm）

  • 宽度：297 毫米 (11.69 英寸)
  • 高度：420 毫米 (16.54 英寸)

注意

这里A3的宽高没有写成420mm * 297mm是因为：

扫描仪默认扫描A3的结果是宽度小于高度的，这和我们常识是相反的。

使用200 DPI（每英寸点数）扫描或生成A3和A4纸张的图片时，

可以通过以下公式计算得到的图片的像素尺寸：

A4 纸张（8.27 英寸 × 11.69 英寸）

  • 宽度：8.27 英寸 × 200 DPI = 1654 像素
  • 高度：11.69 英寸 × 200 DPI = 2338 像素

因此，A4 纸张在200 DPI下生成的图片尺寸为 1654 像素 × 2338 像素。

A3 纸张（11.69 英寸 × 16.54 英寸）

  • 宽度：11.69 英寸 × 200 DPI = 2338 像素
  • 高度：16.54 英寸 × 200 DPI = 3308 像素

因此，A3 纸张在200 DPI下生成的图片尺寸为 2338 像素 × 3308 像素。

Web获取mm和px的关系

在Web制作答题卡的时候，我们可能需要mm和像素之间做转换

所以就需要获取1mm是多少像素

查考值：

  • 在标准96 DPI显示器上，1 mm ≈ 3.778 px
  • 在高DPI（例如144 DPI）显示器上，1 mm ≈ 5.669 px

方式1

1
2
3
4
5
6
7
let mmpx = 0;
let tmpNode = document.createElement("div");
tmpNode.style.cssText =
  "width:1mm;position:absolute;left:0px;top:0px;z-index:99;visibility:hidden";
document.body.appendChild(tmpNode);
mmpx = tmpNode.getBoundingClientRect().width;
console.log(`1 mm = ${mmpx.toFixed(2)} px`)

方式2

1
2
3
4
5
6
7
8
9
10
11
12
13
14
function getDPI() {
    const dpi = []
    const div = document.createElement('div')
    div.style.cssText = 'height: 1in; width: 1in; position: absolute; left: -100%; top: -100%; visibility: hidden;'
    document.body.appendChild(div)
    dpi[0] = div.offsetWidth
    dpi[1] = div.offsetHeight
    document.body.removeChild(div)
    return dpi
}

const dpi = getDPI()
const pixelsPerMM = dpi[0] / 25.4 // 1 inch = 25.4 mm
console.log(`1 mm = ${pixelsPerMM.toFixed(2)} px`)