# @d3fc/d3fc-series 中文文档

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

版本：6\.1\.3
npm 元数据更新时间：2024-07-30T09:41:23.465Z
中文译文更新时间：2026-11-11T08:03:56.473Z
软件包许可：MIT

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

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

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

- 包体积（解压后）：308 kB，63 个文件
- 模块格式：ESM + CJS
- TypeScript 类型：未声明
- 运行依赖：4 个
- peer 依赖：d3-array \*，d3-scale \*，d3-scale-chromatic \*，d3-selection \*，d3-shape \*
- 首次发布：2018-08-02T13:53:32.563Z
- 最新版本发布：2024-07-30T09:41:23.230Z
- 近 30 天下载量：73365（2026-10-11 至 2026-11-09，npm 官方下载统计）
- 已发布版本数：80（近 12 个月 0 个）

## 中文简介

收集用于将数据系列渲染到SVG和画布的组件,包括线条、条条、OHLC、烛台等

## 安装

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

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

## README

# d3fc系列

收集用于向SVG,画布和WebGL提供数据序列的组件,包括线条,条条,OHLC,烛台等.

<table><tbody><tr><td><a href="https://npmcn.com/package/%40d3fc/d3fc-series/#readme-boxplot" rel="nofollow noopener noreferrer"><img src="https://d3fc.io/examples/series-svg-boxplot/screenshot.png" loading="lazy" decoding="async" referrerpolicy="no-referrer"></a></td><td><a href="https://npmcn.com/package/%40d3fc/d3fc-series/#readme-candlestick" rel="nofollow noopener noreferrer"><img src="https://d3fc.io/examples/series-svg-candlestick/screenshot.png" loading="lazy" decoding="async" referrerpolicy="no-referrer"></a></td><td><a href="https://npmcn.com/package/%40d3fc/d3fc-series/#readme-line" rel="nofollow noopener noreferrer"><img src="https://d3fc.io/examples/series-svg-line/screenshot.png" loading="lazy" decoding="async" referrerpolicy="no-referrer"></a></td></tr><tr><td><a href="https://npmcn.com/package/%40d3fc/d3fc-series/#readme-ohlc" rel="nofollow noopener noreferrer"><img src="https://d3fc.io/examples/series-svg-ohlc/screenshot.png" loading="lazy" decoding="async" referrerpolicy="no-referrer"></a></td><td><a href="https://npmcn.com/package/%40d3fc/d3fc-series/#readme-area" rel="nofollow noopener noreferrer"><img src="https://d3fc.io/examples/series-svg-area/screenshot.png" loading="lazy" decoding="async" referrerpolicy="no-referrer"></a></td><td><a href="https://npmcn.com/package/%40d3fc/d3fc-series/#readme-point" rel="nofollow noopener noreferrer"><img src="https://d3fc.io/examples/series-svg-point/screenshot.png" loading="lazy" decoding="async" referrerpolicy="no-referrer"></a></td></tr><tr><td><a href="https://npmcn.com/package/%40d3fc/d3fc-series/#readme-bar" rel="nofollow noopener noreferrer"><img src="https://d3fc.io/examples/series-svg-bar/screenshot.png" loading="lazy" decoding="async" referrerpolicy="no-referrer"></a></td><td><a href="https://npmcn.com/package/%40d3fc/d3fc-series/#readme-errorbar" rel="nofollow noopener noreferrer"><img src="https://d3fc.io/examples/series-svg-errorbar/screenshot.png" loading="lazy" decoding="async" referrerpolicy="no-referrer"></a></td><td><a href="https://npmcn.com/package/%40d3fc/d3fc-series/#readme-multi" rel="nofollow noopener noreferrer"><img src="https://d3fc.io/examples/series-svg-multi/screenshot.png" loading="lazy" decoding="async" referrerpolicy="no-referrer"></a></td></tr><tr><td><a href="https://npmcn.com/package/%40d3fc/d3fc-series/#readme-grouped" rel="nofollow noopener noreferrer"><img src="https://d3fc.io/examples/series-svg-grouped/screenshot.png" loading="lazy" decoding="async" referrerpolicy="no-referrer"></a></td><td><a href="https://npmcn.com/package/%40d3fc/d3fc-series/#readme-stacked" rel="nofollow noopener noreferrer"><img src="https://d3fc.io/examples/series-svg-stacked/screenshot.png" loading="lazy" decoding="async" referrerpolicy="no-referrer"></a></td><td><a href="https://npmcn.com/package/%40d3fc/d3fc-series/#readme-repeat" rel="nofollow noopener noreferrer"><img src="https://d3fc.io/examples/series-svg-repeat/screenshot.png" loading="lazy" decoding="async" referrerpolicy="no-referrer"></a></td></tr><tr><td><a href="https://npmcn.com/package/%40d3fc/d3fc-series/#readme-heatmap" rel="nofollow noopener noreferrer"><img src="https://d3fc.io/examples/series-svg-heatmap/screenshot.png" loading="lazy" decoding="async" referrerpolicy="no-referrer"></a></td><td></td><td></td></tr></tbody></table>

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

## 安装

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

## API 参考

-   [API 概况](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-general-api)
-   [SVG 渲染](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-svg-rendering)
-   [彩绘](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-canvas-rendering)
-   [WebGL 渲染](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-webgl-rendering)
-   [装饰图案](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-decorate-pattern)
-   [方向](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-orientation)
-   [多系列](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-multi-series)
-   [自动带宽](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-auto-bandwidth)
-   [访问者](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-accessors)
-   [线条](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-line)
-   [点](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-point)
-   [区域](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-area)
-   [栏](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-bar)
-   [烛台](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-candlestick)
-   [美国](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-ohlc)
-   [框图](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-boxplot)
-   [错误栏](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-errorbar)
-   [热图](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-heatmap)
-   [多个](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-multi)
-   [重复](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-repeat)
-   [分组](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-grouped)
-   [堆叠](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-stacked)

这个包包含了一些D3组件,这些组件使各种标准系列类型产生. 它们都共享一个共同的API,典型的配置需要x和y等分尺度,以及一些取值器. 每个系列类型都有SVG,Canvas和WebGL等版本,共享相同的配置属性.

### API 概况

#### SVG 渲染

为了向SVG提供一行系列数据,数据应通过数据连接或 `datum`,内容如下:

```javascript
const data = [
    {x: 0, y: 0},
    {x: 10, y: 5},
    {x: 20, y: 0}
];

const line = fc.seriesSvgLine()
    .crossValue(d => d.x)
    .mainValue(d => d.y)
    .xScale(xScale)
    .yScale(yScale);

d3.select('g')
    .datum(data)
    .call(line);
```

该行组件配置了所需的取值器和天平. 在这种情况下,所提供的数据是: `x` 财务报告和审定财务报表 `y` 属性。 值存取器在数组内的每个数据上被引用,并简单地获得各自财产的值. 天平用于将域坐标系统中的值(由访问者返回)转换到屏幕坐标系统中.

系列被制成一组(`g`)元素,首先选择,使用 `datum` ,然后使用 `call` 以引用序列组件,使其产生.

#### 帆布渲染

这个 `seriesCanvasLine` 组件的 API 几乎与 SVG 对应的相同, `seriesSvgLine`,唯一的区别是添加一个 `context` 属性,它被设定为该系列制作的画布的上下文.

```javascript
const data = [
    {x: 0, y: 0},
    {x: 10, y: 5},
    {x: 20, y: 0}
];

var ctx = canvas.getContext('2d');

const line = fc.seriesCanvasLine()
    .crossValue(d => d.x)
    .mainValue(d => d.y)
    .xScale(xScale)
    .yScale(yScale)
    .context(ctx);

line(data);
```

由于D3数据joins和数据绑定只在HTML / SVG上的工作,因此被提供的数据直接引用了画布组件. 这导致组件在画布上自已.

#### WebGL 渲染

_如果这是你第一次使用WebGL,这个更高等系列组件的集合是最好的起步地. 只调查其中的低等组件 [d3fc-webgl (英语)](https://github.com/d3fc/d3fc/tree/master/packages/d3fc-webgl#d3fc-webgl) 如果您需要启动功能._

_**WebGL渲染尚未与其他渲染方法完全对等. 请检查 API 文档与当前支持的查看方法 .**_

这个 `seriesWebglLine` 组件的API几乎与其画布对应部分相同, `seriesCanvasLine`。唯一的区别是 `context` 属性,需要 `contextType` 联 合 国 `'webgl'`。 。 。 .

```javascript
const data = [
    {x: 0, y: 0},
    {x: 10, y: 5},
    {x: 20, y: 0}
];

var ctx = canvas.getContext('webgl');

const line = fc.seriesWebglLine()
    .crossValue(d => d.x)
    .mainValue(d => d.y)
    .xScale(xScale)
    .yScale(yScale)
    .context(ctx);

line(data);
```

与帆布一样,这些组件与所提供的数据直接被引用。 然而,与从SVG到画布的过渡一样,WebGL也有自己微妙的区别.

WebGL是基于一个将数据处理成GPU适当格式的管道,将这些数据加入GPU,然后允许GPU以高度平行的方式处理数据. 在使用这些组件时,这个管道中的瓶颈最常是数据预处理和将数据加载到GPU,两者都由JavaScript执行或控制.

部分这种性能优化是通过组件的设计来解决的(例如,我们如何预先处理数据以及以何种形式处理数据),有些则需要消费者对组件进行最优化的利用(例如当我们需要预先处理/加载数据时). 在任何情况下,消费者都应力求减少数据的预处理和装载量,以取得最佳业绩.

这些组件提供了两种针对WebGL的方法,以便对这些过程进行更精细的控制-

-   `equals` - 这种属性是一种平等功能,用以控制是否需要对数据作任何预处理,即数据与先前调用的数据相同。 如果数据被认为是等同的,那么将不引用值存取器,并重新使用之前被加载到GPU的数据. 唯一的例外是,如果其中一个天平有JavaScript预处理要求,参见下个项目.
-   `scaleMapper` - 这个属性是一个映射函数,它控制天平是需要JavaScript预处理还是纯GPU执行. 如果一个尺度有纯GPU的实现,那么之前被装入GPU的数据将会被重新使用,不需要JavaScript处理. 如果不是,将会为每个数据点引用缩放值的取用器以及缩放函数本身,然后在渲染前将由此产生的数据转移到GPU.

如果数据集是静态的,上述属性将足以实现最佳性能. 如果数据集是动态的,则将数据集分拆成单独的动态/静态数据集,并将每个数据集作为单独的序列来渲染(遵循上述建议),将实现最佳性能. 如果无法做到这一点,则降为低级 [d3fc-webgl (英语)](https://github.com/d3fc/d3fc/tree/master/packages/d3fc-webgl#d3fc-webgl) 实现最佳业绩可能需要组件。 然而,这需要一种深思熟虑的方法,并且只有在上述建议不能被采纳的情况下,才能尝试.

#### 装饰图案

该系列组件通过曝光a `decorate` 属性,该属性将数据加入选择、画布上下文或程序构建器,用于渲染组件。 这使得组件的用户能够执行额外的渲染逻辑.

详情请查阅 [装饰图案文档](https://d3fc.io/introduction/decorate-pattern.html)。 。 。 .

以下的例子说明每个栏的填充颜色可以通过装饰来改变. 装饰属性被传递到用于构建组件 DOM 的数据相接选择. 这里,输入选择用于根据索引设置填充颜色:

```javascript
const color = d3.scaleOrdinal(d3.schemeCategory10);

const svgBar = fc.seriesSvgBar()
    .decorate((selection) => {
        selection.enter()
            .style('fill', (_, i) => color(i));
    });
```

![](https://d3fc.io/examples/series-svg-decorate/screenshot.png)

下面是帆布条系列的同名例子;装饰图案的工作方式则有细微的不同. 对于 SVG 组件,装饰功能随使所有条条(或指点,烛台,.)的选择而被一并引用,并带有帆布,对于系列中的每一个数据点都引用了装饰功能.

装饰功能被通过上下文,基准和索引. 上下文被翻译为正确的位置和在引用装饰功能之前所设置的填充颜色. 装饰后,栏本身被制成.

```javascript
const canvasLine = fc.seriesCanvasBar()
    .decorate((context, datum, index) => {
        context.fillStyle = color(index);
    });
```

![](https://d3fc.io/examples/series-canvas-decorate/screenshot.png)

这里还有WebGL系列的同名例子;同样,图案也微乎其微地不同. 在WebGL中,填充颜色需要使用属性被传递到GPU,然后被阴影被应用到渲染的栏上. 这都包了起来 `webglFillColor` 组件.

```javascript
const webglBar = fc.seriesWebglBar()
    .decorate((program, data) => {
        fc.webglFillColor()
            .value((_, i) => {
                const rgba = d3.color(color(i));
                return [rgba.r / 255, rgba.g / 255, rgba.b / 255, rgba.opacity];
            })
            .data(data)(program);
    });

webglBar(data);
```

装饰还可以用来为系列添加额外的元素. 在此示例中,通过输入选择,在每个栏中添加一个文本元素.

每个数据点容器的来源,即: `g` 元素,总是设置到数据点位置。 因此,文字元素被垂直地翻译为: `-10`把它们放在每个酒吧的正上方.

```javascript
const svgBar = fc.seriesSvgBar()
    .decorate((selection) => {
        selection.enter()
            .append('text')
            .style('text-anchor', 'middle')
            .attr('transform', 'translate(0, -10)')
            .attr('fill', 'black')
            .text((d) => d3.format('.2f')(d));
    });
```

![](https://d3fc.io/examples/series-svg-decorate-append/screenshot.png)

通过帆布,也可以对帆布进行额外的渲染以达到同样的效果. 在引用装饰函数之前,画布来源再次被翻译为每个数据点的出处.

这个例子使用点数系列, 有点多样性!

```javascript
const canvasLine = fc.seriesCanvasPoint()
    .decorate((context, datum, index) => {
        context.textAlign = 'center';
        context.fillStyle = '#000';
        context.font = '15px Arial';
        context.fillText(d3.format('.2f')(datum), 0, -10);
        // reset the fill style for the bar rendering
        context.fillStyle = '#999';
    });
```

![](https://d3fc.io/examples/series-canvas-decorate-append/screenshot.png)

虽然有可能对WebGL做类似的事情,但这将是一个涉及大量自定义遮阳器的更复杂的过程。 在大多数情况下,将大部分数据作为WebGL基数序列,然后使用被装饰的SVG/canvas序列来覆盖一个数据子集会比较容易.

#### 方向

大多数系列渲染器都支持横向和纵向渲染方向,如: `orient` 属性。 为了便于改变系列的取向,并避免冗余和重复的地产取名,将x和y平面转换而实现了取向的改变.

以下示例显示了在其默认垂直方向中渲染的简单条序列:

```javascript
const data = [4, 6, 8, 6, 0, 10];

const xScale = d3.scaleLinear()
    .domain([0, data.length])
    .range([0, width]);

const yScale = d3.scaleLinear()
    .domain([0, 10])
    .range([height, 0]);

const barSeries = fc.seriesSvgBar()
    .xScale(xScale)
    .yScale(yScale)
    .crossValue((_, i) => i)
    .mainValue((d) => d);

d3.select('g')
    .datum(data)
    .call(svgBar);
```

通过设置 `orient` 属性改为 `horizontal`, x 和 y 缩放被移植。 因此,x和y比例的域必须切换. 以下是需要作出的修改:

```javascript
const xScale = d3.scaleLinear()
    .domain([0, 10])           // domain changed
    .range([0, width]);

const yScale = d3.scaleLinear()
    .domain([0, data.length])  // domain changed
    .range([height, 0]);

const barSeries = fc.seriesSvgBar()
    .xScale(xScale)
    .yScale(yScale)
    .orient('horizontal')      // orient property updated
    .crossValue((_, i) => i)
    .mainValue((d) => d);
```

这是给进入者命名动机的一部分 `mainValue` 财务报告和审定财务报表 `crossValue`,而不是方向特定 `xValue` 编号 : `yValue`。 。 。 .

#### 多系列

一个值得注意的系列类型是多系列. 这个组件提供了一种方便的方法,将多个系列,即共享的天平,制成同一种SVG或画布.

多系列渲染器暴露出 `series` 接受一系列系列渲染器的属性以及标准 `xScale` 财务报告和审定财务报表 `yScale` 属性。 以下例子显示了多系列如何既能渲染出一行又能渲染出一行行系列:

```javascript
// a couple of series - value accessor configuration omitted for clarity
const barSeries = fc.seriesSvgBar();
const lineSeries = fc.seriesSvgLine();

const multiSeries = fc.seriesSvgMulti()
    .xScale(xScale)
    .yScale(yScale)
    .series([barSeries, lineSeries]);

d3.select('g')
    .datum(data)
    .call(svgMulti);
```

通知您不必设置 `xScale` 财务报告和审定财务报表 `yScale` 每个系列的属性 - 从多系列中向下传播天平.

帆布 API 非常相似:

```javascript
// a couple of series - value accessor configuration omitted for clarity
const barSeries = fc.seriesCanvasBar();
const lineSeries = fc.seriesCanvasLine();

const multiSeries = fc.seriesCanvasMulti()
    .xScale(xScale)
    .yScale(yScale)
    .context(ctx)
    .series([barSeries, lineSeries]);

multiSeries(data)
```

在这种情况下,这种背景也从多系列宣传到儿童.

多系列允许您结合一系列不同的系列类型. 如果您有多个数据序列想要使用相同的序列类型来渲染,例如包含多行的图表,则 [重复序列](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-repeat) 这是实现这一点的更简单的方法.

#### 自动带宽

一些系列(bar,OHLC,boxplot)有一个"width"的概念. 他们都暴露了一个 `bandwidth` 属性,您可以在其中提供宽度作为值(在屏幕坐标系统中).

与其直接指定带宽,不如与 `fc.autoBandwidth` 组件,它要么直接从缩放中获取带宽,要么根据数据的分布进行计算.

当使用时 `bandScale`,比例尺负责计算每个波段的宽度。 这个 `fc.autoBandwidth` 组件引用 `bandwidth` 并使用返回的值设置 `bandwidth` 连载.

```javascript
var xScale = d3.scaleBand()
    .domain(data.map(d => d.x))
    .rangeRound([0, width]);

var svgBar = fc.autoBandwidth(fc.seriesSvgBar())
    .align('left')
    .crossValue(function(d) { return d.x; })
    .mainValue(function(d) { return d.y; });
```

在上述例子中通知: `align` 设置为 `left`,它反映了波段比例坐标系统.

**注:** D3分级是特例带宽分级,带宽为零. 因此,如果你使用 `fc.autoBandwidth` 组件与点尺度结合,系列还将带宽为0!

当与线性尺度结合使用时 `fc.autoBandwidth` 组件根据相继数据点之间的最小相距计算栏宽:

```javascript
var xScale = d3.scaleLinear()
    .domain([0, 10])
    .range([0, width]);

var svgBar = fc.autoBandwidth(fc.seriesSvgBar())
    .crossValue(function(d) { return d.x; })
    .mainValue(function(d) { return d.y; })
    .widthFraction(0.5);
```

这个 `fc.autoBandwidth` 组件,在调整序列时,添加 `widthFraction` 属性决定用于设置带宽的这个距离的分数.

当使用多或重复序列时 `fc.autoBandwidth` 组件应用于直接调整栏(或OHLC, boxplot,.)系列,而不是调整多或重复系列.

```javascript
var canvasBar = fc.seriesCanvasBar()

var canvasLine = fc.seriesCanvasLine();

var canvasMulti = fc.seriesCanvasMulti()
    .xScale(xScale)
    .yScale(yScale)
    .series([fc.autoBandwidth(canvasBar), canvasLine]);
```

#### 访问者

所有系列的曝光 `xValues`编号 :`yValues` 方法,用于返回序列在检索值时使用的所有存取器的数组 `xScale`编号 :`yScale` 页:1.

### 线条

![](https://d3fc.io/examples/series-svg-line/screenshot.png)

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesSvgLine) 页:1.**序列SvgLine**(a) 与《公约》有关的其他事项 [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesCanvasLine) 页:1.**系列 CanvasLine**(a) 与《公约》有关的其他事项 [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesWebglLine) 页:1.**串行WebglLine**(a) 与《公约》有关的其他事项

构造用于画布、 WebGL 或 SVG 的新行渲染器.

#### 共同属性

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesLine_crossValue) _序列线_。 。 。 .**横跨数值**(单位:千美元)_访问器Func_(中文(简体) ) [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesLine_mainValue) _序列线_。 。 。 .**主数值**(单位:千美元)_访问器Func_(中文(简体) )

若为 _访问器Func_ ,设置指定函数的存取器并返回此序列。 若为 _访问器Func_ 未指定,返回当前访问器。 这个 `accessorFunc(datum, index)` 函数会调用每个数据项,返回给定访问器的相关值。 相应的尺度适用于访问者在渲染前返回的值.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesLine_xScale) _序列线_。 。 。 .**十. 规模**(单位:千美元)_缩放_(中文(简体) ) [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesLine_yScale) _序列线_。 。 。 .**比例**(单位:千美元)_缩放_(中文(简体) )

若为 _缩放_ ,设置比例并返回此序列。 若为 _缩放_ 未指定,返回当前比额表.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesLine_orient) _序列线_。 。 。 .**东方**(单位:千美元)_方向_(中文(简体) )

若为 _方向_ ,设置方向并返回此序列。 若为 _方向_ 未指定,返回当前方向。 方向值应该是 `horizontal` (违约)或 `vertical`。 。 。 .

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesLine_curve) _序列线_。 。 。 .**曲线**(单位:千美元)_缩放_(中文(简体) )

WebGL 执行不支持此属性 .

若为 _曲线_ ,设置曲线厂并返回此序列。 若为 _曲线_ 未指定,返回当前曲线厂.

这个地产反弹了 [线条。曲线](https://github.com/d3/d3-shape#line_curve)。 。 。 .

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesLine_context) _序列线_。 。 。 .**上下文**(单位:千美元)_页:1_(中文(简体) )

SVG的执行不支持这种财产.

若为 _页:1_ ,设置画布上下文并返回此序列。 若为 _页:1_ 未指定,返回当前上下文.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesLine_lineWidth) _序列线_。 。 。 .**行风**(单位:千美元)_宽度_(中文(简体) )

SVG和画布执行不支持此属性.

若为 _宽度_ ,设置行宽并返回此序列。 若为 _宽度_ 未指定,返回当前行宽.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesLine_equals) _序列线_。 。 。 .**等于**(单位:千美元)_等于_(中文(简体) )

SVG和画布执行不支持此属性.

若为 _等于_ ,设置用于比较的等函数 _上一个数据_ 与 _数据_。此检查的结果用于控制数据是否重新预测和调整。 若为 _等于_ 未指定,则返回当前默认返回的表示数据已更改的虚假等函数.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesLine_pixelRatio) _序列线_。 。 。 .**像素拉蒂奥**(单位:千美元)_像素拉蒂奥_(中文(简体) )

SVG和画布执行不支持此属性.

若为 _像素拉蒂奥_ ,设置用于缩放任何像素值的系数。 若为 _像素拉蒂奥_ 未指定返回当前值.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesLine_scaleMapper) _序列线_。 。 。 .**缩放马普**(单位:千美元)_缩放马普_(中文(简体) )

SVG和画布执行不支持此属性.

若为 _缩放马普_ 指定,设置用于首先映射xScale的函数,然后将yScale映射到JavaScript和WebGL执行的匹配对子上。 若为 _等于_ 未指定,返回默认为 [网络gl 比例马普](https://github.com/d3fc/d3fc/tree/master/packages/d3fc-webgl#webglScaleMapper)。 。 。 .

返回的 JavaScript 比例尺是使用一个参考比较来检查平等的,以确定数据是否需要再调整比例. 如果引用与上一个渲染相同,则与比例尺相关的数值不会被重新调整.

### 点

![](https://d3fc.io/examples/series-svg-point/screenshot.png)

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesSvgPoint) 页:1.**序列 Svg 点**(a) 与《公约》有关的其他事项 [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesCanvasPoint) 页:1.**序列 Canvas 点**(a) 与《公约》有关的其他事项 [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesWebglPoint) 页:1.**网络点**(a) 与《公约》有关的其他事项

为画布, WebGL 或 SVG 构造一个新的点序列渲染器.

#### 共同属性

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesPoint_crossValue) _序列点_。 。 。 .**横跨数值**(单位:千美元)_访问器Func_(中文(简体) ) [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesPoint_mainValue) _序列点_。 。 。 .**主数值**(单位:千美元)_访问器Func_(中文(简体) )

若为 _访问器Func_ ,设置指定函数的存取器并返回此序列。 若为 _访问器Func_ 未指定,返回当前访问器。 这个 `accessorFunc(datum, index)` 函数会调用每个数据项,返回给定访问器的相关值。 相应的尺度适用于访问者在渲染前返回的值.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesPoint_xScale) _序列点_。 。 。 .**十. 规模**(单位:千美元)_缩放_(中文(简体) ) [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesPoint_yScale) _序列点_。 。 。 .**比例**(单位:千美元)_缩放_(中文(简体) )

若为 _缩放_ ,设置比例并返回此序列。 若为 _缩放_ 未指定,返回当前比额表.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesPoint_orient) _序列点_。 。 。 .**东方**(单位:千美元)_方向_(中文(简体) )

若为 _方向_ ,设置方向并返回此序列。 若为 _方向_ 未指定,返回当前方向。 方向值应该是 `horizontal` (违约)或 `vertical`。 。 。 .

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesPoint_type) _序列点_。 。 。 .**类型**(单位:千美元)_类型_(中文(简体) )

WebGL 执行不支持以下形状: 菱形,星相,花相.

若为 _类型_ ,将符号类型设置为指定的函数或符号类型,并返回此点序列的渲染器。 若为 _类型_ 未指定,返回当前符号类型访问器.

这个地产反弹了 [符号.类型](https://github.com/d3/d3-shape#symbol_type)。 。 。 .

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

若为 _大小_ ,将区域设置为指定的函数或数字,并返回此点序列渲染器。 若为 _大小_ 未指定,返回当前大小访问器.

这个地产反弹了 [符号.大小](https://github.com/d3/d3-shape#symbol_size)。 。 。 .

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesPoint_context) _序列点_。 。 。 .**上下文**(单位:千美元)_页:1_(中文(简体) )

SVG的执行不支持这种财产.

若为 _页:1_ ,设置画布上下文并返回此序列。 若为 _页:1_ 未指定,返回当前上下文.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesPoint_equals) _序列点_。 。 。 .**等于**(单位:千美元)_等于_(中文(简体) )

SVG和画布执行不支持此属性.

若为 _等于_ ,设置用于比较的等函数 _上一个数据_ 与 _数据_。此检查的结果用于控制数据是否重新预测和调整。 若为 _等于_ 未指定,则返回当前默认返回的表示数据已更改的虚假等函数.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesPoint_pixelRatio) _序列_。 。 。 .**像素拉蒂奥**(单位:千美元)_像素拉蒂奥_(中文(简体) )

SVG和画布执行不支持此属性.

若为 _像素拉蒂奥_ ,设置用于缩放任何像素值的系数。 若为 _像素拉蒂奥_ 未指定返回当前值.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesPoint_scaleMapper) _序列点_。 。 。 .**缩放马普**(单位:千美元)_缩放马普_(中文(简体) )

SVG和画布执行不支持此属性.

若为 _缩放马普_ 指定,设置用于首先映射xScale的函数,然后将yScale映射到JavaScript和WebGL执行的匹配对子上。 若为 _等于_ 未指定,返回默认为 [网络gl 比例马普](https://github.com/d3fc/d3fc/tree/master/packages/d3fc-webgl#webglScaleMapper)。 。 。 .

返回的 JavaScript 比例尺是使用一个参考比较来检查平等的,以确定数据是否需要再调整比例. 如果引用与上一个渲染相同,则与比例尺相关的数值不会被重新调整.

### 区域

![](https://d3fc.io/examples/series-svg-area/screenshot.png)

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesSvgArea) 页:1.**系列 Svgrea**(a) 与《公约》有关的其他事项 [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesCanvasArea) 页:1.**系列 Canvasrea**(a) 与《公约》有关的其他事项 [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesWebglArea) 页:1.**系列 Webglrea**(a) 与《公约》有关的其他事项

为画布、WebGL或SVG构建一个新的区域系列渲染器.

#### 共同属性

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesArea_crossValue) _序列区域_。 。 。 .**横跨数值**(单位:千美元)_访问器Func_(中文(简体) ) [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesArea_mainValue) _序列区域_。 。 。 .**主数值**(单位:千美元)_访问器Func_(中文(简体) ) [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesArea_baseValue) _序列区域_。 。 。 .**基准值**(单位:千美元)_访问器Func_(中文(简体) )

若为 _访问器Func_ ,设置指定函数的存取器并返回此序列。 若为 _访问器Func_ 未指定,返回当前访问器。 这个 `accessorFunc(datum, index)` 函数会调用每个数据项,返回给定访问器的相关值。 相应的尺度适用于访问者在渲染前返回的值.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesArea_orient) _序列区域_。 。 。 .**东方**(单位:千美元)_方向_(中文(简体) )

WebGL 执行不支持此属性 .

若为 _方向_ ,设置方向并返回此序列。 若为 _方向_ 未指定,返回当前方向。 方向值应该是 `horizontal` (违约)或 `vertical`。 。 。 .

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesArea_xScale) _序列区域_。 。 。 .**十. 规模**(单位:千美元)_缩放_(中文(简体) ) [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesArea_yScale) _序列区域_。 。 。 .**比例**(单位:千美元)_缩放_(中文(简体) )

若为 _缩放_ ,设置比例并返回此序列。 若为 _缩放_ 未指定,返回当前比额表.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesArea_curve) _序列区域_。 。 。 .**曲线**(单位:千美元)_缩放_(中文(简体) )

WebGL 执行不支持此属性 .

若为 _曲线_ ,设置曲线厂并返回此序列。 若为 _曲线_ 未指定,返回当前曲线厂.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesArea_context) _序列区域_。 。 。 .**上下文**(单位:千美元)_页:1_(中文(简体) )

SVG的执行不支持这种财产.

若为 _页:1_ ,设置画布上下文并返回此序列。 若为 _页:1_ 未指定,返回当前上下文.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesArea_equals) _序列区域_。 。 。 .**等于**(单位:千美元)_等于_(中文(简体) )

SVG和画布执行不支持此属性.

若为 _等于_ ,设置用于比较的等函数 _上一个数据_ 与 _数据_。此检查的结果用于控制数据是否重新预测和调整。 若为 _等于_ 未指定,则返回当前默认返回的表示数据已更改的虚假等函数.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesArea_pixelRatio) _序列区域_。 。 。 .**像素拉蒂奥**(单位:千美元)_像素拉蒂奥_(中文(简体) )

SVG和画布执行不支持此属性.

若为 _像素拉蒂奥_ ,设置用于缩放任何像素值的系数。 若为 _像素拉蒂奥_ 未指定返回当前值.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesArea_scaleMapper) _序列区域_。 。 。 .**缩放马普**(单位:千美元)_缩放马普_(中文(简体) )

SVG和画布执行不支持此属性.

若为 _缩放马普_ 指定,设置用于首先映射xScale的函数,然后将yScale映射到JavaScript和WebGL执行的匹配对子上。 若为 _等于_ 未指定,返回默认为 [网络gl 比例马普](https://github.com/d3fc/d3fc/tree/master/packages/d3fc-webgl#webglScaleMapper)。 。 。 .

返回的 JavaScript 比例尺是使用一个参考比较来检查平等的,以确定数据是否需要再调整比例. 如果引用与上一个渲染相同,则与比例尺相关的数值不会被重新调整.

### 栏

![](https://d3fc.io/examples/series-svg-bar/screenshot.png)

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesSvgBar) 页:1.**序列Svg 栏**(a) 与《公约》有关的其他事项 [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesCanvasBar) 页:1.**系列 Canvas 边框**(a) 与《公约》有关的其他事项 [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesWebglBar) 页:1.**串行WebglBar**(a) 与《公约》有关的其他事项

为画布、 WebGL 或 SVG 构造一个新的条形系列渲染器.

#### 共同属性

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesBar_crossValue) _系列栏_。 。 。 .**横跨数值**(单位:千美元)_访问器Func_(中文(简体) ) [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesBar_mainValue) _系列栏_。 。 。 .**主数值**(单位:千美元)_访问器Func_(中文(简体) ) [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesBar_baseValue) _系列栏_。 。 。 .**基准值**(单位:千美元)_访问器Func_(中文(简体) )

若为 _访问器Func_ ,设置指定函数的存取器并返回此序列。 若为 _访问器Func_ 未指定,返回当前访问器。 这个 `accessorFunc(datum, index)` 函数会调用每个数据项,返回给定访问器的相关值。 相应的尺度适用于访问者在渲染前返回的值.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesBar_orient) _系列栏_。 。 。 .**东方**(单位:千美元)_方向_(中文(简体) )

WebGL 执行不支持此属性 .

若为 _方向_ ,设置方向并返回此序列。 若为 _方向_ 未指定,返回当前方向。 方向值应该是 `horizontal` (违约)或 `vertical`。 。 。 .

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesBar_align) _系列栏_。 。 。 .**对齐**(单位:千美元)_对齐_(中文(简体) )

WebGL 执行不支持此属性 .

若为 _对齐_ ,设置对齐并返回此序列。 若为 _对齐_ 未指定,返回当前对齐。 校正值应为 `left`, (中文(简体) ), `right` 或者说 `center` (默认)并描述每个栏对齐中心值的方式.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesBar_xScale) _系列栏_。 。 。 .**十. 规模**(单位:千美元)_缩放_(中文(简体) ) [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesBar_yScale) _系列栏_。 。 。 .**比例**(单位:千美元)_缩放_(中文(简体) )

若为 _缩放_ ,设置比例并返回此序列。 若为 _缩放_ 未指定,返回当前比额表.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesBar_bandwidth) _系列栏_。 。 。 .**带宽**(单位:千美元)_带宽Func_(中文(简体) )

若为 _带宽Func_ ,设置带宽函数并返回此序列。 若为 _带宽Func_ 未指定,返回当前带宽函数.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesBar_context) _系列栏_。 。 。 .**上下文**(单位:千美元)_页:1_(中文(简体) )

SVG的执行不支持这种财产.

若为 _页:1_ ,设置画布上下文并返回此序列。 若为 _页:1_ 未指定,返回当前上下文.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesBar_equals) _系列栏_。 。 。 .**等于**(单位:千美元)_等于_(中文(简体) )

SVG和画布执行不支持此属性.

若为 _等于_ ,设置用于比较的等函数 _上一个数据_ 与 _数据_。此检查的结果用于控制数据是否重新预测和调整。 若为 _等于_ 未指定,则返回当前默认返回的表示数据已更改的虚假等函数.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesBar_pixelRatio) _系列栏_ 。 。 。 .**像素拉蒂奥**(单位:千美元)_像素拉蒂奥_(中文(简体) )

SVG和画布执行不支持此属性.

若为 _像素拉蒂奥_ ,设置用于缩放任何像素值的系数。 若为 _像素拉蒂奥_ 未指定返回当前值.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesBar_scaleMapper) _系列栏_。 。 。 .**缩放马普**(单位:千美元)_缩放马普_(中文(简体) )

SVG和画布执行不支持此属性.

若为 _缩放马普_ 指定,设置用于首先映射xScale的函数,然后将yScale映射到JavaScript和WebGL执行的匹配对子上。 若为 _等于_ 未指定,返回默认为 [网络gl 比例马普](https://github.com/d3fc/d3fc/tree/master/packages/d3fc-webgl#webglScaleMapper)。 。 。 .

返回的 JavaScript 比例尺是使用一个参考比较来检查平等的,以确定数据是否需要再调整比例. 如果引用与上一个渲染相同,则与比例尺相关的数值不会被重新调整.

### 烛台

![](https://d3fc.io/examples/series-svg-candlestick/screenshot.png)

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesSvgCandlestick) 页:1.**系列 Svg 烛台**(a) 与《公约》有关的其他事项 [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesCanvasCandlestick) 页:1.**系列 Canvas 烛台**(a) 与《公约》有关的其他事项 [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesWebglCandlestick) 页:1.**系列 Webgl 烛台**(a) 与《公约》有关的其他事项

为帆布、 WebGL 或 SVG 构造一个新的烛台渲染器.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesCandlestick_crossValue) _系列烛台_。 。 。 .**横跨数值**(单位:千美元)_访问器Func_(中文(简体) ) [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesCandlestick_highValue) _系列烛台_。 。 。 .**高数值**(单位:千美元)_访问器Func_(中文(简体) ) [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesCandlestick_lowValue) _系列烛台_。 。 。 .**低数值**(单位:千美元)_访问器Func_(中文(简体) ) [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesCandlestick_openValue) _系列烛台_。 。 。 .**打开值**(单位:千美元)_访问器Func_(中文(简体) ) [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesCandlestick_closeValue) _系列烛台_。 。 。 .**关闭值**(单位:千美元)_访问器Func_(中文(简体) )

若为 _访问器Func_ ,设置指定函数的存取器并返回此序列。 若为 _访问器Func_ 未指定,返回当前访问器。 这个 `accessorFunc(datum, index)` 函数会调用每个数据项,返回给定访问器的相关值。 相应的尺度适用于访问者在渲染前返回的值.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesCandlestick_xScale) _系列烛台_。 。 。 .**十. 规模**(单位:千美元)_缩放_(中文(简体) ) [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesCandlestick_yScale) _系列烛台_。 。 。 .**比例**(单位:千美元)_缩放_(中文(简体) )

若为 _缩放_ ,设置比例并返回此序列。 若为 _缩放_ 未指定,返回当前比额表.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesCandlestick_bandwidth) _系列烛台_。 。 。 .**带宽**(单位:千美元)_带宽Func_(中文(简体) )

若为 _带宽Func_ ,设置带宽函数并返回此序列。 若为 _带宽Func_ 未指定,返回当前带宽函数.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesCandlestick_align) _系列烛台_。 。 。 .**对齐**(单位:千美元)_对齐_(中文(简体) )

WebGL 执行不支持此属性 .

若为 _对齐_ ,设置对齐并返回此序列。 若为 _对齐_ 未指定,返回当前对齐。 校正值应为 `left`, (中文(简体) ), `right` 或者说 `center` (默认)并描述每个烛台对齐中心值的方式.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesCandlestick_decorate) _系列烛台_。 。 。 .**装饰**(单位:千美元)_装饰Func_(中文(简体) )

若为 _装饰Func_ ,将装饰器函数设置为指定的函数,并返回此序列。 若为 _装饰Func_ 未指定,返回当前装饰器函数.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesCandlestick_context) _系列烛台_。 。 。 .**上下文**(单位:千美元)_页:1_(中文(简体) )

SVG的执行不支持这种财产.

若为 _页:1_ ,设置画布上下文并返回此序列。 若为 _页:1_ 未指定,返回当前上下文.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesCandlestick_lineWidth) _系列烛台_。 。 。 .**行风**(单位:千美元)_宽度_(中文(简体) )

SVG和画布执行不支持此属性.

若为 _宽度_ ,设置行宽并返回此序列。 若为 _宽度_ 未指定,返回当前行宽.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesCandlestick_equals) _系列烛台_。 。 。 .**等于**(单位:千美元)_等于_(中文(简体) )

SVG和画布执行不支持此属性.

若为 _等于_ ,设置用于比较的等函数 _上一个数据_ 与 _数据_。此检查的结果用于控制数据是否重新预测和调整。 若为 _等于_ 未指定,则返回当前默认返回的表示数据已更改的虚假等函数.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesCandlestick_pixelRatio) _系列_。 。 。 .**像素拉蒂奥**(单位:千美元)_像素拉蒂奥_(中文(简体) )

SVG和画布执行不支持此属性.

若为 _像素拉蒂奥_ ,设置用于缩放任何像素值的系数。 若为 _像素拉蒂奥_ 未指定返回当前值.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesCandlestick_scaleMapper) _系列烛台_。 。 。 .**缩放马普**(单位:千美元)_缩放马普_(中文(简体) )

SVG和画布执行不支持此属性.

若为 _缩放马普_ 指定,设置用于首先映射xScale的函数,然后将yScale映射到JavaScript和WebGL执行的匹配对子上。 若为 _等于_ 未指定,返回默认为 [网络gl 比例马普](https://github.com/d3fc/d3fc/tree/master/packages/d3fc-webgl#webglScaleMapper)。 。 。 .

返回的 JavaScript 比例尺是使用一个参考比较来检查平等的,以确定数据是否需要再调整比例. 如果引用与上一个渲染相同,则与比例尺相关的数值不会被重新调整.

### 美国

![](https://d3fc.io/examples/series-svg-ohlc/screenshot.png)

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesSvgOhlc) 页:1.**系列 SvgOhlc**(a) 与《公约》有关的其他事项 [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesCanvasOhlc) 页:1.**系列 CanvasOhlc**(a) 与《公约》有关的其他事项 [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesWebglOhlc) 页:1.**系列WebglOhlc**(a) 与《公约》有关的其他事项

为画布、WebGL或SVG构造一个新的 OHLC 渲染器.

#### 共同属性

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesOhlc_crossValue) _系列_。 。 。 .**横跨数值**(单位:千美元)_访问器Func_(中文(简体) ) [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesOhlc_highValue) _系列_。 。 。 .**高数值**(单位:千美元)_访问器Func_(中文(简体) ) [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesOhlc_lowValue) _系列_。 。 。 .**低数值**(单位:千美元)_访问器Func_(中文(简体) ) [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesOhlc_openValue) _系列_。 。 。 .**打开值**(单位:千美元)_访问器Func_(中文(简体) ) [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesOhlc_closeValue) _系列_。 。 。 .**关闭值**(单位:千美元)_访问器Func_(中文(简体) )

若为 _访问器Func_ ,设置指定函数的存取器并返回此序列。 若为 _访问器Func_ 未指定,返回当前访问器。 这个 `accessorFunc(datum, index)` 函数会调用每个数据项,返回给定访问器的相关值。 相应的尺度适用于访问者在渲染前返回的值.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesOhlc_xScale) _系列_。 。 。 .**十. 规模**(单位:千美元)_缩放_(中文(简体) ) [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesOhlc_yScale) _系列_。 。 。 .**比例**(单位:千美元)_缩放_(中文(简体) )

若为 _缩放_ ,设置比例并返回此序列。 若为 _缩放_ 未指定,返回当前比额表.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesOhlc_bandwidth) _系列_。 。 。 .**带宽**(单位:千美元)_带宽Func_(中文(简体) )

若为 _带宽Func_ ,设置带宽函数并返回此序列。 若为 _带宽Func_ 未指定,返回当前带宽函数.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesOhlc_align) _系列_。 。 。 .**对齐**(单位:千美元)_对齐_(中文(简体) )

WebGL 执行不支持此属性 .

若为 _对齐_ ,设置对齐并返回此序列。 若为 _对齐_ 未指定,返回当前对齐。 校正值应为 `left`, (中文(简体) ), `right` 或者说 `center` (默认),并描述每个OHLC与中心值的对齐情况.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesOhlc_decorate) _系列_。 。 。 .**装饰**(单位:千美元)_装饰Func_(中文(简体) )

若为 _装饰Func_ ,将装饰器函数设置为指定的函数,并返回此序列。 若为 _装饰Func_ 未指定,返回当前装饰器函数.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesOhlc_context) _系列_。 。 。 .**上下文**(单位:千美元)_页:1_(中文(简体) )

SVG的执行不支持这种财产.

若为 _页:1_ ,设置画布上下文并返回此序列。 若为 _页:1_ 未指定,返回当前上下文.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesOhlc_lineWidth) _系列_。 。 。 .**行风**(单位:千美元)_宽度_(中文(简体) )

SVG和画布执行不支持此属性.

若为 _宽度_ ,设置行宽并返回此序列。 若为 _宽度_ 未指定,返回当前行宽.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesOhlc_equals) _系列_。 。 。 .**等于**(单位:千美元)_等于_(中文(简体) )

SVG和画布执行不支持此属性.

若为 _等于_ ,设置用于比较的等函数 _上一个数据_ 与 _数据_。此检查的结果用于控制数据是否重新预测和调整。 若为 _等于_ 未指定,则返回当前默认返回的表示数据已更改的虚假等函数.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesOhlc_pixelRatio) _系列_。 。 。 .**像素拉蒂奥**(单位:千美元)_像素拉蒂奥_(中文(简体) )

SVG和画布执行不支持此属性.

若为 _像素拉蒂奥_ ,设置用于缩放任何像素值的系数。 若为 _像素拉蒂奥_ 未指定返回当前值.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesOhlc_scaleMapper) _系列_。 。 。 .**缩放马普**(单位:千美元)_缩放马普_(中文(简体) )

SVG和画布执行不支持此属性.

若为 _缩放马普_ 指定,设置用于首先映射xScale的函数,然后将yScale映射到JavaScript和WebGL执行的匹配对子上。 若为 _等于_ 未指定,返回默认为 [网络gl 比例马普](https://github.com/d3fc/d3fc/tree/master/packages/d3fc-webgl#webglScaleMapper)。 。 。 .

返回的 JavaScript 比例尺是使用一个参考比较来检查平等的,以确定数据是否需要再调整比例. 如果引用与上一个渲染相同,则与比例尺相关的数值不会被重新调整.

### 框图

![](https://d3fc.io/examples/series-svg-boxplot/screenshot.png)

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesSvgBoxPlot) 页:1.**序列Svg 框绘图**(a) 与《公约》有关的其他事项 [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesCanvasBoxPlot) 页:1.**系列 Canvas 框画**(a) 与《公约》有关的其他事项 [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesWebglBoxPlot) 页:1.**序列 Webgl 框画**(a) 与《公约》有关的其他事项

构造用于画布、 WebGL 或 SVG 的新的 boxplot 渲染器.

#### 共同属性

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesBoxPlot_crossValue) _序列框绘图_。 。 。 .**横跨数值**(单位:千美元)_访问器Func_(中文(简体) ) [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesBoxPlot_medianValue) _序列框绘图_。 。 。 .**中间值**(单位:千美元)_访问器Func_(中文(简体) ) [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesBoxPlot_upperQuartileValue) _序列框绘图_。 。 。 .**上等号**(单位:千美元)_访问器Func_(中文(简体) ) [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesBoxPlot_lowerQuartileValue) _序列框绘图_。 。 。 .**下方位数**(单位:千美元)_访问器Func_(中文(简体) ) [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesBoxPlot_highValue) _序列框绘图_。 。 。 .**高数值**(单位:千美元)_访问器Func_(中文(简体) ) [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesBoxPlot_lowValue) _序列框绘图_。 。 。 .**低数值**(单位:千美元)_访问器Func_(中文(简体) )

若为 _访问器Func_ ,设置指定函数的存取器并返回此序列。 若为 _访问器Func_ 未指定,返回当前访问器。 这个 `accessorFunc(datum, index)` 函数会调用每个数据项,返回给定访问器的相关值。 相应的尺度适用于访问者在渲染前返回的值.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesBoxPlot_orient) _序列框绘图_。 。 。 .**东方**(单位:千美元)_方向_(中文(简体) )

WebGL 执行不支持此属性 .

若为 _方向_ ,设置方向并返回此序列。 若为 _方向_ 未指定,返回当前方向。 方向值应该是 `horizontal` (违约)或 `vertical`

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesBoxPlot_xScale) _序列框绘图_。 。 。 .**十. 规模**(单位:千美元)_缩放_(中文(简体) ) [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesBoxPlot_yScale) _序列框绘图_。 。 。 .**比例**(单位:千美元)_缩放_(中文(简体) )

若为 _缩放_ ,设置比例并返回此序列。 若为 _缩放_ 未指定,返回当前比额表.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesBoxPlot_bandwidth) _序列框绘图_。 。 。 .**带宽**(单位:千美元)_带宽Func_(中文(简体) )

若为 _带宽Func_ ,设置带宽函数并返回此序列。 若为 _带宽Func_ 未指定,返回当前带宽函数.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesBoxPlot_align) _序列框绘图_。 。 。 .**对齐**(单位:千美元)_对齐_(中文(简体) )

WebGL 执行不支持此属性 .

若为 _对齐_ ,设置对齐并返回此序列。 若为 _对齐_ 未指定,返回当前对齐。 校正值应为 `left`, (中文(简体) ), `right` 或者说 `center` (默认)并描述每个框图与中心值的对齐情况.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesBoxPlot_cap) _序列框绘图_。 。 。 .**上限**(单位:千美元)_盖顶Func_(中文(简体) )

若为 _盖顶Func_ ,设置盖函数并返回此序列。 若为 _盖顶Func_ 未指定,返回当前盖函数。 这个 `capFunc(item, index)` 函数被调用到每个数据项,然后返回 **比例** 的框宽度.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesBoxPlot_decorate) _序列框绘图_。 。 。 .**装饰**(单位:千美元)_装饰Func_(中文(简体) )

若为 _装饰Func_ ,将装饰器函数设置为指定的函数,并返回此序列。 若为 _装饰Func_ 未指定,返回当前装饰器函数.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesBoxplot_context) _序列框图_。 。 。 .**上下文**(单位:千美元)_页:1_(中文(简体) )

SVG的执行不支持这种财产.

若为 _页:1_ ,设置画布上下文并返回此序列。 若为 _页:1_ 未指定,返回当前上下文.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesBoxplot_lineWidth) _序列框图_。 。 。 .**行风**(单位:千美元)_宽度_(中文(简体) )

SVG和画布执行不支持此属性.

若为 _宽度_ ,设置行宽并返回此序列。 若为 _宽度_ 未指定,返回当前行宽.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesBoxplot_equals) _序列框图_。 。 。 .**等于**(单位:千美元)_等于_(中文(简体) )

SVG和画布执行不支持此属性.

若为 _等于_ ,设置用于比较的等函数 _上一个数据_ 与 _数据_。此检查的结果用于控制数据是否重新预测和调整。 若为 _等于_ 未指定,则返回当前默认返回的表示数据已更改的虚假等函数.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesBoxplot_pixelRatio) _序列框_。 。 。 .**像素拉蒂奥**(单位:千美元)_像素拉蒂奥_(中文(简体) )

SVG和画布执行不支持此属性.

若为 _像素拉蒂奥_ ,设置用于缩放任何像素值的系数。 若为 _像素拉蒂奥_ 未指定返回当前值.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesBoxplot_scaleMapper) _序列框图_。 。 。 .**缩放马普**(单位:千美元)_缩放马普_(中文(简体) )

SVG和画布执行不支持此属性.

若为 _缩放马普_ 指定,设置用于首先映射xScale的函数,然后将yScale映射到JavaScript和WebGL执行的匹配对子上。 若为 _等于_ 未指定,返回默认为 [网络gl 比例马普](https://github.com/d3fc/d3fc/tree/master/packages/d3fc-webgl#webglScaleMapper)。 。 。 .

返回的 JavaScript 比例尺是使用一个参考比较来检查平等的,以确定数据是否需要再调整比例. 如果引用与上一个渲染相同,则与比例尺相关的数值不会被重新调整.

### 错误栏

![](https://d3fc.io/examples/series-svg-errorbar/screenshot.png)

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesSvgErrorBar) 页:1.**序列 Svg 错误栏**(a) 与《公约》有关的其他事项 [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesCanvasErrorBar) 页:1.**canvas Error 文件夹**(a) 与《公约》有关的其他事项 [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesWebglErrorBar) 页:1.**序列 Webgl 错误栏**(a) 与《公约》有关的其他事项

为画布、 WebGL 或 SVG 构造一个新的出错条渲染器.

#### 共同属性

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesErrorBar_crossValue) _序列错误栏_。 。 。 .**横跨数值**(单位:千美元)_访问器Func_(中文(简体) ) [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesErrorBar_highValue) _序列错误栏_。 。 。 .**高数值**(单位:千美元)_访问器Func_(中文(简体) ) [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesErrorBar_lowValue) _序列错误栏_。 。 。 .**低数值**(单位:千美元)_访问器Func_(中文(简体) )

若为 _访问器Func_ ,设置指定函数的存取器并返回此序列。 若为 _访问器Func_ 未指定,返回当前访问器。 这个 `accessorFunc(datum, index)` 函数会调用每个数据项,返回给定访问器的相关值。 相应的尺度适用于访问者在渲染前返回的值.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesErrorBar_orient) _序列错误栏_。 。 。 .**东方**(单位:千美元)_方向_(中文(简体) )

SVG的执行不支持这种财产.

若为 _方向_ ,设置方向并返回此序列。 若为 _方向_ 未指定,返回当前方向。 方向值应该是 `horizontal` (违约)或 `vertical`

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesErrorBar_xScale) _序列错误栏_。 。 。 .**十. 规模**(单位:千美元)_缩放_(中文(简体) ) [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesErrorBar_yScale) _序列错误栏_。 。 。 .**比例**(单位:千美元)_缩放_(中文(简体) )

若为 _缩放_ ,设置比例并返回此序列。 若为 _缩放_ 未指定,返回当前比额表.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesErrorBar_bandwidth) _序列错误栏_。 。 。 .**带宽**(单位:千美元)_带宽Func_(中文(简体) )

若为 _带宽Func_ ,设置带宽函数并返回此序列。 若为 _带宽Func_ 未指定,返回当前带宽函数.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesErrorBar_align) _序列错误栏_。 。 。 .**对齐**(单位:千美元)_对齐_(中文(简体) )

WebGL 执行不支持此属性 .

若为 _对齐_ ,设置对齐并返回此序列。 若为 _对齐_ 未指定,返回当前对齐。 校正值应为 `left`, (中文(简体) ), `right` 或者说 `center` (默认)并描述每个出错栏对齐中心值的方式.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesErrorBar_decorate) _序列错误栏_。 。 。 .**装饰**(单位:千美元)_装饰Func_(中文(简体) )

若为 _装饰Func_ ,将装饰器函数设置为指定的函数,并返回此序列。 若为 _装饰Func_ 未指定,返回当前装饰器函数.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesErrorBar_context) _序列错误栏_。 。 。 .**上下文**(单位:千美元)_页:1_(中文(简体) )

SVG的执行不支持这种财产.

若为 _页:1_ ,设置画布上下文并返回此序列。 若为 _页:1_ 未指定,返回当前上下文.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesErrorBar_lineWidth) _序列错误栏_。 。 。 .**行风**(单位:千美元)_宽度_(中文(简体) )

SVG和画布执行不支持此属性.

若为 _宽度_ ,设置行宽并返回此序列。 若为 _宽度_ 未指定,返回当前行宽.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesErrorBar_equals) _序列错误栏_。 。 。 .**等于**(单位:千美元)_等于_(中文(简体) )

SVG和画布执行不支持此属性.

若为 _等于_ ,设置用于比较的等函数 _上一个数据_ 与 _数据_。此检查的结果用于控制数据是否重新预测和调整。 若为 _等于_ 未指定,则返回当前默认返回的表示数据已更改的虚假等函数.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesErrorBar_pixelRatio) _序列 Erro_。 。 。 .**像素拉蒂奥**(单位:千美元)_像素拉蒂奥_(中文(简体) )

SVG和画布执行不支持此属性.

若为 _像素拉蒂奥_ ,设置用于缩放任何像素值的系数。 若为 _像素拉蒂奥_ 未指定返回当前值.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesErrorBar_scaleMapper) _序列错误栏_。 。 。 .**缩放马普**(单位:千美元)_缩放马普_(中文(简体) )

SVG和画布执行不支持此属性.

若为 _缩放马普_ 指定,设置用于首先映射xScale的函数,然后将yScale映射到JavaScript和WebGL执行的匹配对子上。 若为 _等于_ 未指定,返回默认为 [网络gl 比例马普](https://github.com/d3fc/d3fc/tree/master/packages/d3fc-webgl#webglScaleMapper)。 。 。 .

返回的 JavaScript 比例尺是使用一个参考比较来检查平等的,以确定数据是否需要再调整比例. 如果引用与上一个渲染相同,则与比例尺相关的数值不会被重新调整.

### 热图

![](https://d3fc.io/examples/series-svg-heatmap/screenshot.png)

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesSvgHeatmap) 页:1.**序列 Svg 热图**(a) 与《公约》有关的其他事项 [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesCanvasHeatmap) 页:1.**系列 Canvas Heatmap 相册**(a) 与《公约》有关的其他事项

构造用于画布或SVG的新热映射系列渲染器.

#### 共同属性

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesHeatmap_crossValue) _热图系列_。 。 。 .**横跨数值**(单位:千美元)_访问器Func_(中文(简体) ) [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesHeatmap_highValue) _热图系列_。 。 。 .**高数值**(单位:千美元)_访问器Func_(中文(简体) ) [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesHeatmap_colorValue) _热图系列_。 。 。 .**颜色值**(单位:千美元)_访问器Func_(中文(简体) )

若为 _访问器Func_ ,设置指定函数的存取器并返回此序列。 若为 _访问器Func_ 未指定,返回当前访问器。 这个 `accessorFunc(datum, index)` 函数会调用每个数据项,返回给定访问器的相关值。 相应的尺度适用于访问者在渲染前返回的值.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesHeatmap_xScale) _热图系列_。 。 。 .**十. 规模**(单位:千美元)_缩放_(中文(简体) ) [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesHeatmap_yScale) _热图系列_。 。 。 .**比例**(单位:千美元)_缩放_(中文(简体) )

若为 _缩放_ ,设置比例并返回此序列。 若为 _缩放_ 未指定,返回当前比额表.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesHeatmap_colorInterpolate) _热图系列_。 。 。 .**颜色 刑警组织**(单位:千美元)_内插_(中文(简体) )

若为 _颜色 刑警组织_ ,设置用于将颜色值映射到颜色并返回此序列的插图。 若为 _颜色 刑警组织_ 未指定,返回当前插符.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesHeatmap_xBandwidth) _热图系列_。 。 。 .**x Bandwidth 宽度**(单位:千美元)_带宽Func_(中文(简体) ) [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesHeatmap_yBandwidth) _热图系列_。 。 。 .**银行**(单位:千美元)_带宽Func_(中文(简体) )

若为 _带宽Func_ ,设置带宽函数并返回此序列。 若为 _带宽Func_ 未指定,返回当前带宽函数.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesHeatmap_yAlign) _热图系列_。 。 。 .**对齐**(单位:千美元)_对齐_(中文(简体) ) [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesHeatmap_xAlign) _热图系列_。 。 。 .**x 对齐**(单位:千美元)_对齐_(中文(简体) )

WebGL 执行不支持此属性 .

若为 _对齐_ ,设置对齐并返回此序列。 若为 _对齐_ 未指定,返回当前对齐。 校正值应为 `left`, (中文(简体) ), `right` 或者说 `center` (默认)并描述每个热映射单元格与中心值的对齐情况.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesHeatmap_decorate) _热图系列_。 。 。 .**装饰**(单位:千美元)_装饰Func_(中文(简体) )

若为 _装饰Func_ ,将装饰器函数设置为指定的函数,并返回此序列。 若为 _装饰Func_ 未指定,返回当前装饰器函数.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesErrorBar_context) _序列错误栏_。 。 。 .**上下文**(单位:千美元)_页:1_(中文(简体) )

SVG的执行不支持这种财产.

若为 _页:1_ ,设置画布上下文并返回此序列。 若为 _页:1_ 未指定,返回当前上下文.

### 多个

![](https://d3fc.io/examples/series-svg-multi/screenshot.png)

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesSvgMulti) 页:1.**序列Svg 复数**(a) 与《公约》有关的其他事项 [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesCanvasMulti) 页:1.**复数系列**(a) 与《公约》有关的其他事项 [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesWebglMulti) 页:1.**序列Webgl 多功能**(a) 与《公约》有关的其他事项

为画布,WebGL或SVG构造一个新的多系列渲染器.

#### 共同属性

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesMulti_series) _复数系列_。 。 。 .**系列**(单位:千美元)_序列箭头_(中文(简体) )

若为 _序列箭头_ ,设置该多系列应渲染的系列的数组,并返回该系列。 若为 _序列箭头_ 未指定,返回当前序列的数组.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesMulti_xScale) _复数系列_。 。 。 .**十. 规模**(单位:千美元)_缩放_(中文(简体) ) [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesMulti_yScale) _复数系列_。 。 。 .**比例**(单位:千美元)_缩放_(中文(简体) )

若为 _缩放_ ,设置比例并返回此序列。 若为 _缩放_ 未指定,返回当前比额表.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesMulti_mapping) _复数系列_。 。 。 .**绘图**(单位:千美元)_映射风琴_(中文(简体) )

若为 _映射风琴_ ,将映射函数设置为指定的函数,并返回此序列。 若为 _映射风琴_ 未指定,返回当前映射函数.

在渲染多系列时,对通过该系列提供的每一系列,都引用了一次绘图函数 _系列_ 属性。 绘图功能的目的是返回提供给每个系列的数据. 默认映射是身份函数, `(d) => d`,因此每个系列都得到与多系列组件相同的数据.

与多序列绑定的数据一起引用映射函数,(_数据_),当前系列的索引 (_指数_)和系列数组(_系列_) (中文(简体) ). 映射函数的一个常见模式是切换序列类型. 例如,可以使用多序列来使一行系列与上行结合,由一行注释来表示. 在这种情况下,下列功能将是适当的绘图功能:

```javascript
const multi = fc.seriesSvgMulti()
    .series([line, annotation)
    .mapping((data, index, series) => {
      switch(series[index]) {
        case line:
          return data.line;
        case annotation:
          return data.upperBound;
      }
    });
```

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesMulti_decorate) _复数系列_。 。 。 .**装饰**(单位:千美元)_装饰Func_(中文(简体) )

若为 _装饰Func_ ,将装饰器函数设置为指定的函数,并返回此序列。 若为 _装饰Func_ 未指定,返回当前装饰器函数.

与 SVG 多系列一起,装饰功能被一次引用,数据会加入创建外容器的选择. 随着画布多系列的出现,每个相关系列都引用了装饰功能.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesMulti_context) _复数系列_。 。 。 .**上下文**(单位:千美元)_页:1_(中文(简体) )

SVG的执行不支持这种财产.

若为 _页:1_ ,设置画布上下文并返回此序列。 若为 _页:1_ 未指定,返回当前上下文.

### 重复

![](https://d3fc.io/examples/series-svg-repeat/screenshot.png)

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesSvgRepeat) 页:1.**序列 SvgRepeat**(a) 与《公约》有关的其他事项 [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesCanvasRepeat) 页:1.**系列 Canvas Repeat**(a) 与《公约》有关的其他事项 [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesWebglRepeat) 页:1.**序列WebglRepeat**(a) 与《公约》有关的其他事项

为画布, WebGL 或 SVG 构造一个新的重复系列渲染器.

重复系列在功能上与多系列非常相近,两者都是为了从相同的约束数据中制取多系列. 重复系列对每个数据系列使用同一种序列类型,例如多行系列,或多区域系列.

重复序列期望数据以数组形式呈现. 以下例子说明如何利用它来制造多行系列:

```javascript
const data = [
  [1, 3, 4],
  [4, 5, 6]
];

const line = fc.seriesSvgLine();

const repeatSeries = fc.seriesSvgRepeat()
    .xScale(xScale)
    .yScale(yScale)
    .series(line);

d3.select('g')
    .datum(data)
    .call(repeatSeries);
```

重复系列还暴露了 _东方_ 属性,它决定了系列在约束数据中的“方向”。 在上述例子中,设定 _水平_ 数据将作为两个三分系列(而不是三个二分系列)提供.

#### 共同属性

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesRepeat_series) _序列重复_。 。 。 .**系列**(单位:千美元)_系列_(中文(简体) )

若为 _系列_ ,设置此重复序列应渲染的序列并返回该序列。 若为 _系列_ 未指定,返回当前序列.

仅针对WebGL的实施, _系列_ 可指定为在引用时返回新序列实例的函数。 这使得重复序列可以分配每个数据序列的序列实例,防止了如果只使用一个序列实例而可能发生的不必要的缓存-校验.

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesRepeat_orient) _序列重复_。 。 。 .**东方**(单位:千美元)_方向_(中文(简体) )

若为 _方向_ ,设置方向并返回此序列。 若为 _方向_ 未指定,返回当前方向。 方向值应该是 `vertical` (违约)或 `horizontal`。 。 。 .

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesRepeat_xScale) _序列重复_。 。 。 .**十. 规模**(单位:千美元)_缩放_(中文(简体) ) [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesRepeat_yScale) _序列重复_。 。 。 .**比例**(单位:千美元)_缩放_(中文(简体) ) [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesRepeat_decorate) _序列重复_。 。 。 .**装饰**(单位:千美元)_装饰Func_(中文(简体) ) [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesRepeat_context) _序列重复_。 。 。 .**上下文**(单位:千美元)_页:1_(中文(简体) )

请参见这些属性的文档多系列 .

### 分组

![](https://d3fc.io/examples/series-svg-grouped/screenshot.png)

[{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesSvgGrouped) 页:1.**序列Svg 分组**(单位:千美元)_调整后的序列_(中文(简体) ) [{\\fn方正粗倩简体\\fs12\\an8\\1cHFFFF00\\b0}](https://npmcn.com/package/%40d3fc/d3fc-series/#readme-seriesCanvasGrouped) 页:1.**组合序列**(单位:千美元)_调整后的序列_(中文(简体) )

构造

## 常见问题

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

收集用于将数据系列渲染到SVG和画布的组件,包括线条、条条、OHLC、烛台等

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

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

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

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

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

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

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

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

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

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

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

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

