test-image-processing
v1.0.1
Published
This library was developed with javascript and works for client-side browser.
Readme
Image processing library
This library was developed with javascript and works for client-side browser.
Installation
Install the library using with npm
npm install test-image-processingUsage/Examples
Create a html file and call the bundle
<head>
<script src='./node_modules/test-image-processing/index.js'></script>
</head>Create a div into the body whenever you want to use it
<div id="div-canvas">
</div>Functions Reference
Load image to process
<body>
<script>
var upload = new jsimage.image(div_id,pathImage,canvasId);
upload.uploadImage();
</script>
</body>| Parameter | Type | Description |
| :-------- | :------- | :------------------------- |
| divId | string | Required. div id where the canvas will be embebed |
| pathImage | string | Required. path where the image is located |
| canvasId | string | Not Required. the id name for the canvas |
Transform image to grayscale
<body>
<script>
var grayscale = new jsimage.image(div_id,pathImage,canvasId);
grayscale.grayScaleImage();
</script>
</body>| Parameter | Type | Description |
| :-------- | :------- | :------------------------- |
| divId | string | Required. div id where the canvas will be embebed |
| pathImage | string | Required. path where the image is located |
| canvasId | string | Not Required. the id name for the canvas |
Rotate image according to the given degrees
<body>
<script>
var rotate = new jsimage.image(divId,pathImage,canvasId,degrees);
rotate.rotateImage();
</script>
</body>| Parameter | Type | Description |
| :-------- | :------- | :------------------------- |
| divId | string | Required. div id where the canvas will be embebed |
| pathImage | string | Required. path where the image is located |
| canvasId | string | Not Required. the id name for the canvas |
| degrees | number | Required. value to rotate the image |
Resize the image according to percentage
<body>
<script>
var resize = new jsimage.image(divId,pathImage,canvasId,percentage);
resize.resizeImage();
</script>
</body>| Parameter | Type | Description |
| :-------- | :------- | :------------------------- |
| divId | string | Required. div id where the canvas will be embebed |
| pathImage | string | Required. path where the image is located |
| canvasId | string | Not Required. the id name for the canvas |
| percentage | number | Required. value to rotate the image |
Reset image to original state
<body>
<script>
var original = new jsimage.image(divId,pathImage,canvasId);
original.setOriginal();
</script>
<body>| Parameter | Type | Description |
| :-------- | :------- | :------------------------- |
| divId | string | Required. div id where the canvas will be embebed |
| pathImage | string | Required. path where the image is located |
| canvasId | string | Not Required. the id name for the canvas |
Run the sample
Use a web server to run: sample/index.html