Neuron Powered Motorization

    crop-img

    1.0.0 • Public • Published

    crop-img

    Creates a crop region with the given dimensions and alignment to be used with HTML canvas drawImage, similar to background-size: cover / object-fit: cover.

    Install

    npm install crop-img

    Use

    import crop from 'crop-img';
     
    const width = window.innerWidth;
    const height = window.innerHeight;
     
    const context = document.createElement('canvas').getContext('2d');
    context.canvas.width = width;
    context.canvas.height = height;
    document.body.appendChild(context.canvas);
     
    const img = new Image();
    img.crossOrigin = 'anonymous';
    img.src = 'https://source.unsplash.com/random/1600x900';
    img.onload = onload;
     
    function onload() {
      // returns and object with x, y, width and height properties
      const rect = crop(img, { width, height, align: [0, 0]});
      context.drawImage(img, rect.x, rect.y, rect.width, rect.height);
    }

    Install

    npm i crop-img

    DownloadsWeekly Downloads

    4

    Version

    1.0.0

    License

    MIT

    Unpacked Size

    2.1 kB

    Total Files

    3

    Last publish

    Collaborators

    • nikrowell