I'd like to take one image and composite it on top of another image.
This works well for that purpose:
overlayImg = await Sharp(sourceImage.Body)
.composite([{
input: './lambdas/processNewImage/logos/white.png',
gravity: 'southeast',
}])
.toFormat('jpeg').toBuffer();
I also have a variable - 1-100 that is supposed to be the opacity of the watermark. Sometimes I want it full solid At 100% opacity, others 70% and others 30%...etc. Because I need this to be variable, I cannot just change the opacity of the watermark image.
I cannot figure out how to change the opacity of a composited image in Sharp.
Can any one give a quick example?
Found this in another thread where you overlay with a raw pixel buffer containing tiled, semi-transparent pixel value. 128 means 50% opacity where valid values are 0-255. https://github.com/lovell/sharp/issues/554
overlayImg = await Sharp(sourceImage.Body)
.composite([
{
input: './lambdas/processNewImage/logos/white.png',
gravity: 'southeast',
},
{
input: Buffer.from([0,0,0,128]),
raw: {
width: 1,
height: 1,
channels: 4,
},
tile: true,
blend: 'dest-in',
}
])
.toFormat('jpeg').toBuffer();