https://github.com/csbun/resize-image

Resize images in browser using canvas
https://github.com/csbun/resize-image

canvas image resize

Last synced: about 1 year ago
JSON representation

Resize images in browser using canvas

• Host: GitHub
• URL: https://github.com/csbun/resize-image
• Owner: csbun
• License: mit
• Created: 2015-07-22T07:11:18.000Z (almost 11 years ago)
• Default Branch: master
• Last Pushed: 2022-12-07T17:32:51.000Z (over 3 years ago)
• Last Synced: 2025-04-10T22:03:45.581Z (about 1 year ago)
• Topics: canvas, image, resize
• Language: JavaScript
• Size: 1.46 MB
• Stars: 28
• Watchers: 2
• Forks: 8
• Open Issues: 7
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
# resize-image

Resize images in browser using canvas

[![NPM](https://nodei.co/npm/resize-image.png)](https://nodei.co/npm/resize-image/)

[![Build Status](https://travis-ci.org/csbun/resize-image.svg)](https://travis-ci.org/csbun/resize-image)

[![Coverage Status](https://coveralls.io/repos/csbun/resize-image/badge.svg?branch=master&service=github)](https://coveralls.io/github/csbun/resize-image?branch=master)

## Install

### npm

```sh

npm i resize-image --save

```

### bower

```sh

bower install resize-image --save

```

## Usage

```javascript

var resizeImage = require('resize-image');

var img = new Image();

img.onload= function () {

  var data = resizeImage.resize(img, 200, 100, resizeImage.PNG);

  console.log(data);

};

img.src = url; // local image url

```

### .resize2Canvas(img, width, height)

resize an `` or `Image` or `` to canvas

- {Image}  img:    an `` or `Image()`

- {number} [width]:  output image width

- {number} [height]: output image height

### .resize(img, width, height, type)

resize an `` or `Image` or `` to base64

- {Image}  img:    an `` or `Image()`

- {number} [width]:  output image width

- {number} [height]: output image height

- {string} [type]:   output image type

### types

- .PNG (default)

- .GIF

- .BMP

- .JPEG

- .WEBP

## Examples

```

yarn

npm run example

```

And visit http://localhost:9000/.