Node sharp image combine without repeating

Question

I'm using node sharp image manipulation library to combine two images .One image is small and I want to add it to the top left of larger image.

This is the code I'm using

const output = await sharp('sea.png')
  .composite([
    { input: 'circle.png', tile: true, blend: 'over' }
  ])
  .toFile('combined.png');

This is the output

Combined image

Is there a way to avoid repeating ?

Answer 1

The problem is that you are using tile:true which tells sharp to repeat the image. According to documentation:

images[].tile Boolean set to true to repeat the overlay image across the entire image with the given gravity. (optional, default false) https://sharp.pixelplumbing.com/api-composite#composite

So, making it like that should stop repeating

const output = await sharp('sea.png')
  .composite([
    { input: 'circle.png', blend: 'over' }
  ])
  .toFile('combined.png');