# @behold/sharp-vibrant 中文文档

规范地址：https://npmcn.com/package/%40behold/sharp-vibrant/

版本：0\.2\.1
npm 元数据更新时间：2023-11-03T19:59:28.598Z
中文译文更新时间：2026-11-09T21:11:02.507Z
软件包许可：MIT

本文由上游 README 翻译，可能存在偏差，请结合原文核对 API、命令与配置。版权与许可归原作者所有。

原始 npm 页面：https://www.npmjs.com/package/%40behold/sharp-vibrant
原文对照：https://npmcn.com/package/%40behold/sharp-vibrant/?lang=original

## 关键信息（来自 npm 元数据）

- 包体积（解压后）：604 kB，83 个文件
- 模块格式：CommonJS
- TypeScript 类型：包内自带
- 运行依赖：2 个
- 首次发布：2023-11-03T19:59:27.917Z
- 最新版本发布：2023-11-03T19:59:28.316Z
- 近 30 天下载量：1729（2026-10-08 至 2026-11-06，npm 官方下载统计）
- 已发布版本数：1（近 12 个月 0 个）

## 中文简介

在节点环境中用尖锐从图像中提取出显著颜色 .

## 安装

```sh
npm install @behold/sharp-vibrant
```

也可以使用：`pnpm add @behold/sharp-vibrant`、`yarn add @behold/sharp-vibrant`、`bun add @behold/sharp-vibrant`

## README

# 锐生

使用节点从图像中提取出显著颜色 [锐口](https://sharp.pixelplumbing.com/) 用于图像加载/处理.

这是叉子 [节点活性剂](https://github.com/Vibrant-Colors/node-vibrant) 在绝对不支持浏览器的情况下,减少依赖性/复杂性。 此分叉是为内部使用而创建的,不发布给任何软件包管理器.

## 使用量

### 节点.js

```js
// ES5
var Vibrant = require('sharp-vibrant')
// ES6
import * as Vibrant from '@livechart/sharp-vibrant'
// TypeScript
import Vibrant = require('@livechart/sharp-vibrant')

// Using builder
Vibrant.from('path/to/image').getPalette((err, palette) => console.log(palette))
// Promise
Vibrant.from('path/to/image').getPalette()
  .then((palette) => console.log(palette))

// Using constructor
let v = new Vibrant('path/to/image', opts)
v.getPalette((err, palette) => console.log(palette))
// Promise
v.getPalette().then((palette) => console.log(palette))
```

## 贡献准则

1.  进行修改
2.  必要时写入测试规格
3.  通行证测试
4.  提交 **只有源文件** (没有编译的文件)

## 参考资料

### `Vibrant`

主要类别 `sharp-vibrant`。 。 。 .

#### `Vibrant.from(src: ImageSource): Builder`

做一个 `Builder` 一个图像。 回返a `Builder` 举个例子.

#### `constructor(src: ImageSource, opts: Partial<Options>)`

| 名称 | 说明 |
| --- | --- |
| `image` | 图像文件路径( 支持 HTTP/ HTTP) |
| `opts` | 选项( 可选) |

##### `ImageSource`

```ts
export type ImageSource = string | Buffer
```

##### `Options`

```ts
export interface Options {
    colorCount: number
    quality: number
    maxDimension: number
    filters: Array<Filter>
    ImageClass: ImageClass
    quantizer: Quantizer
    generator?: Generator
}
```

| 外地 | 默认 | 说明 |
| --- | --- | --- |
| `colorCount` | 64国道 | 用于生成手表的初始调色板中的颜色量 |
| `quality` | 页:1 | 在下采样阶段使用的缩放系数 . `1` 意思是没有下采样 若为 `maxDimension` 中,不使用此值. |
| `maxDimension` | `undefined` | 在下采样阶段使用的图像最长的一面. 此字段将覆盖 `quality`。 。 。 . |
| `filters` | `[]` | 过滤器阵列 |
| `ImageClass` | `Image.Node` | 一个 `Image` 执行类 |
| `quantizer` | `Vibrant.Quantizer.MMCQ` | A 类 `Quantizer` 执行类 |
| `generator` | `Vibrant.Generator.Default` | 一个 `Generator` 实例 |

##### `Resolvable<T>`

```ts
export type Resolvable<T> = T | Promise<T>
```

##### `Quantizer`

```ts
export interface Quantizer {
    (pixels: Pixels, opts: Options): Resolvable<Array<Swatch>>
}
```

##### `Generator`

```ts
export interface Generator {
    (swatches: Array<Swatch>, opts?: Object): Resolvable<Palette>
}
```

##### `Filter`

回返 `true` 如果颜色要保留的话.

```ts
export interface Filter {
    (red: number, green: number, blue: number, alpha: number): boolean
}
```

##### `getPalette(cb?: Callback<PaletteResult>): Promise<PaletteResult>`

| 名称 | 说明 |
| --- | --- |
| `cb` | (可选)回调功能. 使用时可省略 `Promise`。 。 。 . |

##### `Callback<T>`

```ts
export interface Callback<T> {
    (err?: Error, result?: T): void
}
```

##### `ImageDimensions`

```ts
interface ImageDimensions {
    readonly width: number
    readonly height: number
}
```

##### `PaletteResult`

```ts
interface PaletteResult {
    readonly pixelCount: number
    readonly imageDimensions: ImageDimensions
    readonly palette: Palette
}
```

#### `Vibrant.Builder`

用于更改配置的帮助类并创建 `Vibrant` 举个例子 方法a `Builder` 实例可以是:

```ts
Vibrant.from(src)
  .quality(1)
  .clearFilters()
  // ...
  .getPalette()
  .then((paletteResult) => {})
```

#### `constructor(src: ImageSource, opts: Partial<Options>)`

参数与 `Vibrant.constructor`。 。 。 .

#### `quality(q: number): Builder`

设定 `opts.quality` 改为 `q`返回此选项 `Builder` 举个例子.

#### `maxColorCount(n: number): Builder`

设定 `opts.colorCount` 改为 `n`返回此选项 `Builder` 举个例子.

#### `maxDimension(d: number): Builder`

设定 `opts.maxDimension` 改为 `d`返回此选项 `Builder` 举个例子.

#### `addFilter(f: Filter): Builder`

添加过滤函数。 返回这个 `Builder` 举个例子.

#### `removeFilter(f: Filter): Builder`

删除过滤功能。 返回这个 `Builder` 举个例子.

#### `clearFilters(): Builder`

清除所有过滤器 。 返回这个 `Builder` 举个例子.

#### `useImageClass(imageClass: ImageClass): Builder`

指定哪个 `Image` 要使用的执行类。 返回这个 `Builder` 举个例子.

#### `useQuantizer(quantizer: Quantizer): Builder`

指定哪个 `Quantizer` 要使用的执行类。 返回这个 `Builder` 举个例子.

#### `useGenerator(generator: Generator): Builder`

设定 `opts.generator` 改为 `generator`返回此选项 `Builder` 举个例子.

#### `build(): Vibrant`

构建并返回 a `Vibrant` 实例已配置.

#### `getPalette(cb?: Callback<PaletteResult>): Promise<PaletteResult>`

构建一个 `Vibrant` 选项 `getPalette` 方法.

### `Vibrant.Swatch`

代表一个图像调色板生成的颜色表 .

#### `Vec3`

```ts
export interface Vec3 extends Array<number> {
    0: number,
    1: number,
    2: number
}
```

#### `constructor(rgb: Vec3, population: number)`

内用.

| 名称 | 说明 |
| --- | --- |
| `rgb` | `[r, g, b]` |
| `population` | 图像中的颜色人口 |

#### `getHsl(): Vec3`

#### `getPopulation(): number`

#### `getRgb(): Vec3`

#### `getHex(): string`

#### `getTitleTextColor(): string`

返回用于在此显示的任何“ 标题” 文本的适当颜色 `Swatch`颜色.

#### `getBodyTextColor(): string`

返回任何在此显示的“ body” 文本的适当颜色 `Swatch`颜色.

### `Vibrant.Util`

实用方法. 内用.

#### `hexToRgb(hex: string): Vec3`

#### `rgbToHex(r: number, g: number, b: number): string`

#### `hslToRgb(h: number, s: number, l: number): Vec3`

#### `rgbToHsl(r: number, g: number, b: number): Vec3`

#### `xyzToRgb(x: number, y: number, z: number): Vec3`

#### `rgbToXyz(r: number, g: number, b: number): Vec3`

#### `xyzToCIELab(x: number, y: number, z: number): Vec3`

#### `rgbToCIELab(l: number, a: number, b: number): Vec3`

#### `deltaE94(lab1: number, lab2: number): number`

计算 CIE 三角洲 E 1994 diff 之间 `lab1` 财务报告和审定财务报表 `lab2`。两种颜色在 CIE-Lab 颜色空间。 在测试中用来比较出两种颜色的感知相似性.

#### `rgbDiff(rgb1: Vec3, rgb2: Vec3): number`

计算 CIE 三角洲 E 1994 diff `rgb1` 财务报告和审定财务报表 `rgb2`。 。 。 .

#### `hexDiff(hex1: string, hex2: string): number`

计算 CIE 三角洲 E 1994 diff `hex1` 财务报告和审定财务报表 `hex2`。 。 。 .

#### `getColorDiffStatus(d: number): string`

获得一个字符串来描述颜色 diff 的含义。 用于测试.

| 德尔塔-E | 感觉 | 回返 |
| --- | --- | --- |
| 页:1 | 人眼所不觉. | `"Perfect"` |
| 第1至2条 | 透过相近观察能知. | `"Close"` |
| 第2-10条 | 可观一相. | `"Good"` |
| 11 - 49 (中文(简体) ) | 颜色比对相近 | `"Similar"` |
| 50 - 100岁 | 颜色完全相反 | `Wrong` |

## 国家预防机制的任务

| 任务 | 说明 |
| --- | --- |
| `build:node` | 构建节点.js目标 |
| `build` | 构建全部目标 |
| `clean:node` | 干净的节点.js 构建 |
| `clean` | 清理所有建筑 |
| `test:node` | 运行节点.js specs (mocha) |
| `test` | 运行全部规格 |

## 常见问题

### @behold/sharp-vibrant 是什么？

在节点环境中用尖锐从图像中提取出显著颜色 \.

### 如何安装 @behold/sharp-vibrant？

在项目目录运行 npm install @behold/sharp-vibrant，或使用 pnpm add / yarn add / bun add。

### @behold/sharp-vibrant 支持 TypeScript 吗？

支持。包内自带 TypeScript 类型声明（package\.json 声明了 types 入口），安装后即可获得类型提示，无需再安装 @types 包。

### @behold/sharp-vibrant 支持 ESM 还是 CommonJS？

以 CommonJS 形式发布，可以直接 require\(\)；在 ES Module 项目中也可以用 import 引入（Node\.js 会把 module\.exports 作为默认导出）。

### @behold/sharp-vibrant 可以商用吗？

@behold/sharp-vibrant 使用 MIT 许可。宽松许可：允许商业使用、修改和再分发，通常只需在分发时保留原版权与许可声明。以上为概括，不构成法律意见，请以许可原文为准。

### @behold/sharp-vibrant 的下载量有多少？

根据 npm 官方下载统计，@behold/sharp-vibrant 在 2026/10/08 – 2026/11/06 这 30 天内被下载 1,729 次，日均约 58 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入，适合横向比较热度，不能直接等同于使用人数。

### @behold/sharp-vibrant 还在维护吗？

最新版本 0\.2\.1 发布于 2023/11/04（3 年前）；至今共发布 1 个版本，其中过去 12 个月发布了 0 个；首次发布于 2023/11/04。发布频率只是参考信号：功能稳定的工具可能很少需要更新，建议结合源码仓库的 issue 和提交记录判断。

