如何在 Node Jimp 中将一个图像叠加到另一个图像上?
该 `composite()` 方法将图像叠加到另一个 Jimp 图像上的指定 x、y 坐标处。图像将放置在指定的坐标位置。
语法
composite( src, x, y, [{ mode, opacitySource, opacityDest }] );composite() 参数定义
src – src 定义了该图像所在文件的源位置。它可以是本地位置或远程位置。
x, y – 表示放置文件位置的坐标。
mode – 你可以在这里为图像定义模式。例如,`Jimp.BLEND_SOURCE_OVER` – 此模式将尝试将新图像混合到旧图像中。
opacityDest – 这将定义目标图像的不透明度,即放置新图像的图像的不透明度。
opacitySource – 这将定义源图像的不透明度,即新图像的不透明度。
输入图像

叠加图像

使用 Node JIMP – GREYSCALE()
在继续使用 greyscale() 函数之前,请检查以下语句是否已执行以设置环境。
npm init -y // 初始化 Node 环境
npm install jimp --save // 安装 jimp 依赖项
创建一个名为 imageOverlay.js 的文件,并将以下代码片段复制粘贴到其中。
使用 node imageOverlay.js 运行代码。
注意 – 方法名称应与 JS 文件名匹配。只有这样才能调用所需的方法。
示例
const Jimp = require('jimp') ;
async function imageOverlay(imageOverlay) { // Function name is same as of file
name
// Reading watermark Image
let watermark = await Jimp.read(imageOverlay);
watermark = watermark.resize(150,150); // Resizing watermark image
// Reading original image
const image = await Jimp.read('/home/jimp/tutorials_point_img.jpg');
watermark = await watermark
image.composite(watermark, 0, 0, {
mode: Jimp.BLEND_SOURCE_OVER,
opacityDest: 1,
opacitySource: 0.5
})
await image.writeAsync('/home/jimp/newImage.png');
}
// Calling this function using async
imageOverlay('/home/jimp/overlay_image.png');
console.log("Image is processed successfully");输出

广告
数据结构
网络
关系数据库管理系统 (RDBMS)
操作系统
Java
iOS
HTML
CSS
Android
Python
C 编程
C++
C#
MongoDB
MySQL
Javascript
PHP