label

18 notes, read out of this brain and free to use. Each one was extracted from a source and is re-checked against its exam.

Label distance option

The distance option controls the distance from the label to the graphic element. In 3D Scatter charts, this distance is measured in pixel values of screen space. In other chart types, this distance is measured as a relative 3D distance.

Label position option

The position option controls the location of the label. Allowed values are: 'top', 'left', 'right', 'bottom'. The default value is 'top'.

Label formatter option string template

The formatter option in labels supports string templates with the following model variations: {a} for series name, {b} for the name of a data item, and {c} for the value of a data item. New lines are supported with \n.

Label textStyle option

The textStyle option in labels defines the font style of the label. It accepts an object with properties for color, borderWidth, borderColor, fontFamily, fontSize, and fontWeight.

Label formatter string template example

Example of label formatter using string template: formatter: '{b}: {c}' displays the data item name followed by its value.

scatter3D label options

The label object controls label appearance. Default position is 'right' with distance 5. Default text font size is 14, text color is '#000', text border width is 1, and text border color is '#fff'.

label property - map area labels

The label property configures labels for map areas, with support for formatter functions to customize label text.

Label formatter string template placeholders

Data label formatter supports string template with these model variations: {a} for series name, {b} for the name of a data item, {c} for the value of a data item, {@xxx} for the value of a dimension named 'xxx' (e.g., {@product}), and {@[n]} for the value of a dimension at index n (e.g., {@[3]}).

Label formatter callback function signature

Label formatter callback function has the signature (params: Object|Array) => string, where params is the single dataset needed by the formatter.

label show option default

The label `show` option controls whether to display the label. It defaults to `false`.

label position option values

The label `position` option accepts either an array [x, y] or a string. Array values can be absolute pixel values like [10, 10] or relative percentages like ['50%', '50%'] representing position relative to the top-left corner of the bounding box. String values are: 'top', 'left', 'right', 'bottom', 'inside', 'insideLeft', 'insideRight', 'insideTop', 'insideBottom', 'insideTopLeft', 'insideBottomLeft', 'insideTopRight', 'insideBottomRight'.

label distance option default

The label `distance` option controls the distance to the host graphic element. It defaults to 5 and only applies when `position` is a string value like 'top' or 'insideRight', not when position is an array [x, y].

label rotate option range

The label `rotate` option rotates the label from -90 degrees to 90 degrees. Positive values rotate counter-clockwise. The default value is 0.

label offset option format

The label `offset` option accepts an array [x, y] to move text slightly. For example, [30, 40] moves the label 30 pixels horizontally and 40 pixels vertically.

textMargin option syntax and behavior

The label `textMargin` option (introduced in version 6.0.0) specifies space around the label to prevent overlapping, measured in pixels. It can be specified as: a single number (e.g., `textMargin: 5` means [5, 5, 5, 5]); an array of two numbers (e.g., `textMargin: [5, 10]` sets top/bottom to 5 and left/right to 10); or an array of four numbers (e.g., `textMargin: [5, 10, 5, 10]` for up, right, down, left respectively). The `textMargin` is applied to the label's local bounding rect before any rotation is applied.

minMargin option for labels

The label `minMargin` option (introduced in version 5.0.0) specifies the minimal margin between labels, used when label has layout. It accepts only a number value. The minimal gap between two labels is calculated as `label1.minMargin/2 + label2.minMargin/2`. When `rotate` is specified on a label, `minMargin` first rotates the label to form a new expanded bounding rect, then applies the margin. This differs from `textMargin`, which applies to the local bounding rect before rotation.

label structure in ECharts 3+

In ECharts 3 and later versions, the `label` configuration is at the same level as `itemStyle`, not nested under it as in ECharts 2.x. The label has an `emphasis` property similar to `itemStyle` for emphasizing state styling.

textMargin vs minMargin differences

Both `textMargin` and `minMargin` control spacing around labels but differ in data type and rotation behavior. `minMargin` only accepts a number, while `textMargin` accepts number or number[] following CSS margin syntax. For rotated labels, `minMargin` applies after rotation on the expanded bounding rect, while `textMargin` applies before rotation on the local bounding rect. `textMargin` generally provides more compact layout for rotated labels.

Give your agent this brain