# @doodle3d/clipper-js 中文文档

规范地址：https://npmcn.com/package/%40doodle3d/clipper-js/

版本：1\.0\.11
npm 元数据更新时间：2022-04-05T05:16:28.706Z
中文译文更新时间：2026-11-12T16:24:30.932Z
软件包许可：MIT

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

原始 npm 页面：https://www.npmjs.com/package/%40doodle3d/clipper-js
原文对照：https://npmcn.com/package/%40doodle3d/clipper-js/?lang=original
项目主页：https://github.com/Doodle3D/clipper-js#readme
源码仓库：https://github.com/Doodle3D/clipper-js

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

- 包体积（解压后）：98.9 kB，11 个文件
- 模块格式：ESM + CJS
- TypeScript 类型：包内自带
- 运行依赖：1 个
- 首次发布：2017-07-20T11:34:41.488Z
- 最新版本发布：2020-03-05T07:18:29.880Z
- 近 30 天下载量：30893（2026-10-13 至 2026-11-11，npm 官方下载统计）
- 已发布版本数：10（近 12 个月 0 个）

## 中文简介

克利珀特-利布抽象层(简化 API)

## 安装

```sh
npm install @doodle3d/clipper-js
```

也可以使用：`pnpm add @doodle3d/clipper-js`、`yarn add @doodle3d/clipper-js`、`bun add @doodle3d/clipper-js`

## README

# 克利珀斯

[克利珀斯](https://sourceforge.net/projects/jsclipper/) 抽象层( 简化 API)

这个图书馆的目标是消除复杂性,为克利珀尔建立一个整体的更清洁的JavaScript平面API.

当使用此 API 一个类时, 形状 被使用 。 形状是一组所有集体关闭或开放的路径. 有孔的形状被定义为多条闭路道,其中轮廓为顺时针而孔为逆时针. 形状有多种功能,可以用来计算复杂的布尔操作,例如从一个简单的调用.

接下来的两个代码示例显示在剪接机和ClipperJS中有一个简单的布尔操作. 两者都使用两个预先定义的路径

```javascript
const subjectPaths = [[{ X: 30, Y: 30 }, { X: 10, Y: 30 }, { X: 10, Y: 10 }, { X: 30, Y: 10 }]];
const clipPaths = [[{ X: 20, Y: 20 }, { X: 0, Y: 20 }, { X: 0, Y:0 }, { X: 20, Y: 0 }]];
```

剪辑机中的布尔交叉操作是这样的

```javascript
const result = new ClipperLib.Paths();
const clipper = new ClipperLib.Clipper();
clipper.AddPaths(subjectPaths, ClipperLib.PolyType.ptSubject, true);
clipper.AddPaths(clipPaths, ClipperLib.PolyType.ptClip, true);
clipper.Execute(ClipperLib.ClipType.ctIntersection, result);

// result = [[{ X: 20, Y: 20 }, { X: 10, Y: 20 }, { X: 10, Y: 10 }, { X: 20, Y: 10 }]]
```

在克利珀斯

```javascript
const subject = new Shape(subjectPaths, true);
const clip = new Shape(subjectPaths, true);

const result = subject.intersect(clip);

// result = { closed: true, paths: [[{ X: 20, Y: 20 }, { X: 10, Y: 20 }, { X: 10, Y: 10 }, { X: 20, Y: 10 }]] }
```

# 使用量

### 使用 JSPM( ECMAScript / ES6 模块)

安装库.

```
jspm install github:Doodle3D/clipper-js
```

包括图书馆.

```javascript
import Shape from 'Doodle3D/clipper-js';
```

### 使用国家预防机制(共同JS模块)

安装库.

```
npm install @doodle3d/clipper-js --save
```

包括图书馆.

```javascript
var Shape = require('clipper-js');
```

# API 密码

**形状**

形状接受3个可选参数, `paths`, (中文(简体) ), `closed` 财务报告和审定财务报表 `capitalConversion`。 。 。 . `paths` 也可以用大写和小写来形容 克利珀顿仅使用大写属性,输入时使用小写 `captalConversion` 需要设置为 `true`。 。 。 .

```javascript
new Shape([ paths = [], closed = true, capitalConversion = false, integerConversion = false, removeDuplicates = false ])

paths = [...[...{ X: Number, Y: Number }] || [...[...{ x: Number, y: Number }]
paths = Array
closed = Bool
capitalConversion = Bool
removeDuplicates = Bool
```

-   路径: 构成形状的路径
-   关闭:形状是多边形或行
-   大写转换:将小写x和y转换为大写X和Y
-   资本转换:剪接器只与接口工作, 有时输入在浮点数剪接器中失败
-   删除重复: 当数据集出现重复点时, 剪辑器有时会失败, 此参数过滤出所有重复点

`Note: due to the nature of Clipper, some functions are destructive and some are non-destructive.`

**[布尔操作: 联盟](https://sourceforge.net/p/jsclipper/wiki/documentation/#clipperlibclipperexecute)**

```javascript
Shape = Shape.union( clipShape: Shape )
```

-   剪辑形状:布尔操作的剪辑

**[布尔操作: 差异](https://sourceforge.net/p/jsclipper/wiki/documentation/#clipperlibclipperexecute)**

```javascript
Shape = Shape.difference( clipShape: Shape )
```

-   剪辑形状:布尔操作的剪辑

**[布尔操作:相交](https://sourceforge.net/p/jsclipper/wiki/documentation/#clipperlibclipperexecute)**

```javascript
Shape = Shape.intersect( clipShape: Shape )
```

-   剪辑形状:布尔操作的剪辑

**[布尔操作: Xor](https://sourceforge.net/p/jsclipper/wiki/documentation/#clipperlibclipperexecute)**

```javascript
Shape = Shape.xor( clipShape: Shape )
```

-   剪辑形状:布尔操作的剪辑

**[折减](https://sourceforge.net/p/jsclipper/wiki/documentation/#clipperoffset)**

```javascript
Shape = Shape.offset( offset: Number, options: {
  jointType = 'jtSquare',
  endType = 'etClosedPolygon',
  miterLimit = 2.0,
  roundPrecision = 0.25
} )
```

-   偏移: 从布尔操作中剪去
-   选项:带有默认值的可选参数
    -   [联合类型](https://sourceforge.net/p/jsclipper/wiki/documentation/#clipperlibjointype)页:1
    -   [尾端类型](https://sourceforge.net/p/jsclipper/wiki/documentation/#clipperlibendtype)页:1
    -   [密特利米特语Name](https://sourceforge.net/p/jsclipper/wiki/documentation/#clipperlibclipperoffsetmiterlimit): mitter 限制
    -   [圆精度](https://sourceforge.net/p/jsclipper/wiki/documentation/#clipperlibclipperoffsetarctolerance):弧容忍度

沿常态抵消形状.

**[缩放](https://sourceforge.net/p/jsclipper/wiki/documentation/#clipperlibjsscaleuppaths)**

```javascript
Shape.scaleUp( factor: Number )
```

以因数来缩放.

`Note: destructive`

**[缩放](https://sourceforge.net/p/jsclipper/wiki/documentation/#clipperlibjsscaledownpaths)**

```javascript
Shape.scaleDown( factor: Number )
```

以因数来缩放.

`Note: destructive`

**第一点**

```javascript
{ X: Number, Y: Number } || { x: Number, y: Number } = Shape.firstPoint([ capitalConversion: false ])
```

-   大写转换:将大写X和Y转换为小写x和y.

返回第一个点的位置.

**最后一点**

```javascript
{ X: Number, Y: Number } || { x: Number, y: Number } = Shape.lastPoint([ capitalConversion: false ])
```

-   大写转换:将大写X和Y转换为小写x和y.

返回最后一个点的位置.

**面积共计**

```javascript
Number = Shape.totalArea()
```

返回形状的总面积.

**[区域](https://sourceforge.net/p/jsclipper/wiki/documentation/#clipperlibclipperarea)**

```javascript
Number = Shape.area( index: Int )
```

-   索引:子形状的索引

返回子形状的区域(如果逆时针明智,则为负).

**领域**

```javascript
[...Number] = Shape.areas()
```

返回所有子形状的区域.

**共计**

```javascript
Number = Shape.totalPerimeter()
```

返回形状的总周边.

**[周边](https://sourceforge.net/p/jsclipper/wiki/documentation/#clipperlibjsperimeterofpath)**

```javascript
Number = Shape.perimeter( index: Int )
```

-   索引:子形状的索引

返回子形状的周边.

**周长**

```javascript
[...Number] = Shape.perimeters()
```

返回所有子形状的周边阵列.

**[反转](https://sourceforge.net/p/jsclipper/wiki/documentation/#clipperlibclipperreversepaths)**

```javascript
Shape.reverse()
```

倒转所有子形状的顺序.

**三角形区域**

```javascript
Shape.tresholdArea( minArea: Number )
```

-   最小面积

从形状中去除所有较小的子形状.

**联合**

```javascript
Shape.join( shape )
```

以给定的形状加入形状.

`Note: destructive`

**[克隆](https://sourceforge.net/p/jsclipper/wiki/documentation/#clipperlibjsclone)**

```javascript
Shape = Shape.clone()
```

返回形状副本.

**[形状边界](https://sourceforge.net/p/jsclipper/wiki/documentation/#clipperlibjsboundsofpaths)**

```javascript
{
  left: Int,
  right: Int,
  top: Int,
  bottom: Int,
  width: Int,
  height: Int,
  size: Int
} = Shape.shapeBounds()
```

返回形状的边框.

**[路径边界](https://sourceforge.net/p/jsclipper/wiki/documentation/#clipperlibjsboundsofpath)**

```javascript
{
  left: Int,
  right: Int,
  top: Int,
  bottom: Int,
  width: Int,
  height: Int,
  size: Int
} = Shape.pathBounds( index: Int )
```

返回子形状的边框.

**[干净](https://sourceforge.net/p/jsclipper/wiki/documentation/#clipperlibclippercleanpolygons)**

```javascript
Shape = Shape.clean( cleanDelta: Number )
```

**[方向](https://sourceforge.net/p/jsclipper/wiki/documentation/#clipperlibclipperorientation)**

```javascript
Bool = Shape.orientation( index: Int )
```

返回子形状的方向。 如果顺时针,假的,如果逆时钟明智.

**在形状中点**

```javascript
Bool = Shape.pointInShape( { X: Number, Y: Number }, [ capitalConversion = false, integerConversion = false ] )
```

-   点: 用于命中检测的位置
-   大写转换:将小写x和y转换为大写X和Y
-   整数转换:将点转换为入点

如果点为形状,则返回.

**[路径中的点](https://sourceforge.net/p/jsclipper/wiki/documentation/#clipperlibclipperpointinpolygon)**

```javascript
Bool = Shape.pointInPath( index: Int, { X: Number, Y: Number }, [ capitalConversion = false, integerConversion = false ] )
```

-   点: 用于命中检测的位置
-   索引:子形状的索引
-   大写转换:将小写x和y转换为大写X和Y
-   整数转换:将点转换为入点

如果点处于子形状,则返回.

**修正方向**

```javascript
Shape.fixOrientation()
```

当给定有孔的路径时,外观必须顺时针,孔必须逆时针. 试着修正方向.

`Note: destructive`

**[简化](https://sourceforge.net/p/jsclipper/wiki/documentation/#clipperlibclippersimplifypolygons)**

```javascript
Shape = Shape.simplify(fillType: String)
```

使用填充类型来简化形状。 只为闭塞外形而活.

**撕裂形状**

```javascript
[...Shape] = Shape.seperateShapes()
```

当使用联盟操作时,可以创建多个形状。 斯珀特形状将这些形状分解为分解实例. 所有形状都保持了洞口.

**回合**

```javascript
Shape = Shape.round()
```

返回新形状实例, 将所有点四舍五入到整数 .

**删除复制件**

```javascript
Shape = Shape.removeDuplicates()
```

返回新形状实例, 删除所有重复点 .

**下图**

```javascript
[...[...{ x: Number, y: Number }]] = Shape.mapToLower()
```

返回小写 x 和 y 的路径数组.

## 常见问题

### @doodle3d/clipper-js 是什么？

克利珀特-利布抽象层\(简化 API\)

### 如何安装 @doodle3d/clipper-js？

在项目目录运行 npm install @doodle3d/clipper-js，或使用 pnpm add / yarn add / bun add。

### @doodle3d/clipper-js 支持 TypeScript 吗？

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

### @doodle3d/clipper-js 支持 ESM 还是 CommonJS？

同时提供 ES Module 与 CommonJS 入口，import 和 require\(\) 都可以使用，打包工具会自动选择合适的版本。

### @doodle3d/clipper-js 可以商用吗？

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

### @doodle3d/clipper-js 的下载量有多少？

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

### @doodle3d/clipper-js 还在维护吗？

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