Add functions to get current DPI from image

[csandman]

Related packages

• https://github.com/murkle/rewrite-png-pHYs-chunk
• https://github.com/hughsk/png-chunks-extract
• https://github.com/daiiz/png-dpi-reader-writer
• https://github.com/daiiz/dpi-aware-image

[csandman]

Interesting comment about calculating dpi:

After a fair bit of googling, I was unable to find a property that actually specified the canvas default dpi.

The best short-hand calculation I could find was to back-calculate it from the devicePixelRatio and CSS's mediaMatch function:

/* Binary search for dpi */
function findFirstPositive(b, a, i, c) {
  c=(d,e)=>e>=d?(a=d+(e-d)/2,0<b(a)&&(a==d||0>=b(a-1))?a:0>=b(a)?c(a+1,e):c(d,a-1)):-1
  for (i = 1; 0 >= b(i);) i *= 2
  return c(i / 2, i)|0
}

/* 240 on my device */
var deviceDpi = findFirstPositive(x => matchMedia(`(max-resolution: ${x}dpi)`).matches)

/* 2.5 on my device */
var pixelRatio = window.devicePixelRatio || 1

/* 96 on my device */
var canvasDpi = deviceDpi / pixelRatio

— https://github.com/tsayen/dom-to-image/pull/103/files/8dab9883ab096eef2c44504797cad085109a4532