png-chunk-phys

Reader/Writer for png chunk pHYs on browsers

Usage no npm install needed!

<script type="module">
  import pngChunkPhys from 'https://cdn.skypack.dev/png-chunk-phys';
</script>

README

png-chunk-pHYs

Reader/Writer for png image's pHYs chunk on browsers.

CircleCI

Installation

$ npm install png-chunk-phys

Usage

Reader

Detect width, height and DPI for PNG image.

const res = await fetch(srcUrl, {mode: 'cors'})
const arrayBuffer = await res.arrayBuffer()

const {width, height, dpi} = parsePngFormat(arrayBuffer)

Writer

Write DPI for PNG image. See also demo/src/index.js.

const newByteArray = writePngDpi(arrayBuffer, window.devicePixelRatio * 72)

const img = document.querySelector('img')
img.src = convertToDataURI(newByteArray)

Demo

$ npm run start

Related projects