Complex Image Processing Operations via JavaScript API 

Open Source JavaScript Library to perform advanced images creation and manipulation tasks such as image resizing, blitz an image onto another, blur an image, scaling an image, and many more. 

The Jimp – Javascript Image Manipulation Program is an open source Node.js library that gives software developers the capability to perform complex image processing operations inside their own JavaScript apps. It is written entirely in JavaScript for Node, without any external or native dependencies.

The library is very useful for developing any kind of advanced image processing application and is totally free so gives developers a cost effective solution with ease of use. The library includes several advanced features related to image creation and manipulation such as image resizing, enhanced quality of images, blitzing an image onto another, blurring an image, scaling an image, applying the dither effect to an image, flipping an image, invert the colors of an image, rotate an image, print text onto an image and many more.

The library has include support for several advanced image formats such as BMP, GIF, JPEG, PNG, TIFF, and many more. There are some extra plugins also available which can be used for some extra functionality such as the circle plugin that can be used to create a circle out of an image and the shadow plugin that creates a shadow on the image. There fisheye effect plugin and threshold plugin are available.

Previous Next

Getting Started with Jimp

You can install the library Jimp by issuing a simple command in Node. Use the following command. 

Install Jimp via NPM

npm install jimp 

Resize Images using JavaScript Library

The open source Jimp library has included functionality for resizing images inside their own JavaScript applications. Firstly you need to provide an image and a complete path to it. After that you can provide either the height or width and the Jimp library will scale the image accordingly. Once satisfied, you can save the image at the place of your choice. You can also easily scale the image by providing custom width and height keeping the aspect ratio.

Resize Images via JavaScript

import jimp from 'jimp';

async function main() {
	// Read the image.
	const image = await jimp.read('test/image.png');

	// Resize the image to width 150 and auto height.
	await image.resize(150, jimp.AUTO);

	// Save and overwrite the image
	await image.writeAsync('test/image.png');
}

main();

Flip, Scale or Rotate Images via JavaScript

The open source Jimp library has also provided functionality for several important features related to image manipulation. It allows the developer to flip as well as scale images with just a couple of lines of JavaScript code. The flip function will flip the image horizontally or vertically. The default settings are to flip the image horizontally. The rotate function will rotate the image clockwise and the dimensions of the image will remain the same.

Rotate Images via JavaScript API

import jimp from 'jimp';

async function main() {
  const image = await jimp.read('test/image.png');

  image.rotate(90);
}

main();

Apply Gaussian & Color Mix on Image

A Gaussian blur is a widely used effect in graphics software, typically to reduce image noise and reduce detail. The open source Jimp library enables software programmers to apply a true Gaussian blur to the image inside their own application. Please note that its processing is relatively slow as compared to other library functions. The library also supports the color mixing feature and it mixes colors by their RGB component values and the amount is the opacity of overlaying color.

Apply Gaussian to Image inside JavaScript Apps

import jimp from 'jimp';

async function main() {
  const image = await jimp.read('test/image.png');

  image.gaussian(15);
}

main();
 English