npm 包 fp-images 使用教程-JavaScript中文网-JavaScript教程资源分享门户

尽管有许多图片相关的 JavaScript 库，fp-images（Functional Programming for Images）是一个充分体现函数式编程思想的 npm 包。fp-images 被设计为一个基于流式编程和函数组合的库。本教程将向您展示如何使用 fp-images。

安装 fp-images

在你的项目中，你可以通过 npm 安装 fp-images。

$ npm i -S fp-images

使用 fp-images

1. 加载 fp-images

首先，我们需要将 fp-images 导入我们的项目。

const fpImages = require("fp-images");

2. 创建图片对象

调用 fpImages.create 方法创建一个 fp-image 对象。该方法会接受一个参数，表示图片的路径。

const img = fpImages.create("path/to/image.jpg");

3. 对 fp-images 进行处理

fp-images 中的方法在调用时并不会改变原有图片对象，而是返回一个新的图片对象。

const brightnessImg = img.brightness(0.5);

4. 处理完成后输出图片

用 write 方法来将处理完成的图片输出为文件。

brightnessImg.write("path/to/processed/image.jpg");

注意，每次调用 write 方法都会生成一张新图片。如果要在同一文件上处理多次，需要使用链式调用。

5. 链式调用 fp-images

fp-images 的方法都是链式的，这意味着您可以在一个语句中对图片进行各种处理。

以下示例展示了如何使用 fp-images，将一张图片转换成灰度模式，然后增加其亮度。

const processedImg = fpImages
    .create("path/to/image.jpg")
    .grayscale()
    .brightness(0.5);
processedImg.write("path/to/processed/image.jpg");

在这个例子中，我们首先使用 .create 方法创建一个 fp-image 对象。然后在返回的对象中，我们按顺序调用了 .grayscale 和 .brightness 方法。

6. fp-images 可用的方法

以下，是 fp-images 可用的方法集合。

.brightness(n) - 将亮度增加或减少 n 的范围，值从 -1 到 1。
.contrast(n) - 将图片的对比度更改为 n 的范围，值从 -1 到 1。
.grayscale() - 将图片转换成灰度模式。
.invert() - 将图片转换为反转图像。
.rotate(n) - 将图片顺时针旋转 n 度。
.flip('x'|'y') - 翻转渲染好的图像，可以是水平翻转或垂直翻转。
.write(path) - 将图片写入到文件系统。

总结

fp-images 是一个轻量级、快速且基于流的库。通过这个 npm 包，您可以在没有任何繁琐地图形处理的情况下，更换图片的整个外观和感觉。本教程也向您展示了如何使用 fp-images，让您在项目中有效地使用这个库。

来源：JavaScript中文网，转载请注明来源 https://www.javascriptcn.com/post/60055c2c81e8991b448d9cc4