資料結構
網路
關係資料庫管理系統 (RDBMS)
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理
化學
生物
數學
英語
經濟學
心理學
社會學
服裝設計
法學如何在 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");輸出
更新於：2021年4月27日
2K+ 次瀏覽
廣告