How to make one image from multiple images in node js

1.1k views Asked by At

I want to make one image from multiples images in node js. I found the NPM package "spritesmith" for this. It combines the image and returns buffer representation of image, but I want to have more control over the final image. I want the input images to be display on specific position(pixel perfect) in final image, and also wants to downscale images. I have done some search, but found nothing about it. Can anyone please throw some possibillites for doing this thing. I want to combine about 10,000 images with 10 x 10 px for each image. What I'm planning is when a new image is uploaded by user, I want to add it to previously giant image.

1

There are 1 answers

0
Ashot Hayrapetyan On

Use the package Sharp.

images //your array of 10000 images
const emptyImage = await sharp({
    create: {
        width: 1000,
        height: 1000,
        channels: 3,
        background: { r: 255, g: 255, b: 255 },
    },
})
.composite(
    images.map((image, index)=>({
        input: image,
        left: index%100,
        top: parseInt(index/100),
        width: 10,
        height: 10,
    }))
)    
.toFormat('jpeg', { quality: 100 })
.toBuffer();