{ "id": { "desc": "

组件 ID。默认不指定。指定则可用于在 option 或者 API 中引用组件。

\n" }, "name": { "desc": "

系列名称，用于tooltip的显示，legend 的图例筛选，在 setOption 更新数据和配置项时用于指定对应的系列。

\n" }, "coordinateSystem": { "desc": "

该系列使用的坐标系，可选：

\n\n\n\n" }, "xAxisIndex": { "desc": "

使用的 x 轴的 index，在单个图表实例中存在多个 x 轴的时候有用。

\n" }, "yAxisIndex": { "desc": "

使用的 y 轴的 index，在单个图表实例中存在多个 y轴的时候有用。

\n" }, "polarIndex": { "desc": "

使用的极坐标系的 index，在单个图表实例中存在多个极坐标系的时候有用。

\n" }, "geoIndex": { "desc": "

使用的地理坐标系的 index，在单个图表实例中存在多个地理坐标系的时候有用。

\n" }, "calendarIndex": { "desc": "

使用的日历坐标系的 index，在单个图表实例中存在多个日历坐标系的时候有用。

\n" }, "legendHoverLink": { "desc": "\n\n

是否启用图例 hover 时的联动高亮。

\n", "uiControl": { "type": "boolean", "default": "true" } }, "symbol": { "desc": "\n\n

标记的图形。

\n

ECharts 提供的标记类型包括

\n

'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow', 'none'

\n

可以通过 'image://url' 设置为图片，其中 URL 为图片的链接，或者 dataURI。

\n

URL 为图片链接例如：

\n
'image://http://xxx.xxx.xxx/a/b.png'\n

URL 为 dataURI 例如：

\n
'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n

可以通过 'path://' 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式，不用担心因为缩放而产生锯齿或模糊，而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 SVG PathData。可以从 Adobe Illustrator 等工具编辑导出。

\n

例如：

\n
'path://M30.9,53.2C16.8,53.2,5.3,41.7,5.3,27.6S16.8,2,30.9,2C45,2,56.4,13.5,56.4,27.6S45,53.2,30.9,53.2z M30.9,3.5C17.6,3.5,6.8,14.4,6.8,27.6c0,13.3,10.8,24.1,24.101,24.1C44.2,51.7,55,40.9,55,27.6C54.9,14.4,44.1,3.5,30.9,3.5z M36.9,35.8c0,0.601-0.4,1-0.9,1h-1.3c-0.5,0-0.9-0.399-0.9-1V19.5c0-0.6,0.4-1,0.9-1H36c0.5,0,0.9,0.4,0.9,1V35.8z M27.8,35.8 c0,0.601-0.4,1-0.9,1h-1.3c-0.5,0-0.9-0.399-0.9-1V19.5c0-0.6,0.4-1,0.9-1H27c0.5,0,0.9,0.4,0.9,1L27.8,35.8L27.8,35.8z'\n

如果需要每个数据的图形不一样，可以设置为如下格式的回调函数：

\n
(value: Array|number, params: Object) => string\n
\n

其中第一个参数 value 为 data 中的数据值。第二个参数params 是其它的数据项参数。

\n", "uiControl": { "type": "icon", "default": "circle" } }, "symbolSize": { "desc": "\n\n

标记的大小，可以设置成诸如 10 这样单一的数字，也可以用数组分开表示宽和高，例如 [20, 10] 表示标记宽为20，高为10。

\n

如果需要每个数据的图形大小不一样，可以设置为如下格式的回调函数：

\n
(value: Array|number, params: Object) => number|Array\n
\n

其中第一个参数 value 为 data 中的数据值。第二个参数params 是其它的数据项参数。

\n", "uiControl": { "type": "number", "min": "0" } }, "symbolRotate": { "desc": "\n\n

标记的旋转角度（而非弧度）。正值表示逆时针旋转。注意在 markLine 中当 symbol 为 'arrow' 时会忽略 symbolRotate 强制设置为切线的角度。

\n

如果需要每个数据的旋转角度不一样，可以设置为如下格式的回调函数：

\n
(value: Array|number, params: Object) => number\n
\n

其中第一个参数 value 为 data 中的数据值。第二个参数params 是其它的数据项参数。

\n
\n

从 4.8.0 开始支持回调函数。

\n
\n", "uiControl": { "type": "angle", "min": "-180", "max": "180", "step": "1" } }, "symbolKeepAspect": { "desc": "\n\n

如果 symbol 是 path:// 的形式，是否在缩放时保持该图形的长宽比。

\n", "uiControl": { "type": "boolean", "clean": "true" } }, "symbolOffset": { "desc": "\n\n

标记相对于原本位置的偏移。默认情况下，标记会居中置放在数据对应的位置，但是如果 symbol 是自定义的矢量路径或者图片，就有可能不希望 symbol 居中。这时候可以使用该配置项配置 symbol 相对于原本居中的偏移，可以是绝对的像素值，也可以是相对的百分比。

\n

例如 [0, '50%'] 就是把自己向上移动了一半的位置，在 symbol 图形是气泡的时候可以让图形下端的箭头对准数据点。

\n", "uiControl": { "type": "vector", "separate": "true", "dims": "x,y" } }, "large": { "desc": "\n\n

是否开启大数据量优化，在数据图形特别多而出现卡顿时候可以开启。

\n

开启后配合 largeThreshold 在数据量大于指定阈值的时候对绘制进行优化。

\n

缺点：优化后不能自定义设置单个数据项的样式。

\n", "uiControl": { "type": "boolean" } }, "largeThreshold": { "desc": "\n\n

开启绘制优化的阈值。

\n", "uiControl": { "type": "number", "min": "1", "default": "2000" } }, "cursor": { "desc": "\n\n

鼠标悬浮时在图形元素上时鼠标的样式是什么。同 CSS 的 cursor。

\n", "uiControl": { "type": "enum", "options": "auto,pointer,move", "default": "pointer" } }, "label": { "desc": "

图形上的文本标签，可用于说明图形的一些数据信息，比如值，名称等。

\n" }, "label.show": { "desc": "\n\n

是否显示标签。

\n", "uiControl": { "type": "boolean", "default": "false" } }, "label.position": { "desc": "\n\n\n\n

标签的位置。

\n\n

参见：label position。

\n", "uiControl": { "type": "enum", "options": "top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside" } }, "label.distance": { "desc": "\n\n

距离图形元素的距离。当 position 为字符描述值（如 'top'、'insideRight'）时候有效。

\n

参见：label position。

\n", "uiControl": { "type": "number", "default": "5", "min": "0", "step": "0.5" } }, "label.rotate": { "desc": "\n\n

标签旋转。从 -90 度到 90 度。正值是逆时针。

\n

参见：label rotation。

\n", "uiControl": { "type": "angle", "default": "0", "min": "-90", "max": "90", "step": "1" } }, "label.offset": { "desc": "\n\n

是否对文字进行偏移。默认不偏移。例如：[30, 40] 表示文字在横向上偏移 30，纵向上偏移 40。

\n", "uiControl": { "type": "vector", "dims": "x,y", "step": "0.5", "separate": "true" } }, "label.formatter": { "desc": "

标签内容格式器，支持字符串模板和回调函数两种形式，字符串模板与回调函数返回的字符串均支持用 \\n 换行。

\n

字符串模板\n模板变量有：

\n\n

示例：

\n
formatter: '{b}: {@score}'\n
\n

回调函数

\n

回调函数格式：

\n
(params: Object|Array) => string\n
\n

参数 params 是 formatter 需要的单个数据集。格式如下：

\n
{\n    componentType: 'series',\n    // 系列类型\n    seriesType: string,\n    // 系列在传入的 option.series 中的 index\n    seriesIndex: number,\n    // 系列名称\n    seriesName: string,\n    // 数据名，类目名\n    name: string,\n    // 数据在传入的 data 数组中的 index\n    dataIndex: number,\n    // 传入的原始数据项\n    data: Object,\n    // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量（如 map、radar 中）\n    value: number|Array|Object,\n    // 坐标轴 encode 映射信息，\n    // key 为坐标轴（如 'x' 'y' 'radius' 'angle' 等）\n    // value 必然为数组，不会为 null/undefied，表示 dimension index 。\n    // 其内容如：\n    // {\n    //     x: [2] // dimension index 为 2 的数据映射到 x 轴\n    //     y: [0] // dimension index 为 0 的数据映射到 y 轴\n    // }\n    encode: Object,\n    // 维度名列表\n    dimensionNames: Array<String>,\n    // 数据的维度 index，如 0 或 1 或 2 ...\n    // 仅在雷达图中使用。\n    dimensionIndex: number,\n    // 数据图形的颜色\n    color: string,\n\n\n\n}\n
\n

注：encode 和 dimensionNames 的使用方式，例如：

\n

如果数据为：

\n
dataset: {\n    source: [\n        ['Matcha Latte', 43.3, 85.8, 93.7],\n        ['Milk Tea', 83.1, 73.4, 55.1],\n        ['Cheese Cocoa', 86.4, 65.2, 82.5],\n        ['Walnut Brownie', 72.4, 53.9, 39.1]\n    ]\n}\n
\n

则可这样得到 y 轴对应的 value：

\n
params.value[params.encode.y[0]]\n
\n

如果数据为：

\n
dataset: {\n    dimensions: ['product', '2015', '2016', '2017'],\n    source: [\n        {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n        {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n        {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n        {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n    ]\n}\n
\n

则可这样得到 y 轴对应的 value：

\n
params.value[params.dimensionNames[params.encode.y[0]]]\n
\n" }, "label.color": { "desc": "\n\n

文字的颜色。

\n

如果设置为 'inherit'，则为视觉映射得到的颜色，如系列色。

\n", "uiControl": { "type": "color", "default": "null" } }, "label.fontStyle": { "desc": "\n\n

文字字体的风格。

\n

可选：

\n\n", "uiControl": { "type": "enum", "default": "normal", "options": "normal,italic,oblique" } }, "label.fontWeight": { "desc": "\n\n

文字字体的粗细。

\n

可选：

\n\n", "uiControl": { "type": "enum", "default": "normal", "options": "normal,bold,bolder,lighter" } }, "label.fontFamily": { "desc": "\n\n

文字的字体系列。

\n

还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...

\n", "uiControl": { "type": "enum", "default": "sans-serif", "options": "sans-serif,serif,monospace,Arial,Courier New" } }, "label.fontSize": { "desc": "\n\n

文字的字体大小。

\n", "uiControl": { "type": "number", "default": "12", "min": "1", "step": "1" } }, "label.align": { "desc": "\n\n

文字水平对齐方式，默认自动。

\n

可选：

\n\n

rich 中如果没有设置 align，则会取父层级的 align。例如：

\n
{\n    align: right,\n    rich: {\n        a: {\n            // 没有设置 `align`，则 `align` 为 right\n        }\n    }\n}\n
\n", "uiControl": { "type": "enum", "options": "left,center,right" } }, "label.verticalAlign": { "desc": "\n\n

文字垂直对齐方式，默认自动。

\n

可选：

\n\n

rich 中如果没有设置 verticalAlign，则会取父层级的 verticalAlign。例如：

\n
{\n    verticalAlign: bottom,\n    rich: {\n        a: {\n            // 没有设置 `verticalAlign`，则 `verticalAlign` 为 bottom\n        }\n    }\n}\n
\n", "uiControl": { "type": "enum", "options": "top,middle,bottom" } }, "label.lineHeight": { "desc": "\n\n

行高。

\n

rich 中如果没有设置 lineHeight，则会取父层级的 lineHeight。例如：

\n
{\n    lineHeight: 56,\n    rich: {\n        a: {\n            // 没有设置 `lineHeight`，则 `lineHeight` 为 56\n        }\n    }\n}\n
\n", "uiControl": { "type": "number", "min": "0", "step": "1", "default": "12" } }, "label.backgroundColor": { "desc": "\n\n

文字块背景色。

\n

可以使用颜色值，例如：'#123234', 'red', 'rgba(0,23,11,0.3)'。

\n

也可以直接使用图片，例如：

\n
backgroundColor: {\n    image: 'xxx/xxx.png'\n    // 这里可以是图片的 URL，\n    // 或者图片的 dataURI，\n    // 或者 HTMLImageElement 对象，\n    // 或者 HTMLCanvasElement 对象。\n}\n
\n

当使用图片的时候，可以使用 width 或 height 指定高宽，也可以不指定自适应。

\n

如果设置为 'inherit'，则为视觉映射得到的颜色，如系列色。

\n", "uiControl": { "type": "color", "default": "#fff" } }, "label.borderColor": { "desc": "\n\n

文字块边框颜色。

\n

如果设置为 'inherit'，则为视觉映射得到的颜色，如系列色。

\n", "uiControl": { "type": "color", "default": "#fff" } }, "label.borderWidth": { "desc": "\n\n

文字块边框宽度。

\n", "uiControl": { "type": "number", "min": "0", "step": "0.5" } }, "label.borderRadius": { "desc": "\n\n

文字块的圆角。

\n", "uiControl": { "type": "vector", "min": "0", "dims": "LT,RT, RB, LB" } }, "label.padding": { "desc": "\n\n

文字块的内边距。例如：

\n\n

注意，文字块的 width 和 height 指定的是内容高宽，不包含 padding。

\n", "uiControl": { "type": "vector", "min": "0", "dims": "T,R,B,L" } }, "label.shadowColor": { "desc": "\n\n

文字块的背景阴影颜色。

\n", "uiControl": { "type": "color" } }, "label.shadowBlur": { "desc": "\n\n

文字块的背景阴影长度。

\n", "uiControl": { "type": "number", "min": "0", "step": "0.5" } }, "label.shadowOffsetX": { "desc": "\n\n

文字块的背景阴影 X 偏移。

\n", "uiControl": { "type": "number", "step": "0.5" } }, "label.shadowOffsetY": { "desc": "\n\n

文字块的背景阴影 Y 偏移。

\n", "uiControl": { "type": "number", "step": "0.5" } }, "label.width": { "desc": "\n\n

文本显示宽度。

\n", "uiControl": { "type": "number", "default": "100", "min": "1", "max": "500", "step": "1" } }, "label.height": { "desc": "\n\n

文本显示高度。

\n", "uiControl": { "type": "number", "default": "50", "min": "1", "max": "500", "step": "1" } }, "label.textBorderColor": { "desc": "\n\n

文字本身的描边颜色。

\n

如果设置为 'inherit'，则为视觉映射得到的颜色，如系列色。

\n", "uiControl": { "type": "color" } }, "label.textBorderWidth": { "desc": "\n\n

文字本身的描边宽度。

\n", "uiControl": { "type": "number", "min": "0", "step": "0.5" } }, "label.textShadowColor": { "desc": "\n\n

文字本身的阴影颜色。

\n", "uiControl": { "type": "color", "default": "#000" } }, "label.textShadowBlur": { "desc": "\n\n

文字本身的阴影长度。

\n", "uiControl": { "type": "number", "min": "0", "step": "0.5" } }, "label.textShadowOffsetX": { "desc": "\n\n

文字本身的阴影 X 偏移。

\n", "uiControl": { "type": "number", "step": "0.5" } }, "label.textShadowOffsetY": { "desc": "\n\n

文字本身的阴影 Y 偏移。

\n", "uiControl": { "type": "number", "step": "0.5" } }, "label.overflow": { "desc": "\n\n

文字超出宽度是否截断或者换行。配置width时有效

\n\n", "uiControl": { "type": "enum", "options": "truncate,break,breakAll" } }, "label.ellipsis": { "desc": "

在overflow配置为'truncate'的时候，可以通过该属性配置末尾显示的文本。

\n" }, "label.lineOverflow": { "desc": "

文本超出高度部分是否截断，配置height时有效。

\n\n" }, "label.rich": { "desc": "

在 rich 里面，可以自定义富文本样式。利用富文本样式，可以在标签中做出非常丰富的效果。

\n

例如：

\n
label: {\n    // 在文本中，可以对部分文本采用 rich 中定义样式。\n    // 这里需要在文本中使用标记符号：\n    // `{styleName|text content text content}` 标记样式名。\n    // 注意，换行仍是使用 '\\n'。\n    formatter: [\n        '{a|这段文本采用样式a}',\n        '{b|这段文本采用样式b}这段用默认样式{x|这段用样式x}'\n    ].join('\\n'),\n\n    rich: {\n        a: {\n            color: 'red',\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: 'xxx/xxx.jpg'\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: 'Microsoft YaHei',\n            borderColor: '#449933',\n            borderRadius: 4\n        },\n        ...\n    }\n}\n
\n

详情参见教程：富文本标签

\n" }, "label.rich..color": { "desc": "\n\n

文字的颜色。

\n

如果设置为 'inherit'，则为视觉映射得到的颜色，如系列色。

\n", "uiControl": { "type": "color", "default": "null" } }, "label.rich..fontStyle": { "desc": "\n\n

文字字体的风格。

\n

可选：

\n\n", "uiControl": { "type": "enum", "default": "normal", "options": "normal,italic,oblique" } }, "label.rich..fontWeight": { "desc": "\n\n

文字字体的粗细。

\n

可选：

\n
    \n
  • 'normal'
    • \n
  • 'bold'
    • \n
  • 'bolder'
    • \n
  • 'lighter'
    • \n
  • 100 | 200 | 300 | 400...
    • \n
\n", "uiControl": { "type": "enum", "default": "normal", "options": "normal,bold,bolder,lighter" } }, "label.rich..fontFamily": { "desc": "\n\n

文字的字体系列。

\n

还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...

\n", "uiControl": { "type": "enum", "default": "sans-serif", "options": "sans-serif,serif,monospace,Arial,Courier New" } }, "label.rich..fontSize": { "desc": "\n\n

文字的字体大小。

\n", "uiControl": { "type": "number", "default": "12", "min": "1", "step": "1" } }, "label.rich..align": { "desc": "\n\n

文字水平对齐方式，默认自动。

\n

可选：

\n
    \n
  • 'left'
    • \n
  • 'center'
    • \n
  • 'right'
    • \n
\n

rich 中如果没有设置 align，则会取父层级的 align。例如：

\n
{\n    align: right,\n    rich: {\n        a: {\n            // 没有设置 `align`，则 `align` 为 right\n        }\n    }\n}\n
\n", "uiControl": { "type": "enum", "options": "left,center,right" } }, "label.rich..verticalAlign": { "desc": "\n\n

文字垂直对齐方式，默认自动。

\n

可选：

\n
    \n
  • 'top'
    • \n
  • 'middle'
    • \n
  • 'bottom'
    • \n
\n

rich 中如果没有设置 verticalAlign，则会取父层级的 verticalAlign。例如：

\n
{\n    verticalAlign: bottom,\n    rich: {\n        a: {\n            // 没有设置 `verticalAlign`，则 `verticalAlign` 为 bottom\n        }\n    }\n}\n
\n", "uiControl": { "type": "enum", "options": "top,middle,bottom" } }, "label.rich..lineHeight": { "desc": "\n\n

行高。

\n

rich 中如果没有设置 lineHeight，则会取父层级的 lineHeight。例如：

\n
{\n    lineHeight: 56,\n    rich: {\n        a: {\n            // 没有设置 `lineHeight`，则 `lineHeight` 为 56\n        }\n    }\n}\n
\n", "uiControl": { "type": "number", "min": "0", "step": "1", "default": "12" } }, "label.rich..backgroundColor": { "desc": "\n\n

文字块背景色。

\n

可以使用颜色值，例如：'#123234', 'red', 'rgba(0,23,11,0.3)'。

\n

也可以直接使用图片，例如：

\n
backgroundColor: {\n    image: 'xxx/xxx.png'\n    // 这里可以是图片的 URL，\n    // 或者图片的 dataURI，\n    // 或者 HTMLImageElement 对象，\n    // 或者 HTMLCanvasElement 对象。\n}\n
\n

当使用图片的时候，可以使用 width 或 height 指定高宽，也可以不指定自适应。

\n

如果设置为 'inherit'，则为视觉映射得到的颜色，如系列色。

\n", "uiControl": { "type": "color", "default": "#fff" } }, "label.rich..borderColor": { "desc": "\n\n

文字块边框颜色。

\n

如果设置为 'inherit'，则为视觉映射得到的颜色，如系列色。

\n", "uiControl": { "type": "color", "default": "#fff" } }, "label.rich..borderWidth": { "desc": "\n\n

文字块边框宽度。

\n", "uiControl": { "type": "number", "min": "0", "step": "0.5" } }, "label.rich..borderRadius": { "desc": "\n\n

文字块的圆角。

\n", "uiControl": { "type": "vector", "min": "0", "dims": "LT,RT, RB, LB" } }, "label.rich..padding": { "desc": "\n\n

文字块的内边距。例如：

\n
    \n
  • padding: [3, 4, 5, 6]：表示 [上, 右, 下, 左] 的边距。
    • \n
  • padding: 4：表示 padding: [4, 4, 4, 4]。
    • \n
  • padding: [3, 4]：表示 padding: [3, 4, 3, 4]。
    • \n
\n

注意，文字块的 width 和 height 指定的是内容高宽，不包含 padding。

\n", "uiControl": { "type": "vector", "min": "0", "dims": "T,R,B,L" } }, "label.rich..shadowColor": { "desc": "\n\n

文字块的背景阴影颜色。

\n", "uiControl": { "type": "color" } }, "label.rich..shadowBlur": { "desc": "\n\n

文字块的背景阴影长度。

\n", "uiControl": { "type": "number", "min": "0", "step": "0.5" } }, "label.rich..shadowOffsetX": { "desc": "\n\n

文字块的背景阴影 X 偏移。

\n", "uiControl": { "type": "number", "step": "0.5" } }, "label.rich..shadowOffsetY": { "desc": "\n\n

文字块的背景阴影 Y 偏移。

\n", "uiControl": { "type": "number", "step": "0.5" } }, "label.rich..width": { "desc": "

文字块的宽度。一般不用指定，不指定则自动是文字的宽度。在想做表格项或者使用图片（参见 backgroundColor）时，可能会使用它。

\n

注意，文字块的 width 和 height 指定的是内容高宽，不包含 padding。

\n

width 也可以是百分比字符串，如 '100%'。表示的是所在文本块的 contentWidth（即不包含文本块的 padding）的百分之多少。之所以以 contentWidth 做基数，因为每个文本片段只能基于 content box 布局。如果以 outerWidth 做基数，则百分比的计算在实用中不具有意义，可能会超出。

\n

注意，如果不定义 rich 属性，则不能指定 width 和 height。

\n" }, "label.rich..height": { "desc": "

文字块的高度。一般不用指定，不指定则自动是文字的高度。在使用图片（参见 backgroundColor）时，可能会使用它。

\n

注意，文字块的 width 和 height 指定的是内容高宽，不包含 padding。

\n

注意，如果不定义 rich 属性，则不能指定 width 和 height。

\n" }, "label.rich..textBorderColor": { "desc": "\n\n

文字本身的描边颜色。

\n

如果设置为 'inherit'，则为视觉映射得到的颜色，如系列色。

\n", "uiControl": { "type": "color" } }, "label.rich..textBorderWidth": { "desc": "\n\n

文字本身的描边宽度。

\n", "uiControl": { "type": "number", "min": "0", "step": "0.5" } }, "label.rich..textShadowColor": { "desc": "\n\n

文字本身的阴影颜色。

\n", "uiControl": { "type": "color", "default": "#000" } }, "label.rich..textShadowBlur": { "desc": "\n\n

文字本身的阴影长度。

\n", "uiControl": { "type": "number", "min": "0", "step": "0.5" } }, "label.rich..textShadowOffsetX": { "desc": "\n\n

文字本身的阴影 X 偏移。

\n", "uiControl": { "type": "number", "step": "0.5" } }, "label.rich..textShadowOffsetY": { "desc": "\n\n

文字本身的阴影 Y 偏移。

\n", "uiControl": { "type": "number", "step": "0.5" } }, "labelLine": { "desc": "

标签的视觉引导线配置。

\n" }, "labelLine.show": { "desc": "\n\n

是否显示视觉引导线。

\n", "uiControl": { "type": "boolean" } }, "labelLine.showAbove": { "desc": "

是否显示在图形上方。

\n" }, "labelLine.length2": { "desc": "\n\n

视觉引导项第二段的长度。

\n", "uiControl": { "type": "number", "default": "15", "min": "0", "step": "1" } }, "labelLine.smooth": { "desc": "\n\n

是否平滑视觉引导线，默认不平滑，可以设置成 true 平滑显示，也可以设置为 0 到 1 的值，表示平滑程度。

\n", "uiControl": { "type": "boolean" } }, "labelLine.minTurnAngle": { "desc": "

通过调整第二段线的长度，限制引导线两端之间最小的夹角，以防止过小的夹角导致显示不美观。

\n

可以设置为 0 - 180 度。

\n" }, "labelLine.lineStyle.color": { "desc": "\n\n

线的颜色。

\n
\n

颜色可以使用 RGB 表示，比如 'rgb(128, 128, 128)'，如果想要加上 alpha 通道表示不透明度，可以使用 RGBA，比如 'rgba(128, 128, 128, 0.5)'，也可以使用十六进制格式，比如 '#ccc'。除了纯色之外颜色也支持渐变色和纹理填充

\n
// 线性渐变，前四个参数分别是 x0, y0, x2, y2, 范围从 0 - 1，相当于在图形包围盒中的百分比，如果 globalCoord 为 `true`，则该四个值是绝对的像素位置\ncolor: {\n    type: 'linear',\n    x: 0,\n    y: 0,\n    x2: 0,\n    y2: 1,\n    colorStops: [{\n        offset: 0, color: 'red' // 0% 处的颜色\n    }, {\n        offset: 1, color: 'blue' // 100% 处的颜色\n    }],\n    global: false // 缺省为 false\n}\n// 径向渐变，前三个参数分别是圆心 x, y 和半径，取值同线性渐变\ncolor: {\n    type: 'radial',\n    x: 0.5,\n    y: 0.5,\n    r: 0.5,\n    colorStops: [{\n        offset: 0, color: 'red' // 0% 处的颜色\n    }, {\n        offset: 1, color: 'blue' // 100% 处的颜色\n    }],\n    global: false // 缺省为 false\n}\n// 纹理填充\ncolor: {\n    image: imageDom, // 支持为 HTMLImageElement, HTMLCanvasElement，不支持路径字符串\n    repeat: 'repeat' // 是否平铺，可以是 'repeat-x', 'repeat-y', 'no-repeat'\n}\n
\n
\n", "uiControl": { "type": "color" } }, "labelLine.lineStyle.width": { "desc": "\n\n

线宽。

\n", "uiControl": { "type": "number", "value": "1", "min": "0", "step": "0.5" } }, "labelLine.lineStyle.type": { "desc": "\n\n

线的类型。

\n

可选：

\n
    \n
  • 'solid'
    • \n
  • 'dashed'
    • \n
  • 'dotted'
    • \n
\n", "uiControl": { "type": "enum", "default": "solid", "options": "solid,dashed,dotted" } }, "labelLine.lineStyle.shadowBlur": { "desc": "\n\n

图形阴影的模糊大小。该属性配合 shadowColor,shadowOffsetX, shadowOffsetY 一起设置图形的阴影效果。

\n

示例：

\n
{\n    shadowColor: 'rgba(0, 0, 0, 0.5)',\n    shadowBlur: 10\n}\n
\n", "uiControl": { "type": "number", "default": "", "min": "0", "step": "0.5" } }, "labelLine.lineStyle.shadowColor": { "desc": "\n\n

阴影颜色。支持的格式同color。

\n", "uiControl": { "type": "color", "default": "" } }, "labelLine.lineStyle.shadowOffsetX": { "desc": "\n\n

阴影水平方向上的偏移距离。

\n", "uiControl": { "type": "number", "default": "0", "step": "0.5" } }, "labelLine.lineStyle.shadowOffsetY": { "desc": "\n\n

阴影垂直方向上的偏移距离。

\n", "uiControl": { "type": "number", "default": "0", "step": "0.5" } }, "labelLine.lineStyle.opacity": { "desc": "\n\n

图形透明度。支持从 0 到 1 的数字，为 0 时不绘制该图形。

\n", "uiControl": { "type": "number", "default": "1", "min": "0", "max": "1", "step": "0.01" } }, "labelLayout": { "desc": "
\n

从 v5.0.0 开始支持

\n
\n

标签的统一布局配置。

\n

该配置项是在每个系列默认的标签布局基础上，统一调整标签的(x, y)位置，标签对齐等属性以实现想要的标签布局效果。

\n

该配置项也可以是一个有如下参数的回调函数

\n
// 标签对应数据的 dataIndex\ndataIndex: number\n// 标签对应的数据类型，只在关系图中会有 node 和 edge 数据类型的区分\ndataType?: string\n// 标签对应的系列的 index\nseriesIndex: number\n// 标签显示的文本\ntext: string\n// 默认的标签的包围盒，由系列默认的标签布局决定\nlabelRect: {x: number, y: number, width: number, height: number}\n// 默认的标签水平对齐\nalign: 'left' | 'center' | 'right'\n// 默认的标签垂直对齐\nverticalAlign: 'top' | 'middle' | 'bottom'\n// 标签所对应的数据图形的包围盒，可用于定位标签位置\nrect: {x: number, y: number, width: number, height: number}\n// 默认引导线的位置，目前只有饼图(pie)和漏斗图(funnel)有默认标签位置\n// 如果没有该值则为 null\nlabelLinePoints?: number[][]\n
\n

示例：

\n

将标签显示在图形右侧 10px 的位置，并且垂直居中：

\n
labelLayout(params) {\n    return {\n        x: params.rect.x + 10,\n        y: params.rect.y + params.rect.height / 2,\n        verticalAlign: 'middle',\n        align: 'left'\n    }\n}\n
\n

根据图形的包围盒尺寸决定文本尺寸

\n
\nlabelLayout(params) {\n    return {\n        fontSize: Math.max(params.rect.width / 10, 5)\n    };\n}\n
\n" }, "labelLayout.hideOverlap": { "desc": "

是否隐藏重叠的标签。

\n

下面示例演示了在关系图中开启该配置后，在缩放时可以实现自动的标签隐藏。

\n