Have opinions about JavaScript? We want to hear them. Take the 2018 JavaScript Ecosystem Survey »

react-image-parser

2.0.2 • Public • Published

React-Image-Parser

With this component you can easily parse the image.

Features:

  • get image data;
  • get image size.

Install:

npm i react-image-parser

Add:

import ImageParser from 'react-image-parser';

Use:

<ImageParser
    img={'./path/to/image'}
    maxImgSideSize={400}
    onImageParsed={data => console.log(data)}
/>

Props:

Name Type Required Default Description
img String Yes null Path to image. For example, './my/image/path.png'
maxImgSideSize Number No bigger side of image The maximum size of the sides of the canvas on which the image will be parsed.
onImageParsed Function No null The function in which the image parsing result will be passed.

Result Structure:

{
    data: Uint8ClampedArray(64) [255, 202, 0, 134, 205, 159...], // image data
    size: { width: 100, height: 200 } // image size
} 

Demo:

For more information and examples check the demo page.

install

npm i react-image-parser

Downloadsweekly downloads

109

version

2.0.2

license

ISC

homepage

github.com

repository

Gitgithub

last publish

collaborators

  • avatar
Report a vulnerability