符号

🌐 Symbols

示例 · 符号提供了类似散点图的类别形状编码。符号以原点为中心；使用变换将符号移动到不同的位置。

symbol(类型, 大小)

🌐 symbol(type, size)

来源 · 构建一个指定类型和大小的新符号生成器。如果未指定，类型默认为圆形，大小默认为64。

svg.append("path").attr("d", d3.symbol(d3.symbolCross));

符号(...参数)

🌐 symbol(...arguments)

来源 · 为给定的参数生成一个符号。参数是任意的；它们会与this对象一起传递给符号生成器的访问函数。使用默认设置时，调用符号生成器会生成一个由64个方形像素组成的圆。

d3.symbol()() // "M4.514,0A4.514,4.514,0,1,1,-4.514,0A4.514,4.514,0,1,1,4.514,0"

如果符号生成器具有上下文，那么符号将作为一系列路径方法调用渲染到该上下文中，并且此函数返回空值。否则，将返回一个路径数据字符串。

🌐 If the symbol generator has a context, then the symbol is rendered to this context as a sequence of path method calls and this function returns void. Otherwise, a path data string is returned.

symbol.类型(type)

🌐 symbol.type(type)

来源 · 如果指定了 type，则将符号类型设置为指定的函数或符号类型，并返回此符号生成器。

const symbol = d3.symbol().type(d3.symbolCross);

如果 type 是一个函数，符号生成器的参数和 this 会被传递过去。这在与 selection.attr 一起使用时非常方便，例如结合 序数刻度 来生成类别符号编码。

🌐 If type is a function, the symbol generator’s arguments and this are passed through. This is convenient for use with selection.attr, say in conjunction with an ordinal scale to produce a categorical symbol encoding.

const symbolType = d3.scaleOrdinal(d3.symbolsFill);
const symbol = d3.symbol().type((d) => symbolType(d.category));

如果未指定 type，则返回当前符号类型访问器。

🌐 If type is not specified, returns the current symbol type accessor.

symbol.type() // () => d3.symbolCross

符号类型访问器默认为：

🌐 The symbol type accessor defaults to:

function type() {
  return circle;
}

请参阅 symbolsFill 和 symbolsStroke 了解内置符号类型。要实现自定义符号类型，请传入一个实现了 symbolType.draw 的对象。

🌐 See symbolsFill and symbolsStroke for built-in symbol types. To implement a custom symbol type, pass an object that implements symbolType.draw.

symbol.size(size)

来源 · 如果指定了 size，则将大小设置为指定的函数或数字，并返回此符号生成器。

const symbol = d3.symbol().size(100);

如果 size 是一个函数，符号生成器的参数和 this 会被传递过去。这在与 selection.attr 一起使用时非常方便，例如结合 线性刻度 来生成量化的尺寸编码。

🌐 If size is a function, the symbol generator’s arguments and this are passed through. This is convenient for use with selection.attr, say in conjunction with a linear scale to produce a quantitative size encoding.

const symbolSize = d3.scaleLinear([0, 100]);
const symbol = d3.symbol().size((d) => symbolSize(d.value));

如果未指定 size，则返回当前的大小访问器。

🌐 If size is not specified, returns the current size accessor.

symbol.size() // () => 100

size 访问器默认为：

🌐 The size accessor defaults to:

function size() {
  return 64;
}

symbol.context(context)

来源 · 如果指定了 context，则设置该上下文并返回此符号生成器。

const context = canvas.getContext("2d");
const symbol = d3.symbol().context(context);

如果未指定 context，则返回当前上下文。

🌐 If context is not specified, returns the current context.

symbol.context() // context

上下文默认为 null。如果上下文不为 null，则将 生成的符号 以一系列 路径方法 调用的形式呈现到此上下文中。否则，将返回表示生成符号的 路径数据 字符串。

🌐 The context defaults to null. If the context is not null, then the generated symbol is rendered to this context as a sequence of path method calls. Otherwise, a path data string representing the generated symbol is returned.

symbol.digits(digits)

来源 · 如果指定了 digits，则设置小数点后的最大位数，并返回此符号生成器。

const symbol = d3.symbol().digits(3);

如果未指定 digits，则返回当前的最大小数位数，默认值为3。

🌐 If digits is not specified, returns the current maximum fraction digits, which defaults to 3.

symbol.digits() // 3

此选项仅在关联的上下文 为 null 时适用，例如当此符号生成器用于生成路径数据时。

🌐 This option only applies when the associated context is null, as when this symbol generator is used to produce path data.

symbolsFill

来源 · 一个包含用于填充的一组符号类型的数组：圆、叉、菱形、方形、星形、三角形 和 Y形。对于使用 序数比例 的分类形状编码非常有用。

const symbolType = d3.scaleOrdinal(d3.symbolsFill);

symbolsStroke

来源 · 一个包含用于描边的符号类型集合的数组：圆圈、加号、乘号、三角形2、星号、方形2 和 菱形2。适用于使用序数比例的分类形状编码。

const symbolType = d3.scaleOrdinal(d3.symbolsStroke);

符号星号

🌐 symbolAsterisk

来源 · 星号符号类型；用于描画。

symbolCircle

来源 · 圆圈符号类型；用于填充或描边。

symbolCross

来源 · 希腊十字符号类型，四臂等长；用于填充。

symbolDiamond

来源 · 菱形符号类型；用于填充。

symbolDiamond2

来源 · 旋转方形符号类型；用于描边。

symbolPlus

来源 · 加号类型；用于描画。

symbolSquare

来源 · 方形符号类型；用于填充。

symbolSquare2

来源 · 方形² 符号类型；用于描边。

symbolStar

来源 · 五角星（五芒星）符号类型；用于填充。

symbolTriangle

来源 · 向上指的三角形符号类型；用于填充。

symbolTriangle2

来源 · 向上指的三角形符号类型；用于描画。

符号星形

🌐 symbolWye

来源 · Y 型符号类型；用于填充。

symbolTimes

来源 · X形符号类型；用于描画。

自定义符号

🌐 Custom symbols

符号类型通常不会被直接使用，而是传递给 symbol.type。但是，如果没有内置类型能够满足你的需求，你可以使用以下接口定义自己的符号类型实现。你也可以将此底层接口与内置符号类型一起使用，作为符号生成器的替代方案。

🌐 Symbol types are typically not used directly, instead being passed to symbol.type. However, you can define your own symbol type implementation should none of the built-in types satisfy your needs using the following interface. You can also use this low-level interface with a built-in symbol type as an alternative to the symbol generator.

const path = d3.pathRound(3);
const circle = d3.symbolCircle.draw(path, 64);
path.toString(); // "M4.514,0A4.514,4.514,0,1,1,-4.514,0A4.514,4.514,0,1,1,4.514,0"

symbolType.draw(context, size)

将此符号类型渲染到指定的 context 中，使用指定的平方像素 size。context 实现了 CanvasPathMethods 接口。（注意，这只是 CanvasRenderingContext2D 接口的一个子集！）另见 d3-path。

🌐 Renders this symbol type to the specified context with the specified size in square pixels. The context implements the CanvasPathMethods interface. (Note that this is a subset of the CanvasRenderingContext2D interface!) See also d3-path.

pointRadial(角度, 半径)

🌐 pointRadial(angle, radius)

示例 · 来源 · 返回给定角度（以弧度为单位）的点 [x, y]，其中 0 在 -y（12 点钟方向），正角顺时针方向增加，并使用给定的半径。

d3.pointRadial(Math.PI / 3, 100) // [86.60254037844386, -50]