{ "type": { "desc": "\n\n

图例的类型。可选值:

\n\n

参见 滚动图例(垂直)滚动图例(水平)

\n

当使用 'scroll' 时,使用这些设置进行细节配置:

\n\n", "uiControl": { "type": "enum", "options": "plain,scroll" } }, "id": { "desc": "

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

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

所有图形的 zlevel 值。

\n

zlevel用于 Canvas 分层,不同zlevel值的图形会放置在不同的 Canvas 中,Canvas 分层是一种常见的优化手段。我们可以把一些图形变化频繁(例如有动画)的组件设置成一个单独的zlevel。需要注意的是过多的 Canvas 会引起内存开销的增大,在手机端上需要谨慎使用以防崩溃。

\n

zlevel 大的 Canvas 会放在 zlevel 小的 Canvas 的上面。

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

组件的所有图形的z值。控制图形的前后顺序。z值小的图形会被z值大的图形覆盖。

\n

z相比zlevel优先级更低,而且不会创建新的 Canvas。

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

图例组件离容器左侧的距离。

\n

left 的值可以是像 20 这样的具体像素值,可以是像 '20%' 这样相对于容器高宽的百分比,也可以是 'left', 'center', 'right'

\n

如果 left 的值为'left', 'center', 'right',组件会根据相应的位置自动对齐。

\n", "uiControl": { "type": "percent", "default": "0%" } }, "top": { "desc": "\n\n

图例组件离容器上侧的距离。

\n

top 的值可以是像 20 这样的具体像素值,可以是像 '20%' 这样相对于容器高宽的百分比,也可以是 'top', 'middle', 'bottom'

\n

如果 top 的值为'top', 'middle', 'bottom',组件会根据相应的位置自动对齐。

\n", "uiControl": { "type": "percent", "default": "0%" } }, "right": { "desc": "\n\n

图例组件离容器右侧的距离。

\n

right 的值可以是像 20 这样的具体像素值,可以是像 '20%' 这样相对于容器高宽的百分比。

\n

默认自适应。

\n", "uiControl": { "type": "percent", "default": "0%" } }, "bottom": { "desc": "\n\n

图例组件离容器下侧的距离。

\n

bottom 的值可以是像 20 这样的具体像素值,可以是像 '20%' 这样相对于容器高宽的百分比。

\n

默认自适应。

\n", "uiControl": { "type": "percent", "default": "0%" } }, "width": { "desc": "\n\n

图例组件的宽度。默认自适应。

\n", "uiControl": { "type": "percent", "default": "50%" } }, "height": { "desc": "\n\n

图例组件的高度。默认自适应。

\n", "uiControl": { "type": "percent", "default": "50%" } }, "orient": { "desc": "\n\n

图例列表的布局朝向。

\n

可选:

\n\n", "uiControl": { "type": "enum", "options": "vertical,horizontal", "default": "horizontal" } }, "align": { "desc": "\n\n

图例标记和文本的对齐。默认自动,根据组件的位置和 orient 决定,当组件的 left 值为 'right' 以及纵向布局(orient'vertical')的时候为右对齐,即为 'right'

\n

可选:

\n\n", "uiControl": { "type": "enum", "options": "auto,left,right", "default": "auto" } }, "padding": { "desc": "\n\n\n\n\n\n

图例内边距,单位px,默认各方向内边距为5,接受数组分别设定上右下左边距。

\n

使用示例:

\n
// 设置内边距为 5\npadding: 5\n// 设置上下的内边距为 5,左右的内边距为 10\npadding: [5, 10]\n// 分别设置四个方向的内边距\npadding: [\n    5,  // 上\n    10, // 右\n    5,  // 下\n    10, // 左\n]\n
\n", "uiControl": { "type": "vector", "min": "0", "dims": "T,R,B,L" } }, "itemGap": { "desc": "\n\n

图例每项之间的间隔。横向布局时为水平间隔,纵向布局时为纵向间隔。

\n", "uiControl": { "type": "number", "default": "10", "min": "0", "step": "0.5" } }, "itemWidth": { "desc": "\n\n

图例标记的图形宽度。

\n", "uiControl": { "type": "number", "default": "25", "min": "0", "step": "0.5" } }, "itemHeight": { "desc": "\n\n

图例标记的图形高度。

\n", "uiControl": { "type": "number", "default": "14", "min": "0", "step": "0.5" } }, "symbolKeepAspect": { "desc": "\n\n

如果图标(可能来自系列的 symbol 或用户自定义的 legend.data.icon)是 path:// 的形式,是否在缩放时保持该图形的长宽比。

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

用来格式化图例文本,支持字符串模板和回调函数两种形式。

\n

示例:

\n
// 使用字符串模板,模板变量为图例名称 {name}\nformatter: 'Legend {name}'\n// 使用回调函数\nformatter: function (name) {\n    return 'Legend ' + name;\n}\n
\n" }, "selectedMode": { "desc": "\n\n

图例选择的模式,控制是否可以通过点击图例改变系列的显示状态。默认开启图例选择,可以设成 false 关闭。

\n

除此之外也可以设成 'single' 或者 'multiple' 使用单选或者多选模式。

\n", "uiControl": { "type": "boolean", "options": "true,false,single,multiple" } }, "inactiveColor": { "desc": "\n\n

图例关闭时的颜色。

\n", "uiControl": { "type": "color", "default": "#ccc" } }, "selected": { "desc": "

图例选中状态表。

\n

示例:

\n
selected: {\n    // 选中'系列1'\n    '系列1': true,\n    // 不选中'系列2'\n    '系列2': false\n}\n
" }, "textStyle": { "desc": "

图例的公用文本样式。

\n" }, "textStyle.color": { "desc": "\n\n

文字的颜色。

\n", "uiControl": { "type": "color", "default": "#333" } }, "textStyle.fontStyle": { "desc": "\n\n

文字字体的风格。

\n

可选:

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

文字字体的粗细。

\n

可选:

\n\n", "uiControl": { "type": "enum", "default": "normal", "options": "normal,bold,bolder,lighter" } }, "textStyle.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" } }, "textStyle.fontSize": { "desc": "\n\n

文字的字体大小。

\n", "uiControl": { "type": "number", "default": "12", "min": "1", "step": "1" } }, "textStyle.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" } }, "textStyle.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

当使用图片的时候,可以使用 widthheight 指定高宽,也可以不指定自适应。

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

文字块边框颜色。

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

文字块边框宽度。

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

文字块的圆角。

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

文字块的内边距。例如:

\n\n

注意,文字块的 widthheight 指定的是内容高宽,不包含 padding

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

文字块的背景阴影颜色。

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

文字块的背景阴影长度。

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

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

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

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

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

文本显示宽度。

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

文本显示高度。

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

文字本身的描边颜色。

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

文字本身的描边宽度。

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

文字本身的阴影颜色。

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

文字本身的阴影长度。

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

文字本身的阴影 X 偏移。

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

文字本身的阴影 Y 偏移。

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

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

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

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

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

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

\n\n" }, "textStyle.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" }, "textStyle.rich..color": { "desc": "\n\n

文字的颜色。

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

文字字体的风格。

\n

可选:

\n\n", "uiControl": { "type": "enum", "default": "normal", "options": "normal,italic,oblique" } }, "textStyle.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" } }, "textStyle.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" } }, "textStyle.rich..fontSize": { "desc": "\n\n

文字的字体大小。

\n", "uiControl": { "type": "number", "default": "12", "min": "1", "step": "1" } }, "textStyle.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" } }, "textStyle.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" } }, "textStyle.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" } }, "textStyle.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

当使用图片的时候,可以使用 widthheight 指定高宽,也可以不指定自适应。

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

文字块边框颜色。

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

文字块边框宽度。

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

文字块的圆角。

\n", "uiControl": { "type": "vector", "min": "0", "dims": "LT,RT, RB, LB" } }, "textStyle.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

注意,文字块的 widthheight 指定的是内容高宽,不包含 padding

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

文字块的背景阴影颜色。

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

文字块的背景阴影长度。

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

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

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

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

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

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

\n

注意,文字块的 widthheight 指定的是内容高宽,不包含 padding

\n

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

\n

注意,如果不定义 rich 属性,则不能指定 widthheight

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

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

\n

注意,文字块的 widthheight 指定的是内容高宽,不包含 padding

\n

注意,如果不定义 rich 属性,则不能指定 widthheight

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

文字本身的描边颜色。

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

文字本身的描边宽度。

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

文字本身的阴影颜色。

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

文字本身的阴影长度。

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

文字本身的阴影 X 偏移。

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

文字本身的阴影 Y 偏移。

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

图例的 tooltip 配置,配置项同 tooltip。默认不显示,可以在 legend 文字很多的时候对文字做裁剪并且开启 tooltip,如下示例:

\n
legend: {\n    formatter: function (name) {\n        return echarts.format.truncateText(name, 40, '14px Microsoft Yahei', '…');\n    },\n    tooltip: {\n        show: true\n    }\n}\n
\n" }, "icon": { "desc": "\n\n

图例项的 icon。

\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
", "uiControl": { "type": "icon" } }, "data": { "desc": "

图例的数据数组。数组项通常为一个字符串,每一项代表一个系列的 name(如果是饼图,也可以是饼图单个数据的 name)。图例组件会自动根据对应系列的图形标记(symbol)来绘制自己的颜色和标记,特殊字符串 ''(空字符串)或者 '\\n'(换行字符串)用于图例的换行。

\n

如果 data 没有被指定,会自动从当前系列中获取。多数系列会取自 series.name 或者 series.encodeseriesName 所指定的维度。如 饼图 and 漏斗图 等会取自 series.data 中的 name。

\n

如果要设置单独一项的样式,也可以把该项写成配置项对象。此时必须使用 name 属性对应表示系列的 name

\n

示例

\n
data: [{\n    name: '系列1',\n    // 强制设置图形为圆。\n    icon: 'circle',\n    // 设置文本为红色\n    textStyle: {\n        color: 'red'\n    }\n}]\n
" }, "data.name": { "desc": "

图例项的名称,应等于某系列的name值(如果是饼图,也可以是饼图单个数据的 name)。

\n" }, "data.icon": { "desc": "

图例项的 icon。

\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
" }, "data.textStyle": { "desc": "

图例项的文本样式。

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

图例背景色,默认透明。

\n
\n

颜色可以使用 RGB 表示,比如 'rgb(128, 128, 128)' ,如果想要加上 alpha 通道,可以使用 RGBA,比如 'rgba(128, 128, 128, 0.5)',也可以使用十六进制格式,比如 '#ccc'

\n
\n", "uiControl": { "type": "color" } }, "borderColor": { "desc": "\n\n

图例的边框颜色。支持的颜色格式同 backgroundColor。

\n", "uiControl": { "type": "color", "default": "#ccc" } }, "borderWidth": { "desc": "\n\n

图例的边框线宽。

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

圆角半径,单位px,支持传入数组分别指定 4 个圆角半径。\n如:

\n
borderRadius: 5, // 统一设置四个角的圆角大小\nborderRadius: [5, 5, 0, 0] //(顺时针左上,右上,右下,左下)\n
", "uiControl": { "type": "vector", "min": "0", "dims": "LT,RT,RB,LB" } }, "shadowBlur": { "desc": "\n\n

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

\n

示例:

\n
{\n    shadowColor: 'rgba(0, 0, 0, 0.5)',\n    shadowBlur: 10\n}\n
\n

注意:此配置项生效的前提是,设置了 show: true 以及值不为 tranparent 的背景色 backgroundColor

\n", "uiControl": { "type": "number", "default": "", "min": "0", "step": "0.5" } }, "shadowColor": { "desc": "\n\n

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

\n

注意:此配置项生效的前提是,设置了 show: true

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

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

\n

注意:此配置项生效的前提是,设置了 show: true

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

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

\n

注意:此配置项生效的前提是,设置了 show: true

\n", "uiControl": { "type": "number", "default": "0", "step": "0.5" } }, "scrollDataIndex": { "desc": "

legend.type'scroll' 时有效。

\n

图例当前最左上显示项的 dataIndex

\n

setOption 时指定此项的话,可决定当前图例滚动到哪里。

\n

但是,如果仅仅想改变图例翻页,一般并不调用 setOption(因为这太重量了),仅仅使用 action legendScroll 即可。

\n

参见 滚动图例(垂直)滚动图例(水平)

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

legend.type'scroll' 时有效。

\n

图例控制块中,按钮和页信息之间的间隔。

\n

参见 滚动图例(垂直)滚动图例(水平)

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

legend.type'scroll' 时有效。

\n

图例控制块和图例项之间的间隔。

\n

参见 滚动图例(垂直)滚动图例(水平)

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

legend.type'scroll' 时有效。

\n

图例控制块的位置。可选值为:

\n
    \n
  • 'start':控制块在左或上。
  • \n
  • 'end':控制块在右或下。
  • \n
\n

参见 滚动图例(垂直)滚动图例(水平)

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

legend.type'scroll' 时有效。

\n

图例控制块中,页信息的显示格式。默认为 '{current}/{total}',其中 {current} 是当前页号(从 1 开始计数),{total} 是总页数。

\n

如果 pageFormatter 使用函数,须返回字符串,参数为:

\n
{\n    current: number\n    total: number\n}\n
\n

参见 滚动图例(垂直)滚动图例(水平)

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

legend.type'scroll' 时有效。

\n

图例控制块的图标。

\n" }, "pageIcons.horizontal": { "desc": "

legend.orient'horizontal' 时的翻页按钮图标。

\n

是一个数组,表示 [previous page button, next page button]。默认值为 ['M0,0L12,-10L12,10z', 'M0,0L-12,-10L-12,10z'],。

\n

数组中每项,

\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" }, "pageIcons.vertical": { "desc": "

legend.orient'vertical' 时的翻页按钮图标。

\n

是一个数组,表示 [previous page button, next page button]。默认值为 ['M0,0L20,0L10,-20z', 'M0,0L20,0L10,20z'],。

\n

数组中每项,

\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" }, "pageIconColor": { "desc": "\n\n

legend.type'scroll' 时有效。

\n

翻页按钮的颜色。

\n

参见 滚动图例(垂直)滚动图例(水平)

\n", "uiControl": { "type": "color", "default": "#2f4554" } }, "pageIconInactiveColor": { "desc": "\n\n

legend.type'scroll' 时有效。

\n

翻页按钮不激活时(即翻页到头时)的颜色。

\n

参见 滚动图例(垂直)滚动图例(水平)

\n", "uiControl": { "type": "color", "default": "#aaa" } }, "pageIconSize": { "desc": "\n\n

legend.type'scroll' 时有效。

\n

翻页按钮的大小。可以是数字,也可以是数组,如 [10, 3],表示 [宽,高]

\n

参见 滚动图例(垂直)滚动图例(水平)

\n", "uiControl": { "type": "vector", "default": "15,15", "dims": "w,h" } }, "pageTextStyle": { "desc": "

legend.type'scroll' 时有效。

\n

图例页信息的文字样式。

\n" }, "pageTextStyle.color": { "desc": "\n\n

文字的颜色。

\n", "uiControl": { "type": "color", "default": "#333" } }, "pageTextStyle.fontStyle": { "desc": "\n\n

文字字体的风格。

\n

可选:

\n
    \n
  • 'normal'
  • \n
  • 'italic'
  • \n
  • 'oblique'
  • \n
\n", "uiControl": { "type": "enum", "default": "normal", "options": "normal,italic,oblique" } }, "pageTextStyle.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" } }, "pageTextStyle.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" } }, "pageTextStyle.fontSize": { "desc": "\n\n

文字的字体大小。

\n", "uiControl": { "type": "number", "default": "12", "min": "1", "step": "1" } }, "pageTextStyle.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" } }, "pageTextStyle.width": { "desc": "\n\n

文本显示宽度。

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

文本显示高度。

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

文字本身的描边颜色。

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

文字本身的描边宽度。

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

文字本身的阴影颜色。

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

文字本身的阴影长度。

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

文字本身的阴影 X 偏移。

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

文字本身的阴影 Y 偏移。

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

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

\n
    \n
  • 'truncate' 截断,并在末尾显示ellipsis配置的文本,默认为...
  • \n
  • 'break' 换行
  • \n
  • 'breakAll' 换行,跟'break'不同的是,在英语等拉丁文中,'breakAll'还会强制单词内换行
  • \n
\n", "uiControl": { "type": "enum", "options": "truncate,break,breakAll" } }, "pageTextStyle.ellipsis": { "desc": "

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

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

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

\n
    \n
  • 'truncate' 在文本行数超出高度部分截断。
  • \n
\n" }, "animation": { "desc": "\n\n

图例翻页是否使用动画。

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

图例翻页时的动画时长。

\n", "uiControl": { "type": "number", "min": "0", "default": "800", "step": "20" } }, "emphasis.selectorLabel": { "desc": "
\n

v4.4.0 开始支持

\n
\n" }, "emphasis.selectorLabel.show": { "desc": "\n\n

是否显示标签。

\n", "uiControl": { "type": "boolean", "default": "true" } }, "emphasis.selectorLabel.distance": { "desc": "\n\n

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

\n

参见:label position

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

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

\n

参见:label rotation

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

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

\n", "uiControl": { "type": "vector", "dims": "x,y", "step": "0.5", "separate": "true" } }, "emphasis.selectorLabel.color": { "desc": "\n\n

文字的颜色。

\n

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

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

文字字体的风格。

\n

可选:

\n
    \n
  • 'normal'
  • \n
  • 'italic'
  • \n
  • 'oblique'
  • \n
\n", "uiControl": { "type": "enum", "default": "normal", "options": "normal,italic,oblique" } }, "emphasis.selectorLabel.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" } }, "emphasis.selectorLabel.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" } }, "emphasis.selectorLabel.fontSize": { "desc": "\n\n

文字的字体大小。

\n", "uiControl": { "type": "number", "default": "12", "min": "1", "step": "1" } }, "emphasis.selectorLabel.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" } }, "emphasis.selectorLabel.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" } }, "emphasis.selectorLabel.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" } }, "emphasis.selectorLabel.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

当使用图片的时候,可以使用 widthheight 指定高宽,也可以不指定自适应。

\n

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

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

文字块边框颜色。

\n

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

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

文字块边框宽度。

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

文字块的圆角。

\n", "uiControl": { "type": "vector", "min": "0", "dims": "LT,RT, RB, LB" } }, "emphasis.selectorLabel.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

注意,文字块的 widthheight 指定的是内容高宽,不包含 padding

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

文字块的背景阴影颜色。

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

文字块的背景阴影长度。

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

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

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

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

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

文本显示宽度。

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

文本显示高度。

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

文字本身的描边颜色。

\n

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

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

文字本身的描边宽度。

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

文字本身的阴影颜色。

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

文字本身的阴影长度。

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

文字本身的阴影 X 偏移。

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

文字本身的阴影 Y 偏移。

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

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

\n
    \n
  • 'truncate' 截断,并在末尾显示ellipsis配置的文本,默认为...
  • \n
  • 'break' 换行
  • \n
  • 'breakAll' 换行,跟'break'不同的是,在英语等拉丁文中,'breakAll'还会强制单词内换行
  • \n
\n", "uiControl": { "type": "enum", "options": "truncate,break,breakAll" } }, "emphasis.selectorLabel.ellipsis": { "desc": "

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

\n" }, "emphasis.selectorLabel.lineOverflow": { "desc": "

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

\n
    \n
  • 'truncate' 在文本行数超出高度部分截断。
  • \n
\n" }, "emphasis.selectorLabel.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" }, "emphasis.selectorLabel.rich..color": { "desc": "\n\n

文字的颜色。

\n

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

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

文字字体的风格。

\n

可选:

\n
    \n
  • 'normal'
  • \n
  • 'italic'
  • \n
  • 'oblique'
  • \n
\n", "uiControl": { "type": "enum", "default": "normal", "options": "normal,italic,oblique" } }, "emphasis.selectorLabel.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" } }, "emphasis.selectorLabel.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" } }, "emphasis.selectorLabel.rich..fontSize": { "desc": "\n\n

文字的字体大小。

\n", "uiControl": { "type": "number", "default": "12", "min": "1", "step": "1" } }, "emphasis.selectorLabel.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" } }, "emphasis.selectorLabel.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" } }, "emphasis.selectorLabel.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" } }, "emphasis.selectorLabel.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

当使用图片的时候,可以使用 widthheight 指定高宽,也可以不指定自适应。

\n

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

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

文字块边框颜色。

\n

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

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

文字块边框宽度。

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

文字块的圆角。

\n", "uiControl": { "type": "vector", "min": "0", "dims": "LT,RT, RB, LB" } }, "emphasis.selectorLabel.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

注意,文字块的 widthheight 指定的是内容高宽,不包含 padding

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

文字块的背景阴影颜色。

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

文字块的背景阴影长度。

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

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

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

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

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

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

\n

注意,文字块的 widthheight 指定的是内容高宽,不包含 padding

\n

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

\n

注意,如果不定义 rich 属性,则不能指定 widthheight

\n" }, "emphasis.selectorLabel.rich..height": { "desc": "

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

\n

注意,文字块的 widthheight 指定的是内容高宽,不包含 padding

\n

注意,如果不定义 rich 属性,则不能指定 widthheight

\n" }, "emphasis.selectorLabel.rich..textBorderColor": { "desc": "\n\n

文字本身的描边颜色。

\n

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

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

文字本身的描边宽度。

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

文字本身的阴影颜色。

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

文字本身的阴影长度。

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

文字本身的阴影 X 偏移。

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

文字本身的阴影 Y 偏移。

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

v4.4.0 开始支持

\n
\n

图例组件中的选择器按钮,目前包括全选和反选两种功能。默认不显示,用户可手动开启,也可以手动配置每个按钮的标题。

\n

使用方式如下:

\n
selector: [\n    {\n        type: 'all or inverse',\n        // 可以是任意你喜欢的 title\n        title: '全选'\n    },\n    {\n        type: 'inverse',\n        title: '反选'\n    }\n]\n\n// 或\nselector: true\n\n// 或\nselector: ['all', 'inverse']\n
\n" }, "selectorLabel": { "desc": "
\n

v4.4.0 开始支持

\n
\n

选择器按钮的文本标签样式,默认显示。

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

是否显示标签。

\n", "uiControl": { "type": "boolean", "default": "true" } }, "selectorLabel.distance": { "desc": "\n\n

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

\n

参见:label position

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

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

\n

参见:label rotation

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

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

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

文字的颜色。

\n

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

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

文字字体的风格。

\n

可选:

\n
    \n
  • 'normal'
  • \n
  • 'italic'
  • \n
  • 'oblique'
  • \n
\n", "uiControl": { "type": "enum", "default": "normal", "options": "normal,italic,oblique" } }, "selectorLabel.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" } }, "selectorLabel.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" } }, "selectorLabel.fontSize": { "desc": "\n\n

文字的字体大小。

\n", "uiControl": { "type": "number", "default": "12", "min": "1", "step": "1" } }, "selectorLabel.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" } }, "selectorLabel.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" } }, "selectorLabel.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" } }, "selectorLabel.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

当使用图片的时候,可以使用 widthheight 指定高宽,也可以不指定自适应。

\n

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

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

文字块边框颜色。

\n

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

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

文字块边框宽度。

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

文字块的圆角。

\n", "uiControl": { "type": "vector", "min": "0", "dims": "LT,RT, RB, LB" } }, "selectorLabel.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

注意,文字块的 widthheight 指定的是内容高宽,不包含 padding

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

文字块的背景阴影颜色。

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

文字块的背景阴影长度。

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

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

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

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

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

文本显示宽度。

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

文本显示高度。

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

文字本身的描边颜色。

\n

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

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

文字本身的描边宽度。

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

文字本身的阴影颜色。

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

文字本身的阴影长度。

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

文字本身的阴影 X 偏移。

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

文字本身的阴影 Y 偏移。

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

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

\n
    \n
  • 'truncate' 截断,并在末尾显示ellipsis配置的文本,默认为...
  • \n
  • 'break' 换行
  • \n
  • 'breakAll' 换行,跟'break'不同的是,在英语等拉丁文中,'breakAll'还会强制单词内换行
  • \n
\n", "uiControl": { "type": "enum", "options": "truncate,break,breakAll" } }, "selectorLabel.ellipsis": { "desc": "

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

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

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

\n
    \n
  • 'truncate' 在文本行数超出高度部分截断。
  • \n
\n" }, "selectorLabel.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" }, "selectorLabel.rich..color": { "desc": "\n\n

文字的颜色。

\n

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

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

文字字体的风格。

\n

可选:

\n
    \n
  • 'normal'
  • \n
  • 'italic'
  • \n
  • 'oblique'
  • \n
\n", "uiControl": { "type": "enum", "default": "normal", "options": "normal,italic,oblique" } }, "selectorLabel.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" } }, "selectorLabel.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" } }, "selectorLabel.rich..fontSize": { "desc": "\n\n

文字的字体大小。

\n", "uiControl": { "type": "number", "default": "12", "min": "1", "step": "1" } }, "selectorLabel.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" } }, "selectorLabel.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" } }, "selectorLabel.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" } }, "selectorLabel.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

当使用图片的时候,可以使用 widthheight 指定高宽,也可以不指定自适应。

\n

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

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

文字块边框颜色。

\n

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

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

文字块边框宽度。

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

文字块的圆角。

\n", "uiControl": { "type": "vector", "min": "0", "dims": "LT,RT, RB, LB" } }, "selectorLabel.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

注意,文字块的 widthheight 指定的是内容高宽,不包含 padding

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

文字块的背景阴影颜色。

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

文字块的背景阴影长度。

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

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

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

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

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

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

\n

注意,文字块的 widthheight 指定的是内容高宽,不包含 padding

\n

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

\n

注意,如果不定义 rich 属性,则不能指定 widthheight

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

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

\n

注意,文字块的 widthheight 指定的是内容高宽,不包含 padding

\n

注意,如果不定义 rich 属性,则不能指定 widthheight

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

文字本身的描边颜色。

\n

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

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

文字本身的描边宽度。

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

文字本身的阴影颜色。

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

文字本身的阴影长度。

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

文字本身的阴影 X 偏移。

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

文字本身的阴影 Y 偏移。

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

v4.4.0 开始支持

\n
\n

选择器的位置,可以放在图例的尾部或者头部,对应的值分别为 'end''start'。默认情况下,图例横向布局的时候,选择器放在图例的尾部;图例纵向布局的时候,选择器放在图例的头部。

\n", "uiControl": { "type": "enum", "options": "auto,start,end" } }, "selectorItemGap": { "desc": "\n\n\n\n
\n

v4.4.0 开始支持

\n
\n

选择器按钮之间的间隔。

\n", "uiControl": { "type": "number", "min": "0", "default": "7", "step": "0.5" } }, "selectorButtonGap": { "desc": "\n\n\n\n
\n

v4.4.0 开始支持

\n
\n

选择器按钮与图例组件之间的间隔。

\n", "uiControl": { "type": "number", "min": "0", "default": "10", "step": "0.5" } } }