How to combine two bitmap patterns using Node Jimp Blit Function?


This NodeJS – Blit() is an inbuilt function that is used to combine two bitmap patterns. It can also be used for combining several bitmaps into one using a boolean function.

Syntax

blit(src, x, y, [srcx, srcy, srcw, srch])

Definition of blit() paramters

  • src – It will store the source image for blit.

  • x – It will take input for x to blit the image.

  • y – It will take input for y to blit the image.

  • srcx – It is an optional parameter that will take the x-position to crop the source image.

  • srcy – It is an optional parameter that will take the y-position to crop the source image.

  • srcw – It is an optional parameter that will take the width to crop the source image.

  • srch - It is an optional parameter that will take the height to crop the source image.

Input Image

Using Node JIMP – BLIT()

Before proceeding to use blit() functions, please check that the following statements are already executed for setting up the environment.

  • npm init -y // Initialising the Node environment

  • npm install jimp --save // Installing the jimp dependency

  • Create a blit.js file and copy-paste the following code snippet in it.

  • Use node blit.js to run the code.

Note – The method name should match with the JS file name. Only then it will be able to call the desired method.

Example

const Jimp = require('jimp') ;

async function blit() { // Function name is same as of file name
   // Reading Image
   const image1 = await Jimp.read
   ('/home/jimp/tutorials_point_img.jpg');
   const image2 = await Jimp.read
   ('/home/jimp/tutorials_point_img.jpg');
   image1.blit(image2, 100, 150)
   .write('/home/jimp/blit.jpg')
}

blit(); // Calling the function here using async
console.log("Image is processed successfully");

Output

Using Node JIMP – Blit() with Optional parameters

Example

const Jimp = require('jimp') ;

async function blit() {
   // Reading Image
   const image1 = await Jimp.read
   ('/home/jimp/tutorials_point_img.jpg');
   const image2 = await Jimp.read
   ('/home/jimp/tutorials_point_img.jpg');
   image1.blit(image2, 70, 100, 130, 30, 440, 80)
   .write('/home/jimp/blit.jpg')
}

blit();
console.log("Image is processed successfully");

Output

Updated on: 27-Apr-2021

461 Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements