@f/img-to-canvas v1.0.0

img-to-canvas

Convert an img tag into a canvas tag, optionally with clipped dimensions (works only in browser).

Installation

$ npm install @f/img-to-canvas

Usage

var toBlob = require('@f/dataurl-to-blob')
var toCanvas = require('@f/img-to-canvas')

function cropImage (img, x, y, width, height) {
  return toBlob(toCanvas(img, x, y, width, height).toDataURL('image/png'))
}

Returns a canvas element containing the cropped image.

API

imgToCanvas(arg)

• img an <img> element
• x the distance along the x axis to begin cropping
• y the distance along the y axis to begin cropping
• width the width of the section you want to crop
• height the height of the section you want to crop
• scaleWidth scale the final image up/down to this width (optional - defaults to width)
• scaleHeight scale the final image up/down to this height (optional - defaults to height)

Returns: A canvas element containing the image at the specified dimensions.

License

MIT