NodeJS_img_process: A JavaScript repository from zhangwellyear

NodeJS中的图片操作库

一、准备工作

安装sharp库

cnpm i sharp

准备待处理图片
在js文件中引入sharp库

const sharp = require('sharp')

二、sharp库的使用 2.1 重置图片的大小

使用sharp的构造函数创建一个图片对象，并将原图片重新设置大小为300 * 200后输出

const img_name = './images/cat_rabbit.jpg'
const resize_img_name = './images/resize_img.jpg'
sharp(img_name)
    .resize(300, 200)
    .toFile(resize_img_name, err => {
        if (err) console.log(err)
    })

处理结果可以看到，重置图片后，图片大小发生了改变（在PC端比较容易看到）

2.2 旋转图片

使用sharp的构造函数创建一个图片对象，并将原图片旋转180°后输出

const img_name = './images/cat_rabbit.jpg'
const rotate_img_name = './images/rotate_img.jpg'
sharp(img_name)
    .rotate(180)
    .toFile(rotate_img_name, err => {
        if (err) console.log(err)
    })

处理结果图

2.3 flatten alpha通道图层（为图片添加一个透明的背景色）该函数的应用，应用在rgba格式的图片上，如png上效果能够可见

使用sharp的构造函数创建一个图片对象，并使用flatten为其添加背景色

const img_name = './images/flower.png'
const flatten_img_name = './images/flatten_img.png'
sharp(img_name)
    .rotate(180)
    .toFile(rotate_img_name, err => {
        if (err) console.log(err)
    })

处理前后结果对比图

2.4 两张图片进行叠加的操作

使用composite函数完成两张图片叠加的操作

const img_name = './images/flower.png'
const composite_img = './images/composite.png'

sharp(img_name)
    .composite([{
        input: './images/cat_rabbit.jpg',
        gravity: 'southeast'    // 从东南角，也就是右下角开始
    }])
    .toFile(composite_img_name, err => {
        if (err) console.log(err)
    })

结果图

2.5 将图片转换为webp格式

const webp_img = './images/webp_img.png'

sharp(img_name)
    .webp({
        quality: 90
    })
    .toFile(composite_img_name, err => {
        if (err) console.log(err)
    })

2.6 将图片转换为buffer

sharp(img_name)
    .toBuffer()
    .then(outputBuffer => {
        console.log(outputBuffer)
    })

2.7 以X轴, Y轴作为旋转轴，进行镜像

sharp(img_name)     // 以 X轴 为旋转轴
    .flip(true)
    .toFile('./images/flip_img.jpg', err => {
        if (err) console.log(err)
    })

sharp(img_name)     // 以 Y轴 为旋转轴
    .flop(true)
    .toFile('./images/flop_img.jpg', err => {
        if (err) console.log(err)
    })

2.8 使用固定的卷积核对图像进行卷积

以索伯尔卷积滤波为例，使用convolve函数进行滤波操作

sharp(img_name)
    .convolve({
        width: 3,
        height: 3,
        kernel: [-1, 0, 1, -2, 0, 2, -1, 0, 1]  // 索伯尔滤波
    })
    .toFile('./images/convolve_img.jpg', err => {
        if (err) console.log(err)
    })

索伯尔滤波原图 - 结果图对比图

2.9 进行二值化处理

根据像素值的大小，来决定输出图像的像素值，当像素值大于固定阈值，则赋值为255，否则，赋值为0，使用threshold函数实现

sharp(img_name)
    .threshold(128)
    .toFile('./images/threshold_img.jpg', err => {
        if (err) console.log(err);
    })

二值化前后结果对比图

2.8 其余对图片进行操作的函数有 sharpen(锐化) median(中值滤波) blur(模糊) flatten(合并alpha通道) gamma negate(反转显示图像) normalise/normalize(图像均衡化操作) boolean(二元运算操作) linear(线性运算) recomb(重整图像) modulate(调整明亮度)

三、图像的相关操作 3.1 图像灰度化

使用grayscale函数进行灰度化

sharp(img_name)
    .grayscale(true)
    .toFile('./images/grayscale_img.jpg', err => {
        if (err) console.log(err)
    })

灰度化结果图

3.2 提取某个图片中的某个通道

使用extractChannel函数

sharp(img_name)
  .extractChannel('green')
  .toFile('green_img.jpg', function(err, info) {
    // info.channels === 1
    // input_green.jpg contains the green channel of the input image
   });

zhangwellyear/NodeJS_img_process

NodeJS中的图片操作库