# @d3fc/d3fc-sample 中文文档

规范地址：https://npmcn.com/package/%40d3fc/d3fc-sample/

版本：5\.0\.2
npm 元数据更新时间：2024-06-13T14:55:10.719Z
中文译文更新时间：2026-11-11T08:01:21.891Z
软件包许可：MIT

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

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

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

- 包体积（解压后）：71.4 kB，17 个文件
- 模块格式：ESM + CJS
- TypeScript 类型：未声明
- 运行依赖：1 个
- peer 依赖：d3-array \*
- 首次发布：2018-08-02T13:55:59.226Z
- 最新版本发布：2024-06-13T14:55:10.491Z
- 近 30 天下载量：87052（2026-10-11 至 2026-11-09，npm 官方下载统计）
- 已发布版本数：16（近 12 个月 0 个）

## 中文简介

一个使用最大的三角形或模式-中间方法选择具有代表性的数据点的数据分样器.

## 安装

```sh
npm install @d3fc/d3fc-sample
```

也可以使用：`pnpm add @d3fc/d3fc-sample`、`yarn add @d3fc/d3fc-sample`、`bun add @d3fc/d3fc-sample`

## README

# d3fc-样本

一个D3组件,用于使用各种方法进行下采样数据. 数据一般被分入大小相同的桶中,从每个桶中选择一个数据点. 这里使用的算法是: 大三角 1 (或 3) Bucket, 或 论文所详述的Mode-Median [用于视觉表现的倒采样时间序列](http://skemman.is/stream/get/1946/15343/37285/3/SS_MSthesis.pdf)。 。 。 .

![](https://d3fc.io/examples/sample/screenshot.png)

现场演示请看 [GitHub 页面网站](http://d3fc.github.io/d3fc-sample/)。 。 。 .

[主要 D3FC 软件包](https://github.com/d3fc/d3fc)

## 安装

```bash
npm install @d3fc/d3fc-sample
```

## API 参考

-   [模式介质](https://npmcn.com/package/%40d3fc/d3fc-sample/#readme-mode-median)
-   [最大的三角一桶](https://npmcn.com/package/%40d3fc/d3fc-sample/#readme-largest-triangle-one-bucket)
-   [大三角三块](https://npmcn.com/package/%40d3fc/d3fc-sample/#readme-largest-triangle-three-buckets)
-   [弹夹](https://npmcn.com/package/%40d3fc/d3fc-sample/#readme-bucket)

采样部分为下取样数据提供了API. 它们通常被用于在有大量数据时改进图表或地图的渲染性能. 数据被传递到组件,然后返回一个更小的下取样阵列.

```javascript
import {largestTriangleThreeBucket} from 'd3fc-sample';

// Create the sampler
const sampler = largestTriangleThreeBucket();

// Configure the x / y value accessors
sampler.x(d => d.x)
    .y(d => d.y);

// Configure the size of the buckets used to downsample the data.
sampler.bucketSize(10);

// Run the sampler
const sampledData = sampler(data);
```

### 模式介质

模式-中间采样器相当基本。 它分割数据,然后从该集中选择一个具有代表性的数据:模式 -- -- 如果存在 -- -- 或者中位数.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-sample/#readme-modeMedian) 页:1.**模式**(a) 与《公约》有关的其他事项

构造一个新的采样器.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-sample/#readme-modeMedian_) _模式_(单位:千美元)_数据_(中文(简体) )

运行采样器。 它返回被下取样的数据(它不修改 `data` 数组本身)。 下标者选择模式(如果存在),或中值.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-sample/#readme-modeMedian_value) _模式_。 。 。 .**价值**(单位:千美元)_访问器Func_(中文(简体) )

指定用于从所提供的数据数组获取值的存取器函数。 访问器函数每个数据引用一次,应该返回被下取样的值.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-sample/#readme-modeMedian_bucketSize) _模式_。 。 。 .**桶大小**(单位:千美元)_大小_(中文(简体) )

说明每桶的数据点数。 第一个和最后一个数据点总是他们自己的桶. 倒数第二桶是大小的 `(data.length - 2) % size`。 。 。 .

### 最大的三角一桶

最大的三角形是一个采样器,根据两个预先确定的分数,形成最大三角形的桶中分数有最大的有效面积,而桶中最重要的也是. 最大的三角算法是两道花 -- -- 一桶和三桶。 这些算法在论文中有详细描述 [用于视觉表现的倒采样时间序列](http://skemman.is/stream/get/1946/15343/37285/3/SS_MSthesis.pdf),其描述摘要转录如下:

> 这个算法非常简单. 首先,所有积分都通过计算其有效区域来排序。 无效有效区域的点除外。 数据点再被分成大约等量的桶与指定的下采样阈值. 最后,在被下采样的数据中,选择一个级别最高(最大有效区域)的点来代表每个桶.

> 一个点的有效区域是它与其相邻的两个点所形成的三角形的区域大小.

![](https://npmcn.com/package/%40d3fc/d3fc-sample/screenshots/largest-triangle-one-bucket.png)

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-sample/#readme-largestTriangleOneBucket) 页:1.**最大三角一键**(a) 与《公约》有关的其他事项

构造一个新的采样器.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-sample/#readme-largestTriangle_one)_最大三角形_(单位:千美元)_数据_(中文(简体) )

运行采样器,返回被下取样的数据(它不修改 `data` 数组本身)。 采样者在桶中选择其他两个点之间面积最大的点(由算法确定).

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-sample/#readme-largestTriangle_x_one) _最大三角形_。 。 。 .**页:1**(单位:千美元)_访问器Func_(中文(简体) )

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-sample/#readme-largestTriangle_y_one) _最大三角形_。 。 。 .**尔**(单位:千美元)_访问器Func_(中文(简体) )

指定用于从所提供的数据数组中获取x和y值的存取器函数。 访问器函数每个数据引用一次,应该返回被下取样的值.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-sample/#readme-largestTriangle_bucketSize_one) _最大三角形_。 。 。 .**桶大小**(单位:千美元)_大小_(中文(简体) )

说明每桶的数据点数。 第一个和最后一个数据点总是他们自己的桶. 倒数第二桶是大小的 `(data.length - 2) % size`。 。 。 .

### 大三角三块

> 算法类似于 [上文](https://npmcn.com/package/%40d3fc/d3fc-sample/#readme-largest-triangle-one-bucket),但每次用三桶,然后从左到右进行。 构成三角形左角的第一个点(有效区域)总是固定在以前选定的点上,现在应该选择中间桶上的一个点.

最后一桶中形成三角形的点是一个临时点,即该桶内所有其他点的平均值.

![](https://npmcn.com/package/%40d3fc/d3fc-sample/screenshots/largest-triangle-three-bucket.png)

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-sample/#readme-largestTriangleThreeBucket) 页:1.**最大三角三键**(a) 与《公约》有关的其他事项

构造一个新的采样器.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-sample/#readme-largestTriangle_three) _最大三角形_(单位:千美元)_数据_(中文(简体) )

运行采样器,返回被下取样的数据(它不修改 `data` 数组本身)。 采样者在桶中选择其他两个点之间面积最大的点(由算法确定).

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-sample/#readme-largestTriangle_x_three) _最大三角形_。 。 。 .**页:1**(单位:千美元)_访问器Func_(中文(简体) )

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-sample/#readme-largestTriangle_y_three) _最大三角形_。 。 。 .**尔**(单位:千美元)_访问器Func_(中文(简体) )

指定用于从所提供的数据数组中获取x和y值的存取器函数。 访问器函数每个数据引用一次,应该返回被下取样的值.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-sample/#readme-largestTriangle_bucketSize_three) _最大三角形_。 。 。 .**桶大小**(单位:千美元)_大小_(中文(简体) )

说明每桶的数据点数。 第一个和最后一个数据点总是他们自己的桶. 倒数第二桶是大小的 `(data.length - 2) % size`。 。 。 .

### 弹夹

d3fc-sample也带有一个数据桶工具,被算法所使用. 它将数据分割为大小均匀的块.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-sample/#readme-bucket) 页:1.**桶头**(a) 与《公约》有关的其他事项

构造一个数据桶工具实例 .

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-sample/#readme-bucket_) _桶头_(单位:千美元)_数据_(中文(简体) )

将数据分割成大小均匀的桶,形式如下:

```
// where n is the bucket size
[
    [data[0], data[1], ..., data[n - 1]],
    [data[n], data[n + 1], ..., data[2n - 1]],
    ...
    [..., data[data.length - 1]]
]
```

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-sample/#readme-bucket_bucketSize) _桶头_。 。 。 .**桶大小**(单位:千美元)_大小_(中文(简体) )

说明每桶的数据点数。 最后的一桶是大小的 `data.length % size`。 。 。 .

## 常见问题

### @d3fc/d3fc-sample 是什么？

一个使用最大的三角形或模式-中间方法选择具有代表性的数据点的数据分样器\.

### 如何安装 @d3fc/d3fc-sample？

在项目目录运行 npm install @d3fc/d3fc-sample，或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖：d3-array（\*）。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖，Yarn 需要手动安装。

### @d3fc/d3fc-sample 支持 TypeScript 吗？

该包的 package\.json 没有声明类型入口。需要类型提示时，可以在 npm 上查找社区维护的 @types/d3fc\_\_d3fc-sample 是否存在。

### @d3fc/d3fc-sample 支持 ESM 还是 CommonJS？

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

### @d3fc/d3fc-sample 可以商用吗？

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

### @d3fc/d3fc-sample 的下载量有多少？

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

### @d3fc/d3fc-sample 还在维护吗？

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

