1. 产品
  2.   图片
  3.   JavaScript
  4.   Color Thief
 
  

用于图像处理的开源 JavaScript 库

用于从图像中获取调色板的 JavaScript API。

什么是颜色小偷?

Color Thief 是一个非常简单的轻量级图像处理库,使软件开发人员能够使用 JavaScript 从图像中获取颜色。它是一个纯 JavaScript 库,可以在 Node 和浏览器中运行,无需任何外部依赖。 API 从图像中获取主色。颜色以三个整数数组的形式返回,表示红色、绿色和蓝色值。在浏览器中工作时,您需要使用 HTML 图像进行处理,而在使用 Node 时,您需要使用图像的 URL。

Color Thief 包包含多个分发文件以支持不同的环境和构建过程。 color-thief.js 是处理图像的主要文件,color-thief.mjs 用于现代浏览器以及 Webpack 和 Rollup,color-thief.umd.js 用于简单的脚本标签加载。

Previous Next

颜色小偷入门

通过 NPM 安装 Color Thief 的推荐方法。请使用以下命令进行安装。

通过 NPM 安装 Color Thief

 npm i --save colorthief 

通过免费的 JavaScript API 从图像中获取颜色

开源 Color Thief 库允许 JavaScript 开发人员以编程方式从图像中提取颜色。为了从图像中获取主色,API 提供了 getColor() 方法。该方法从图像中获取主色。颜色以三个整数数组的形式返回,表示红色、绿色和蓝色 (RGB) 值。通过使用以下两行代码,您可以轻松地从图像中获取主色。

从图像中获取主色

  1. 加载图像
  2. 获取颜色

从 Node.js 中的图像中提取颜色

const img = resolve(process.cwd(), 'rainbow.png');
ColorThief.getColor(img)
.then(color => { console.log(color) })
.catch(err => { console.log(err) })
        

通过免费的 JavaScript API 从图像中获取调色板

使用 API,您还可以从图像中获取调色板 为了从图像中获取调色板,API 提供了 getPalette() 方法。该方法通过聚类相似的颜色从图像中获取调色板。调色板作为包含颜色的数组返回,每种颜色本身都是三个整数的数组。通过使用以下两行代码,您可以轻松地从图像中获取色板。

从图像中获取调色板

  1. 加载图像
  2. 获取色盘

在 Node.js 中提取色板图像

const img = resolve(process.cwd(), 'rainbow.png');
ColorThief.getPalette(img, 5)
.then(palette => { console.log(palette) })
.catch(err => { console.log(err) })
        
 中国人