{ "id": { "desc": "

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

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

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

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

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

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

该系列使用的坐标系,可选:

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

custom 系列需要开发者自己提供图形渲染的逻辑。这个渲染逻辑一般命名为 renderItem。例如:

\n
var option = {\n    ...,\n    series: [{\n        type: 'custom',\n        renderItem: function (params, api) {\n            var categoryIndex = api.value(0);\n            var start = api.coord([api.value(1), categoryIndex]);\n            var end = api.coord([api.value(2), categoryIndex]);\n            var height = api.size([0, 1])[1] * 0.6;\n\n            var rectShape = echarts.graphic.clipRectByRect({\n                x: start[0],\n                y: start[1] - height / 2,\n                width: end[0] - start[0],\n                height: height\n            }, {\n                x: params.coordSys.x,\n                y: params.coordSys.y,\n                width: params.coordSys.width,\n                height: params.coordSys.height\n            });\n\n            return rectShape && {\n                type: 'rect',\n                shape: rectShape,\n                style: api.style()\n            };\n        },\n        data: data\n    }]\n}\n
\n

对于 data 中的每个数据项(为方便描述,这里称为 dataItem),会调用此 renderItem 函数。

\n

renderItem 函数提供了两个参数:

\n\n

renderItem 函数须返回根据此 dataItem 绘制出的图形元素的定义信息,参见 renderItem.return

\n

一般来说,renderItem 函数的主要逻辑,是将 dataItem 里的值映射到坐标系上的图形元素。这一般需要用到 renderItem.arguments.api 中的两个函数:

\n\n

有时候还需要用到 api.size(...) 函数,表示得到坐标系上一段数值范围对应的长度。

\n

返回值中样式的设置可以使用 api.style(...) 函数,他能得到 series.itemStyle 中定义的样式信息,以及视觉映射的样式信息。也可以用这种方式覆盖这些样式信息:api.style({fill: 'green', stroke: 'yellow'})

\n" }, "renderItem.arguments": { "desc": "

renderItem 函数的参数。

\n" }, "renderItem.arguments.params": { "desc": "

renderItem 函数的第一个参数,含有:

\n
{\n    context: // {Object} 一个可供开发者暂存东西的对象。生命周期只为:当前次的渲染。\n    seriesId: // {string} 本系列 id。\n    seriesName: // {string} 本系列 name。\n    seriesIndex: // {number} 本系列 index。\n    dataIndex: // {number} 数据项的 index。\n    dataIndexInside: // {number} 数据项在当前坐标系中可见的数据的 index(即 dataZoom 当前窗口中的数据的 index)。\n    dataInsideLength: // {number} 当前坐标系中可见的数据长度(即 dataZoom 当前窗口中的数据数量)。\n    actionType: // {string} 触发此次重绘的 action 的 type。\n    coordSys: // 不同的坐标系中,coordSys 里的信息不一样,含有如下这些可能:\n    coordSys: {\n        type: 'cartesian2d',\n        x: // {number} grid rect 的 x\n        y: // {number} grid rect 的 y\n        width: // {number} grid rect 的 width\n        height: // {number} grid rect 的 height\n    },\n    coordSys: {\n        type: 'calendar',\n        x: // {number} calendar rect 的 x\n        y: // {number} calendar rect 的 y\n        width: // {number} calendar rect 的 width\n        height: // {number} calendar rect 的 height\n        cellWidth: // {number} calendar cellWidth\n        cellHeight: // {number} calendar cellHeight\n        rangeInfo: {\n            start: // calendar 日期开端\n            end: // calendar 日期结尾\n            weeks: // calendar 周数\n            dayCount: // calendar 日数\n        }\n    },\n    coordSys: {\n        type: 'geo',\n        x: // {number} geo rect 的 x\n        y: // {number} geo rect 的 y\n        width: // {number} geo rect 的 width\n        height: // {number} geo rect 的 height\n        zoom: // {number} 缩放的比率。如果没有缩放,则值为 1。例如 0.5 表示缩小了一半。\n    },\n    coordSys: {\n        type: 'polar',\n        cx: // {number} polar 的中心坐标\n        cy: // {number} polar 的中心坐标\n        r: // {number} polar 的外半径\n        r0: // {number} polar 的内半径\n    },\n    coordSys: {\n        type: 'singleAxis',\n        x: // {number} singleAxis rect 的 x\n        y: // {number} singleAxis rect 的 y\n        width: // {number} singleAxis rect 的 width\n        height: // {number} singleAxis rect 的 height\n    }\n}\n
\n

其中,关于 dataIndexdataIndexInside 的区别:

\n\n

renderItem.arguments.api 中使用的参数都是 dataIndexInside 而非 dataIndex,因为从 dataIndex 转换成 dataIndexInside 需要时间开销。

\n" }, "renderItem.arguments.api": { "desc": "

renderItem 函数的第二个参数。

\n" }, "renderItem.arguments.api.value": { "desc": "

得到给定维度的数据值。

\n
@param {number} dimension 指定的维度(维度从 0 开始计数)。\n@param {number} [dataIndexInside] 一般不用传,默认就是当前数据项的 dataIndexInside。\n@return {number} 给定维度上的值。\n
" }, "renderItem.arguments.api.coord": { "desc": "

将数据值映射到坐标系上。

\n
@param {Array.<number>} data 数据值。\n@return {Array.<number>} 画布上的点的坐标,至少包含:[x, y]\n        对于polar坐标系,还会包含其他信息:\n        polar: [x, y, radius, angle]\n
" }, "renderItem.arguments.api.size": { "desc": "

给定数据范围,映射到坐标系上后的长度。

\n

例如,cartesian2d中,api.size([2, 4]) 返回 [12.4, 55],表示 x 轴数据范围为 2 映射得到长度是 12.4,y 轴数据范围为 4 时应设得到长度为 55

\n

在一些坐标系中,如极坐标系(polar)或者有 log 数轴的坐标系,不同点的长度是不同的,所以需要第二个参数,指定获取长度的点。

\n
@param {Array.<number>} dataSize 数据范围。\n@param {Array.<number>} dataItem 获取长度的点。\n@return {Array.<number>} 画布上的长度\n
" }, "renderItem.arguments.api.style": { "desc": "

能得到 series.itemStyle 中定义的样式信息和视觉映射得到的样式信息,可直接用于绘制图元。也可以用这种方式覆盖这些样式信息:api.style({fill: 'green', stroke: 'yellow'})

\n
@param {Object} [extra] 额外指定的样式信息。\n@param {number} [dataIndexInside] 一般不用传,默认就是当前数据项的 dataIndexInside。\n@return {Object} 直接用于绘制图元的样式信息。\n
" }, "renderItem.arguments.api.styleEmphasis": { "desc": "

能得到 series.itemStyle.emphasis 中定义的样式信息和视觉映射的样式信息,可直接用于绘制图元。也可以用这种方式覆盖这些样式信息:api.style({fill: 'green', stroke: 'yellow'})

\n
@param {Object} [extra] 额外指定的样式信息。\n@param {number} [dataIndexInside] 一般不用传,默认就是当前数据项的 dataIndexInside。\n@return {Object} 直接用于绘制图元的样式信息。\n
" }, "renderItem.arguments.api.visual": { "desc": "

得到视觉映射的样式信息。比较少被使用。

\n
@param {string} visualType 'color', 'symbol', 'symbolSize', ...\n@param {number} [dataIndexInside] 一般不用传,默认就是当前数据项的 dataIndexInside。\n@return {string|number} 视觉映射的样式值。\n
" }, "renderItem.arguments.api.barLayout": { "desc": "

当需要采用 barLayout 的时候,比如向柱状图上附加些东西,可以用这个方法得到 layout 信息。\n参见 例子

\n
@param {Object} opt\n@param {number} opt.count 每个簇有多少个 bar。\n@param {number|string} [opt.barWidth] bar 宽度。\n        可以是绝对值例如 `40` 或者百分数例如 `'60%'`。\n        百分数基于自动计算出的每一类目的宽度。\n@param {number|string} [opt.barMaxWidth] bar 最大宽度。\n        可以是绝对值例如 `40` 或者百分数例如 `'60%'`。\n        百分数基于自动计算出的每一类目的宽度。\n        比 `opt.barWidth` 优先级高。\n@param {number|string} [opt.barMinWidth] bar 最小宽度。\n        可以是绝对值例如 `40` 或者百分数例如 `'60%'`。\n        百分数基于自动计算出的每一类目的宽度。\n        比 `opt.barWidth` 优先级高。\n@param {number} [opt.barGap] 每个簇的 bar 之间的宽度。\n@param {number} [opt.barCategoryGap] 不同簇间的宽度。\n@return {Array.<Object>} [{\n        width: number bar 的宽度。\n        offset: number bar 的偏移量,以bar最左为基准。\n        offsetCenter: number bar 的偏移量,以bar中心为基准。\n    }, ...]\n
" }, "renderItem.arguments.api.currentSeriesIndices": { "desc": "

得到系列的 当前index。注意这个 index 不同于系列定义时的 index。这个 index 是当 legend 组件进行了系列筛选后,剩余的系列排列后的 index。

\n
@return {number}\n
" }, "renderItem.arguments.api.font": { "desc": "

得到可以直接进行样式设置的文字信息字符串。

\n
@param {Object} opt\n@param {string} [opt.fontStyle]\n@param {number} [opt.fontWeight]\n@param {number} [opt.fontSize]\n@param {string} [opt.fontFamily]\n@return {string} font 字符串。\n
" }, "renderItem.arguments.api.getWidth": { "desc": "
@return {number} echarts 容器的宽度。\n
" }, "renderItem.arguments.api.getHeight": { "desc": "
@return {number} echarts 容器的高度。\n
" }, "renderItem.arguments.api.getZr": { "desc": "
@return {module:zrender} zrender 实例。\n
" }, "renderItem.arguments.api.getDevicePixelRatio": { "desc": "
@return {number} 得到当前 devicePixelRatio。\n
" }, "renderItem.return": { "desc": "

图形元素。每个图形元素是一个 object。详细信息参见:graphic。(width\\height\\top\\bottom 不支持)

\n

如果什么都不渲染,可以不返回任何东西。

\n

例如:

\n
// 单独一个矩形\n{\n    type: 'rect',\n    shape: {\n        x: x, y: y, width: width, height: height\n    },\n    style: api.style()\n}\n
\n
// 一组图形元素\n{\n    type: 'group',\n    // 如果 diffChildrenByName 设为 true,则会使用 child.name 进行 diff,\n    // 从而能有更好的过度动画,但是降低性能。缺省为 false。\n    // diffChildrenByName: true,\n    children: [{\n        type: 'circle',\n        shape: {\n            cx: cx, cy: cy, r: r\n        },\n        style: api.style()\n    }, {\n        type: 'line',\n        shape: {\n            x1: x1, y1: y1, x2: x2, y2: y2\n        },\n        style: api.style()\n    }]\n}\n
\n" }, "renderItem.return_group": { "desc": "

group 是唯一的可以有子节点的容器。group 可以用来整体定位一组图形元素。

\n" }, "renderItem.return_group.type": { "desc": "

用 setOption 首次设定图形元素时必须指定。\n可取值:

\n

image,\ntext,\ncircle,\nsector,\nring,\npolygon,\npolyline,\nrect,\nline,\nbezierCurve,\narc,\ngroup,

\n" }, "renderItem.return_group.id": { "desc": "

id 用于在更新或删除图形元素时指定更新哪个图形元素,如果不需要用可以忽略。

\n" }, "renderItem.return_group.x": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_group.y": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_group.rotation": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_group.scaleX": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_group.scaleY": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_group.originX": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_group.originY": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_group.transition": { "desc": "

可以指定一个属性名,或者一组属性名。被指定的属性值变化时,会开启过渡动画。

\n

属性只可以是:

\n\n

当 transition 没有指定时,'x''y' 会默认开启过渡动画。如果想禁用这种默认,可设定:

\n
transition: [] // 一个空数组\n
\n

看这个 例子

\n" }, "renderItem.return_group.z2": { "desc": "

用于决定图形元素的覆盖关系。

\n" }, "renderItem.return_group.name": { "desc": "

参见 diffChildrenByName

\n" }, "renderItem.return_group.info": { "desc": "

用户定义的任意数据,可以在 event listener 中访问,如:

\n
chart.on('click', function (params) {\n    console.log(params.info);\n});\n
\n" }, "renderItem.return_group.silent": { "desc": "

是否不响应鼠标以及触摸事件。

\n" }, "renderItem.return_group.invisible": { "desc": "

节点是否可见。

\n" }, "renderItem.return_group.ignore": { "desc": "

节点是否完全被忽略(既不渲染,也不响应事件)。

\n" }, "renderItem.return_group.width": { "desc": "

用于描述此 group 的宽。

\n

这个宽只用于给子节点定位。

\n

即便当宽度为零的时候,子节点也可以使用 left: 'center' 相对于父节点水平居中。

\n" }, "renderItem.return_group.height": { "desc": "

用于描述此 group 的高。

\n

这个高只用于给子节点定位。

\n

即便当高度为零的时候,子节点也可以使用 top: 'middle' 相对于父节点垂直居中。

\n" }, "renderItem.return_group.diffChildrenByName": { "desc": "

自定义系列 中,当 diffChildrenByName: true 时,对于 renderItem 返回值中的每一个 group,会根据其 children 中每个图形元素的 name 属性进行 "diff"。在这里,"diff" 的意思是,重绘的时候,在已存在的图形元素和新的图形元素之间建立对应关系(依据 name 是否相同),从如果数据有更新,能够形成的过渡动画。

\n

但是注意,这会有性能开销。如果数据量较大,不要开启这个功能。

\n" }, "renderItem.return_group.children": { "desc": "

子节点列表,其中项都是一个图形元素定义。

\n" }, "renderItem.return_path": { "desc": "

可使用 SVG PathData 做路径。\n可以用来画图标,或者其他各种图形,因为可以很便捷得缩放以适应给定尺寸。

\n

参见例子:\niconsshapes

\n

关于制定尺寸、拉伸还是平铺,参见 layout

\n" }, "renderItem.return_path.type": { "desc": "

用 setOption 首次设定图形元素时必须指定。\n可取值:

\n

image,\ntext,\ncircle,\nsector,\nring,\npolygon,\npolyline,\nrect,\nline,\nbezierCurve,\narc,\ngroup,

\n" }, "renderItem.return_path.id": { "desc": "

id 用于在更新或删除图形元素时指定更新哪个图形元素,如果不需要用可以忽略。

\n" }, "renderItem.return_path.x": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_path.y": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_path.rotation": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_path.scaleX": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_path.scaleY": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_path.originX": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_path.originY": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_path.transition": { "desc": "

可以指定一个属性名,或者一组属性名。被指定的属性值变化时,会开启过渡动画。

\n

属性只可以是:

\n\n

当 transition 没有指定时,'x''y' 会默认开启过渡动画。如果想禁用这种默认,可设定:

\n
transition: [] // 一个空数组\n
\n

看这个 例子

\n" }, "renderItem.return_path.morph": { "desc": "

是否开启形变动画。

\n

什么情况下会展示出形变动画?

\n

morph 设置为 true 后,还需按照如下规则,来形成形变动画:

\n

每次走渲染流程是,自定义系列会自动比较(diff)新旧数据。在这个 diff 过程中,如果发现,一组旧数据项和一组新数据项的值相等(相等的规则是,name 相同,或者 transition 所指定的维度上的值相同),那么我们就找到了能形成形变动画的一对候选集。

\n

在这组旧数据和这组新数据间,可能产生三种形变动画:

\n\n

注:我们并不支持多对多(many-to-many)的情况。

\n

然后,自定义系列,会在新旧组中,寻找声明为 morph: true 的图形元素,并分配他们形成真正的一一映射的形变,或者分裂(separating),或者合并(combining)。

\n

参见示例:custom-one-to-one-morph 和\ncustom-combine-separate-morph

\n" }, "renderItem.return_path.z2": { "desc": "

用于决定图形元素的覆盖关系。

\n" }, "renderItem.return_path.name": { "desc": "

参见 diffChildrenByName

\n" }, "renderItem.return_path.info": { "desc": "

用户定义的任意数据,可以在 event listener 中访问,如:

\n
chart.on('click', function (params) {\n    console.log(params.info);\n});\n
\n" }, "renderItem.return_path.silent": { "desc": "

是否不响应鼠标以及触摸事件。

\n" }, "renderItem.return_path.invisible": { "desc": "

节点是否可见。

\n" }, "renderItem.return_path.ignore": { "desc": "

节点是否完全被忽略(既不渲染,也不响应事件)。

\n" }, "renderItem.return_path.shape.pathData": { "desc": "

SVG PathData

\n

例如:'M0,0 L0,-20 L30,-20 C42,-20 38,-1 50,-1 L70,-1 L70,0 Z'

\n

如果指定了 widthheightxy,则会根据他们定义的矩形,缩放 PathData。如果没有指定这些,就不会缩放。

\n

可使用 layout 指定缩放策略。

\n

参见例子:\niconsshapes

\n" }, "renderItem.return_path.shape.d": { "desc": "

pathData,别名。

\n" }, "renderItem.return_path.shape.layout": { "desc": "

如果指定了 widthheightxy,则会根据他们定义的矩形,缩放 PathData。

\n

layout 用于指定缩放策略。

\n

可选值:

\n\n" }, "renderItem.return_path.shape.x": { "desc": "

图形元素的左上角在父节点坐标系(以父节点左上角为原点)中的横坐标值。

\n" }, "renderItem.return_path.shape.y": { "desc": "

图形元素的左上角在父节点坐标系(以父节点左上角为原点)中的纵坐标值。

\n" }, "renderItem.return_path.shape.width": { "desc": "

图形元素的宽度。

\n" }, "renderItem.return_path.shape.height": { "desc": "

图形元素的高度。

\n" }, "renderItem.return_path.shape.transition": { "desc": "

可以是一个属性名,或者一组属性名。\n被指定的属性,在其指发生变化时,会开启过渡动画。\n只可以指定本 shape 下的属性。

\n

例如:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        shape: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n            // 这两个属性会开启过渡动画。\n            transition: ['mmm', 'ppp']\n        }\n    };\n}\n
\n

我们这样可以指定 shape 下所有属性开启过渡动画:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        shape: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n        },\n        // `shape` 下所有属性开启过渡动画。\n        transition: 'shape',\n    };\n}\n
\n" }, "renderItem.return_path.style": { "desc": "

注:关于图形元素中更多的样式设置(例如 富文本标签),参见 zrender/graphic/Displayable 中的 style 相关属性。

\n

注意,这里图形元素的样式属性名称直接源于 zrender,和 echarts labelecharts itemStyle 等处同样含义的样式属性名称或有不同。例如,有如下对应:

\n\n" }, "renderItem.return_path.style.fill": { "desc": "

填充色。

\n" }, "renderItem.return_path.style.stroke": { "desc": "

笔画颜色。

\n" }, "renderItem.return_path.style.lineWidth": { "desc": "

笔画宽度。

\n" }, "renderItem.return_path.style.shadowBlur": { "desc": "

阴影宽度。

\n" }, "renderItem.return_path.style.shadowOffsetX": { "desc": "

阴影 X 方向偏移。

\n" }, "renderItem.return_path.style.shadowOffsetY": { "desc": "

阴影 Y 方向偏移。

\n" }, "renderItem.return_path.style.shadowColor": { "desc": "

阴影颜色。

\n" }, "renderItem.return_path.style.transition": { "desc": "

可以是一个属性名,或者一组属性名。\n被指定的属性,在其指发生变化时,会开启过渡动画。\n只可以指定本 style 下的属性。

\n

例如:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n            // 这两个属性会开启过渡动画。\n            transition: ['mmm', 'ppp']\n        }\n    };\n}\n
\n

我们这样可以指定 style 下所有属性开启过渡动画:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n        },\n        // `style` 下所有属性开启过渡动画。\n        transition: 'style',\n    };\n}\n
\n" }, "renderItem.return_path.emphasis": { "desc": "

图形元素的高亮状态

\n" }, "renderItem.return_path.emphasis.focus": { "desc": "
\n

v5.0.0 开始支持

\n
\n

在高亮图形时,是否淡出其它数据的图形已达到聚焦的效果。支持如下配置:

\n\n" }, "renderItem.return_path.emphasis.blurScope": { "desc": "
\n

v5.0.0 开始支持

\n
\n

在开启focus的时候,可以通过blurScope配置淡出的范围。支持如下配置

\n\n" }, "renderItem.return_path.emphasis.style": { "desc": "

结构同 style

\n" }, "renderItem.return_path.blur": { "desc": "
\n

v5.0.0 开始支持

\n
\n

图形元素的淡出状态,配置focus时有效。

\n" }, "renderItem.return_path.blur.style": { "desc": "

结构同 style

\n" }, "renderItem.return_path.select": { "desc": "
\n

v5.0.0 开始支持

\n
\n

图形元素的选中状态,配置自定义系列的 selectedMode 时有效。

\n" }, "renderItem.return_path.select.style": { "desc": "

结构同 style

\n" }, "renderItem.return_image.type": { "desc": "

用 setOption 首次设定图形元素时必须指定。\n可取值:

\n

image,\ntext,\ncircle,\nsector,\nring,\npolygon,\npolyline,\nrect,\nline,\nbezierCurve,\narc,\ngroup,

\n" }, "renderItem.return_image.id": { "desc": "

id 用于在更新或删除图形元素时指定更新哪个图形元素,如果不需要用可以忽略。

\n" }, "renderItem.return_image.x": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_image.y": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_image.rotation": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_image.scaleX": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_image.scaleY": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_image.originX": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_image.originY": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_image.transition": { "desc": "

可以指定一个属性名,或者一组属性名。被指定的属性值变化时,会开启过渡动画。

\n

属性只可以是:

\n\n

当 transition 没有指定时,'x''y' 会默认开启过渡动画。如果想禁用这种默认,可设定:

\n
transition: [] // 一个空数组\n
\n

看这个 例子

\n" }, "renderItem.return_image.z2": { "desc": "

用于决定图形元素的覆盖关系。

\n" }, "renderItem.return_image.name": { "desc": "

参见 diffChildrenByName

\n" }, "renderItem.return_image.info": { "desc": "

用户定义的任意数据,可以在 event listener 中访问,如:

\n
chart.on('click', function (params) {\n    console.log(params.info);\n});\n
\n" }, "renderItem.return_image.silent": { "desc": "

是否不响应鼠标以及触摸事件。

\n" }, "renderItem.return_image.invisible": { "desc": "

节点是否可见。

\n" }, "renderItem.return_image.ignore": { "desc": "

节点是否完全被忽略(既不渲染,也不响应事件)。

\n" }, "renderItem.return_image.style.image": { "desc": "

图片的内容,可以是图片的 URL,也可以是 dataURI.

\n" }, "renderItem.return_image.style.x": { "desc": "

图形元素的左上角在父节点坐标系(以父节点左上角为原点)中的横坐标值。

\n" }, "renderItem.return_image.style.y": { "desc": "

图形元素的左上角在父节点坐标系(以父节点左上角为原点)中的纵坐标值。

\n" }, "renderItem.return_image.style.width": { "desc": "

图形元素的宽度。

\n" }, "renderItem.return_image.style.height": { "desc": "

图形元素的高度。

\n

注:关于图形元素中更多的样式设置(例如 富文本标签),参见 zrender/graphic/Displayable 中的 style 相关属性。

\n

注意,这里图形元素的样式属性名称直接源于 zrender,和 echarts labelecharts itemStyle 等处同样含义的样式属性名称或有不同。例如,有如下对应:

\n\n" }, "renderItem.return_image.style.fill": { "desc": "

填充色。

\n" }, "renderItem.return_image.style.stroke": { "desc": "

笔画颜色。

\n" }, "renderItem.return_image.style.lineWidth": { "desc": "

笔画宽度。

\n" }, "renderItem.return_image.style.shadowBlur": { "desc": "

阴影宽度。

\n" }, "renderItem.return_image.style.shadowOffsetX": { "desc": "

阴影 X 方向偏移。

\n" }, "renderItem.return_image.style.shadowOffsetY": { "desc": "

阴影 Y 方向偏移。

\n" }, "renderItem.return_image.style.shadowColor": { "desc": "

阴影颜色。

\n" }, "renderItem.return_image.style.transition": { "desc": "

可以是一个属性名,或者一组属性名。\n被指定的属性,在其指发生变化时,会开启过渡动画。\n只可以指定本 style 下的属性。

\n

例如:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n            // 这两个属性会开启过渡动画。\n            transition: ['mmm', 'ppp']\n        }\n    };\n}\n
\n

我们这样可以指定 style 下所有属性开启过渡动画:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n        },\n        // `style` 下所有属性开启过渡动画。\n        transition: 'style',\n    };\n}\n
\n" }, "renderItem.return_image.emphasis": { "desc": "

图形元素的高亮状态

\n" }, "renderItem.return_image.emphasis.focus": { "desc": "
\n

v5.0.0 开始支持

\n
\n

在高亮图形时,是否淡出其它数据的图形已达到聚焦的效果。支持如下配置:

\n\n" }, "renderItem.return_image.emphasis.blurScope": { "desc": "
\n

v5.0.0 开始支持

\n
\n

在开启focus的时候,可以通过blurScope配置淡出的范围。支持如下配置

\n\n" }, "renderItem.return_image.emphasis.style": { "desc": "

结构同 style

\n" }, "renderItem.return_image.blur": { "desc": "
\n

v5.0.0 开始支持

\n
\n

图形元素的淡出状态,配置focus时有效。

\n" }, "renderItem.return_image.blur.style": { "desc": "

结构同 style

\n" }, "renderItem.return_image.select": { "desc": "
\n

v5.0.0 开始支持

\n
\n

图形元素的选中状态,配置自定义系列的 selectedMode 时有效。

\n" }, "renderItem.return_image.select.style": { "desc": "

结构同 style

\n" }, "renderItem.return_text": { "desc": "

文本块。

\n" }, "renderItem.return_text.type": { "desc": "

用 setOption 首次设定图形元素时必须指定。\n可取值:

\n

image,\ntext,\ncircle,\nsector,\nring,\npolygon,\npolyline,\nrect,\nline,\nbezierCurve,\narc,\ngroup,

\n" }, "renderItem.return_text.id": { "desc": "

id 用于在更新或删除图形元素时指定更新哪个图形元素,如果不需要用可以忽略。

\n" }, "renderItem.return_text.x": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_text.y": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_text.rotation": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_text.scaleX": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_text.scaleY": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_text.originX": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_text.originY": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_text.transition": { "desc": "

可以指定一个属性名,或者一组属性名。被指定的属性值变化时,会开启过渡动画。

\n

属性只可以是:

\n\n

当 transition 没有指定时,'x''y' 会默认开启过渡动画。如果想禁用这种默认,可设定:

\n
transition: [] // 一个空数组\n
\n

看这个 例子

\n" }, "renderItem.return_text.z2": { "desc": "

用于决定图形元素的覆盖关系。

\n" }, "renderItem.return_text.name": { "desc": "

参见 diffChildrenByName

\n" }, "renderItem.return_text.info": { "desc": "

用户定义的任意数据,可以在 event listener 中访问,如:

\n
chart.on('click', function (params) {\n    console.log(params.info);\n});\n
\n" }, "renderItem.return_text.silent": { "desc": "

是否不响应鼠标以及触摸事件。

\n" }, "renderItem.return_text.invisible": { "desc": "

节点是否可见。

\n" }, "renderItem.return_text.ignore": { "desc": "

节点是否完全被忽略(既不渲染,也不响应事件)。

\n" }, "renderItem.return_text.style.text": { "desc": "

文本块文字。可以使用 \\n 来换行。

\n" }, "renderItem.return_text.style.x": { "desc": "

图形元素的左上角在父节点坐标系(以父节点左上角为原点)中的横坐标值。

\n" }, "renderItem.return_text.style.y": { "desc": "

图形元素的左上角在父节点坐标系(以父节点左上角为原点)中的纵坐标值。

\n" }, "renderItem.return_text.style.font": { "desc": "

字体大小、字体类型、粗细、字体样式。格式参见 css font

\n

例如:

\n
// size | family\nfont: '2em "STHeiti", sans-serif'\n\n// style | weight | size | family\nfont: 'italic bolder 16px cursive'\n\n// weight | size | family\nfont: 'bolder 2em "Microsoft YaHei", sans-serif'\n
" }, "renderItem.return_text.style.textAlign": { "desc": "

水平对齐方式,取值:'left', 'center', 'right'

\n

如果为 'left',表示文本最左端在 x 值上。如果为 'right',表示文本最右端在 x 值上。

\n" }, "renderItem.return_text.style.textVerticalAlign": { "desc": "

垂直对齐方式,取值:'top', 'middle', 'bottom'

\n

注:关于图形元素中更多的样式设置(例如 富文本标签),参见 zrender/graphic/Displayable 中的 style 相关属性。

\n

注意,这里图形元素的样式属性名称直接源于 zrender,和 echarts labelecharts itemStyle 等处同样含义的样式属性名称或有不同。例如,有如下对应:

\n\n" }, "renderItem.return_text.style.fill": { "desc": "

填充色。

\n" }, "renderItem.return_text.style.stroke": { "desc": "

笔画颜色。

\n" }, "renderItem.return_text.style.lineWidth": { "desc": "

笔画宽度。

\n" }, "renderItem.return_text.style.shadowBlur": { "desc": "

阴影宽度。

\n" }, "renderItem.return_text.style.shadowOffsetX": { "desc": "

阴影 X 方向偏移。

\n" }, "renderItem.return_text.style.shadowOffsetY": { "desc": "

阴影 Y 方向偏移。

\n" }, "renderItem.return_text.style.shadowColor": { "desc": "

阴影颜色。

\n" }, "renderItem.return_text.style.transition": { "desc": "

可以是一个属性名,或者一组属性名。\n被指定的属性,在其指发生变化时,会开启过渡动画。\n只可以指定本 style 下的属性。

\n

例如:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n            // 这两个属性会开启过渡动画。\n            transition: ['mmm', 'ppp']\n        }\n    };\n}\n
\n

我们这样可以指定 style 下所有属性开启过渡动画:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n        },\n        // `style` 下所有属性开启过渡动画。\n        transition: 'style',\n    };\n}\n
\n" }, "renderItem.return_text.emphasis": { "desc": "

图形元素的高亮状态

\n" }, "renderItem.return_text.emphasis.focus": { "desc": "
\n

v5.0.0 开始支持

\n
\n

在高亮图形时,是否淡出其它数据的图形已达到聚焦的效果。支持如下配置:

\n\n" }, "renderItem.return_text.emphasis.blurScope": { "desc": "
\n

v5.0.0 开始支持

\n
\n

在开启focus的时候,可以通过blurScope配置淡出的范围。支持如下配置

\n\n" }, "renderItem.return_text.emphasis.style": { "desc": "

结构同 style

\n" }, "renderItem.return_text.blur": { "desc": "
\n

v5.0.0 开始支持

\n
\n

图形元素的淡出状态,配置focus时有效。

\n" }, "renderItem.return_text.blur.style": { "desc": "

结构同 style

\n" }, "renderItem.return_text.select": { "desc": "
\n

v5.0.0 开始支持

\n
\n

图形元素的选中状态,配置自定义系列的 selectedMode 时有效。

\n" }, "renderItem.return_text.select.style": { "desc": "

结构同 style

\n" }, "renderItem.return_rect": { "desc": "

矩形。

\n" }, "renderItem.return_rect.type": { "desc": "

用 setOption 首次设定图形元素时必须指定。\n可取值:

\n

image,\ntext,\ncircle,\nsector,\nring,\npolygon,\npolyline,\nrect,\nline,\nbezierCurve,\narc,\ngroup,

\n" }, "renderItem.return_rect.id": { "desc": "

id 用于在更新或删除图形元素时指定更新哪个图形元素,如果不需要用可以忽略。

\n" }, "renderItem.return_rect.x": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_rect.y": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_rect.rotation": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_rect.scaleX": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_rect.scaleY": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_rect.originX": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_rect.originY": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_rect.transition": { "desc": "

可以指定一个属性名,或者一组属性名。被指定的属性值变化时,会开启过渡动画。

\n

属性只可以是:

\n\n

当 transition 没有指定时,'x''y' 会默认开启过渡动画。如果想禁用这种默认,可设定:

\n
transition: [] // 一个空数组\n
\n

看这个 例子

\n" }, "renderItem.return_rect.morph": { "desc": "

是否开启形变动画。

\n

什么情况下会展示出形变动画?

\n

morph 设置为 true 后,还需按照如下规则,来形成形变动画:

\n

每次走渲染流程是,自定义系列会自动比较(diff)新旧数据。在这个 diff 过程中,如果发现,一组旧数据项和一组新数据项的值相等(相等的规则是,name 相同,或者 transition 所指定的维度上的值相同),那么我们就找到了能形成形变动画的一对候选集。

\n

在这组旧数据和这组新数据间,可能产生三种形变动画:

\n\n

注:我们并不支持多对多(many-to-many)的情况。

\n

然后,自定义系列,会在新旧组中,寻找声明为 morph: true 的图形元素,并分配他们形成真正的一一映射的形变,或者分裂(separating),或者合并(combining)。

\n

参见示例:custom-one-to-one-morph 和\ncustom-combine-separate-morph

\n" }, "renderItem.return_rect.z2": { "desc": "

用于决定图形元素的覆盖关系。

\n" }, "renderItem.return_rect.name": { "desc": "

参见 diffChildrenByName

\n" }, "renderItem.return_rect.info": { "desc": "

用户定义的任意数据,可以在 event listener 中访问,如:

\n
chart.on('click', function (params) {\n    console.log(params.info);\n});\n
\n" }, "renderItem.return_rect.silent": { "desc": "

是否不响应鼠标以及触摸事件。

\n" }, "renderItem.return_rect.invisible": { "desc": "

节点是否可见。

\n" }, "renderItem.return_rect.ignore": { "desc": "

节点是否完全被忽略(既不渲染,也不响应事件)。

\n" }, "renderItem.return_rect.shape.x": { "desc": "

图形元素的左上角在父节点坐标系(以父节点左上角为原点)中的横坐标值。

\n" }, "renderItem.return_rect.shape.y": { "desc": "

图形元素的左上角在父节点坐标系(以父节点左上角为原点)中的纵坐标值。

\n" }, "renderItem.return_rect.shape.width": { "desc": "

图形元素的宽度。

\n" }, "renderItem.return_rect.shape.height": { "desc": "

图形元素的高度。

\n" }, "renderItem.return_rect.shape.r": { "desc": "

可以用于设置圆角矩形。r: [r1, r2, r3, r4],\n左上、右上、右下、左下角的半径依次为r1、r2、r3、r4。

\n

可以缩写,例如:

\n\n" }, "renderItem.return_rect.shape.transition": { "desc": "

可以是一个属性名,或者一组属性名。\n被指定的属性,在其指发生变化时,会开启过渡动画。\n只可以指定本 shape 下的属性。

\n

例如:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        shape: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n            // 这两个属性会开启过渡动画。\n            transition: ['mmm', 'ppp']\n        }\n    };\n}\n
\n

我们这样可以指定 shape 下所有属性开启过渡动画:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        shape: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n        },\n        // `shape` 下所有属性开启过渡动画。\n        transition: 'shape',\n    };\n}\n
\n" }, "renderItem.return_rect.style": { "desc": "

注:关于图形元素中更多的样式设置(例如 富文本标签),参见 zrender/graphic/Displayable 中的 style 相关属性。

\n

注意,这里图形元素的样式属性名称直接源于 zrender,和 echarts labelecharts itemStyle 等处同样含义的样式属性名称或有不同。例如,有如下对应:

\n\n" }, "renderItem.return_rect.style.fill": { "desc": "

填充色。

\n" }, "renderItem.return_rect.style.stroke": { "desc": "

笔画颜色。

\n" }, "renderItem.return_rect.style.lineWidth": { "desc": "

笔画宽度。

\n" }, "renderItem.return_rect.style.shadowBlur": { "desc": "

阴影宽度。

\n" }, "renderItem.return_rect.style.shadowOffsetX": { "desc": "

阴影 X 方向偏移。

\n" }, "renderItem.return_rect.style.shadowOffsetY": { "desc": "

阴影 Y 方向偏移。

\n" }, "renderItem.return_rect.style.shadowColor": { "desc": "

阴影颜色。

\n" }, "renderItem.return_rect.style.transition": { "desc": "

可以是一个属性名,或者一组属性名。\n被指定的属性,在其指发生变化时,会开启过渡动画。\n只可以指定本 style 下的属性。

\n

例如:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n            // 这两个属性会开启过渡动画。\n            transition: ['mmm', 'ppp']\n        }\n    };\n}\n
\n

我们这样可以指定 style 下所有属性开启过渡动画:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n        },\n        // `style` 下所有属性开启过渡动画。\n        transition: 'style',\n    };\n}\n
\n" }, "renderItem.return_rect.emphasis": { "desc": "

图形元素的高亮状态

\n" }, "renderItem.return_rect.emphasis.focus": { "desc": "
\n

v5.0.0 开始支持

\n
\n

在高亮图形时,是否淡出其它数据的图形已达到聚焦的效果。支持如下配置:

\n\n" }, "renderItem.return_rect.emphasis.blurScope": { "desc": "
\n

v5.0.0 开始支持

\n
\n

在开启focus的时候,可以通过blurScope配置淡出的范围。支持如下配置

\n\n" }, "renderItem.return_rect.emphasis.style": { "desc": "

结构同 style

\n" }, "renderItem.return_rect.blur": { "desc": "
\n

v5.0.0 开始支持

\n
\n

图形元素的淡出状态,配置focus时有效。

\n" }, "renderItem.return_rect.blur.style": { "desc": "

结构同 style

\n" }, "renderItem.return_rect.select": { "desc": "
\n

v5.0.0 开始支持

\n
\n

图形元素的选中状态,配置自定义系列的 selectedMode 时有效。

\n" }, "renderItem.return_rect.select.style": { "desc": "

结构同 style

\n" }, "renderItem.return_circle": { "desc": "

圆。

\n" }, "renderItem.return_circle.type": { "desc": "

用 setOption 首次设定图形元素时必须指定。\n可取值:

\n

image,\ntext,\ncircle,\nsector,\nring,\npolygon,\npolyline,\nrect,\nline,\nbezierCurve,\narc,\ngroup,

\n" }, "renderItem.return_circle.id": { "desc": "

id 用于在更新或删除图形元素时指定更新哪个图形元素,如果不需要用可以忽略。

\n" }, "renderItem.return_circle.x": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_circle.y": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_circle.rotation": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_circle.scaleX": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_circle.scaleY": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_circle.originX": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_circle.originY": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_circle.transition": { "desc": "

可以指定一个属性名,或者一组属性名。被指定的属性值变化时,会开启过渡动画。

\n

属性只可以是:

\n\n

当 transition 没有指定时,'x''y' 会默认开启过渡动画。如果想禁用这种默认,可设定:

\n
transition: [] // 一个空数组\n
\n

看这个 例子

\n" }, "renderItem.return_circle.morph": { "desc": "

是否开启形变动画。

\n

什么情况下会展示出形变动画?

\n

morph 设置为 true 后,还需按照如下规则,来形成形变动画:

\n

每次走渲染流程是,自定义系列会自动比较(diff)新旧数据。在这个 diff 过程中,如果发现,一组旧数据项和一组新数据项的值相等(相等的规则是,name 相同,或者 transition 所指定的维度上的值相同),那么我们就找到了能形成形变动画的一对候选集。

\n

在这组旧数据和这组新数据间,可能产生三种形变动画:

\n\n

注:我们并不支持多对多(many-to-many)的情况。

\n

然后,自定义系列,会在新旧组中,寻找声明为 morph: true 的图形元素,并分配他们形成真正的一一映射的形变,或者分裂(separating),或者合并(combining)。

\n

参见示例:custom-one-to-one-morph 和\ncustom-combine-separate-morph

\n" }, "renderItem.return_circle.z2": { "desc": "

用于决定图形元素的覆盖关系。

\n" }, "renderItem.return_circle.name": { "desc": "

参见 diffChildrenByName

\n" }, "renderItem.return_circle.info": { "desc": "

用户定义的任意数据,可以在 event listener 中访问,如:

\n
chart.on('click', function (params) {\n    console.log(params.info);\n});\n
\n" }, "renderItem.return_circle.silent": { "desc": "

是否不响应鼠标以及触摸事件。

\n" }, "renderItem.return_circle.invisible": { "desc": "

节点是否可见。

\n" }, "renderItem.return_circle.ignore": { "desc": "

节点是否完全被忽略(既不渲染,也不响应事件)。

\n" }, "renderItem.return_circle.shape.cx": { "desc": "

图形元素的中心在父节点坐标系(以父节点左上角为原点)中的横坐标值。

\n" }, "renderItem.return_circle.shape.cy": { "desc": "

图形元素的中心在父节点坐标系(以父节点左上角为原点)中的纵坐标值。

\n" }, "renderItem.return_circle.shape.r": { "desc": "

外半径。

\n" }, "renderItem.return_circle.shape.transition": { "desc": "

可以是一个属性名,或者一组属性名。\n被指定的属性,在其指发生变化时,会开启过渡动画。\n只可以指定本 shape 下的属性。

\n

例如:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        shape: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n            // 这两个属性会开启过渡动画。\n            transition: ['mmm', 'ppp']\n        }\n    };\n}\n
\n

我们这样可以指定 shape 下所有属性开启过渡动画:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        shape: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n        },\n        // `shape` 下所有属性开启过渡动画。\n        transition: 'shape',\n    };\n}\n
\n" }, "renderItem.return_circle.style": { "desc": "

注:关于图形元素中更多的样式设置(例如 富文本标签),参见 zrender/graphic/Displayable 中的 style 相关属性。

\n

注意,这里图形元素的样式属性名称直接源于 zrender,和 echarts labelecharts itemStyle 等处同样含义的样式属性名称或有不同。例如,有如下对应:

\n\n" }, "renderItem.return_circle.style.fill": { "desc": "

填充色。

\n" }, "renderItem.return_circle.style.stroke": { "desc": "

笔画颜色。

\n" }, "renderItem.return_circle.style.lineWidth": { "desc": "

笔画宽度。

\n" }, "renderItem.return_circle.style.shadowBlur": { "desc": "

阴影宽度。

\n" }, "renderItem.return_circle.style.shadowOffsetX": { "desc": "

阴影 X 方向偏移。

\n" }, "renderItem.return_circle.style.shadowOffsetY": { "desc": "

阴影 Y 方向偏移。

\n" }, "renderItem.return_circle.style.shadowColor": { "desc": "

阴影颜色。

\n" }, "renderItem.return_circle.style.transition": { "desc": "

可以是一个属性名,或者一组属性名。\n被指定的属性,在其指发生变化时,会开启过渡动画。\n只可以指定本 style 下的属性。

\n

例如:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n            // 这两个属性会开启过渡动画。\n            transition: ['mmm', 'ppp']\n        }\n    };\n}\n
\n

我们这样可以指定 style 下所有属性开启过渡动画:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n        },\n        // `style` 下所有属性开启过渡动画。\n        transition: 'style',\n    };\n}\n
\n" }, "renderItem.return_circle.emphasis": { "desc": "

图形元素的高亮状态

\n" }, "renderItem.return_circle.emphasis.focus": { "desc": "
\n

v5.0.0 开始支持

\n
\n

在高亮图形时,是否淡出其它数据的图形已达到聚焦的效果。支持如下配置:

\n\n" }, "renderItem.return_circle.emphasis.blurScope": { "desc": "
\n

v5.0.0 开始支持

\n
\n

在开启focus的时候,可以通过blurScope配置淡出的范围。支持如下配置

\n\n" }, "renderItem.return_circle.emphasis.style": { "desc": "

结构同 style

\n" }, "renderItem.return_circle.blur": { "desc": "
\n

v5.0.0 开始支持

\n
\n

图形元素的淡出状态,配置focus时有效。

\n" }, "renderItem.return_circle.blur.style": { "desc": "

结构同 style

\n" }, "renderItem.return_circle.select": { "desc": "
\n

v5.0.0 开始支持

\n
\n

图形元素的选中状态,配置自定义系列的 selectedMode 时有效。

\n" }, "renderItem.return_circle.select.style": { "desc": "

结构同 style

\n" }, "renderItem.return_ring": { "desc": "

圆环。

\n" }, "renderItem.return_ring.type": { "desc": "

用 setOption 首次设定图形元素时必须指定。\n可取值:

\n

image,\ntext,\ncircle,\nsector,\nring,\npolygon,\npolyline,\nrect,\nline,\nbezierCurve,\narc,\ngroup,

\n" }, "renderItem.return_ring.id": { "desc": "

id 用于在更新或删除图形元素时指定更新哪个图形元素,如果不需要用可以忽略。

\n" }, "renderItem.return_ring.x": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_ring.y": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_ring.rotation": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_ring.scaleX": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_ring.scaleY": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_ring.originX": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_ring.originY": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_ring.transition": { "desc": "

可以指定一个属性名,或者一组属性名。被指定的属性值变化时,会开启过渡动画。

\n

属性只可以是:

\n\n

当 transition 没有指定时,'x''y' 会默认开启过渡动画。如果想禁用这种默认,可设定:

\n
transition: [] // 一个空数组\n
\n

看这个 例子

\n" }, "renderItem.return_ring.morph": { "desc": "

是否开启形变动画。

\n

什么情况下会展示出形变动画?

\n

morph 设置为 true 后,还需按照如下规则,来形成形变动画:

\n

每次走渲染流程是,自定义系列会自动比较(diff)新旧数据。在这个 diff 过程中,如果发现,一组旧数据项和一组新数据项的值相等(相等的规则是,name 相同,或者 transition 所指定的维度上的值相同),那么我们就找到了能形成形变动画的一对候选集。

\n

在这组旧数据和这组新数据间,可能产生三种形变动画:

\n\n

注:我们并不支持多对多(many-to-many)的情况。

\n

然后,自定义系列,会在新旧组中,寻找声明为 morph: true 的图形元素,并分配他们形成真正的一一映射的形变,或者分裂(separating),或者合并(combining)。

\n

参见示例:custom-one-to-one-morph 和\ncustom-combine-separate-morph

\n" }, "renderItem.return_ring.z2": { "desc": "

用于决定图形元素的覆盖关系。

\n" }, "renderItem.return_ring.name": { "desc": "

参见 diffChildrenByName

\n" }, "renderItem.return_ring.info": { "desc": "

用户定义的任意数据,可以在 event listener 中访问,如:

\n
chart.on('click', function (params) {\n    console.log(params.info);\n});\n
\n" }, "renderItem.return_ring.silent": { "desc": "

是否不响应鼠标以及触摸事件。

\n" }, "renderItem.return_ring.invisible": { "desc": "

节点是否可见。

\n" }, "renderItem.return_ring.ignore": { "desc": "

节点是否完全被忽略(既不渲染,也不响应事件)。

\n" }, "renderItem.return_ring.shape.cx": { "desc": "

图形元素的中心在父节点坐标系(以父节点左上角为原点)中的横坐标值。

\n" }, "renderItem.return_ring.shape.cy": { "desc": "

图形元素的中心在父节点坐标系(以父节点左上角为原点)中的纵坐标值。

\n" }, "renderItem.return_ring.shape.r": { "desc": "

外半径。

\n" }, "renderItem.return_ring.shape.r0": { "desc": "

内半径。

\n" }, "renderItem.return_ring.shape.transition": { "desc": "

可以是一个属性名,或者一组属性名。\n被指定的属性,在其指发生变化时,会开启过渡动画。\n只可以指定本 shape 下的属性。

\n

例如:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        shape: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n            // 这两个属性会开启过渡动画。\n            transition: ['mmm', 'ppp']\n        }\n    };\n}\n
\n

我们这样可以指定 shape 下所有属性开启过渡动画:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        shape: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n        },\n        // `shape` 下所有属性开启过渡动画。\n        transition: 'shape',\n    };\n}\n
\n" }, "renderItem.return_ring.style": { "desc": "

注:关于图形元素中更多的样式设置(例如 富文本标签),参见 zrender/graphic/Displayable 中的 style 相关属性。

\n

注意,这里图形元素的样式属性名称直接源于 zrender,和 echarts labelecharts itemStyle 等处同样含义的样式属性名称或有不同。例如,有如下对应:

\n\n" }, "renderItem.return_ring.style.fill": { "desc": "

填充色。

\n" }, "renderItem.return_ring.style.stroke": { "desc": "

笔画颜色。

\n" }, "renderItem.return_ring.style.lineWidth": { "desc": "

笔画宽度。

\n" }, "renderItem.return_ring.style.shadowBlur": { "desc": "

阴影宽度。

\n" }, "renderItem.return_ring.style.shadowOffsetX": { "desc": "

阴影 X 方向偏移。

\n" }, "renderItem.return_ring.style.shadowOffsetY": { "desc": "

阴影 Y 方向偏移。

\n" }, "renderItem.return_ring.style.shadowColor": { "desc": "

阴影颜色。

\n" }, "renderItem.return_ring.style.transition": { "desc": "

可以是一个属性名,或者一组属性名。\n被指定的属性,在其指发生变化时,会开启过渡动画。\n只可以指定本 style 下的属性。

\n

例如:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n            // 这两个属性会开启过渡动画。\n            transition: ['mmm', 'ppp']\n        }\n    };\n}\n
\n

我们这样可以指定 style 下所有属性开启过渡动画:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n        },\n        // `style` 下所有属性开启过渡动画。\n        transition: 'style',\n    };\n}\n
\n" }, "renderItem.return_ring.emphasis": { "desc": "

图形元素的高亮状态

\n" }, "renderItem.return_ring.emphasis.focus": { "desc": "
\n

v5.0.0 开始支持

\n
\n

在高亮图形时,是否淡出其它数据的图形已达到聚焦的效果。支持如下配置:

\n\n" }, "renderItem.return_ring.emphasis.blurScope": { "desc": "
\n

v5.0.0 开始支持

\n
\n

在开启focus的时候,可以通过blurScope配置淡出的范围。支持如下配置

\n\n" }, "renderItem.return_ring.emphasis.style": { "desc": "

结构同 style

\n" }, "renderItem.return_ring.blur": { "desc": "
\n

v5.0.0 开始支持

\n
\n

图形元素的淡出状态,配置focus时有效。

\n" }, "renderItem.return_ring.blur.style": { "desc": "

结构同 style

\n" }, "renderItem.return_ring.select": { "desc": "
\n

v5.0.0 开始支持

\n
\n

图形元素的选中状态,配置自定义系列的 selectedMode 时有效。

\n" }, "renderItem.return_ring.select.style": { "desc": "

结构同 style

\n" }, "renderItem.return_sector": { "desc": "

扇形。

\n" }, "renderItem.return_sector.type": { "desc": "

用 setOption 首次设定图形元素时必须指定。\n可取值:

\n

image,\ntext,\ncircle,\nsector,\nring,\npolygon,\npolyline,\nrect,\nline,\nbezierCurve,\narc,\ngroup,

\n" }, "renderItem.return_sector.id": { "desc": "

id 用于在更新或删除图形元素时指定更新哪个图形元素,如果不需要用可以忽略。

\n" }, "renderItem.return_sector.x": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_sector.y": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_sector.rotation": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_sector.scaleX": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_sector.scaleY": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_sector.originX": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_sector.originY": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_sector.transition": { "desc": "

可以指定一个属性名,或者一组属性名。被指定的属性值变化时,会开启过渡动画。

\n

属性只可以是:

\n\n

当 transition 没有指定时,'x''y' 会默认开启过渡动画。如果想禁用这种默认,可设定:

\n
transition: [] // 一个空数组\n
\n

看这个 例子

\n" }, "renderItem.return_sector.morph": { "desc": "

是否开启形变动画。

\n

什么情况下会展示出形变动画?

\n

morph 设置为 true 后,还需按照如下规则,来形成形变动画:

\n

每次走渲染流程是,自定义系列会自动比较(diff)新旧数据。在这个 diff 过程中,如果发现,一组旧数据项和一组新数据项的值相等(相等的规则是,name 相同,或者 transition 所指定的维度上的值相同),那么我们就找到了能形成形变动画的一对候选集。

\n

在这组旧数据和这组新数据间,可能产生三种形变动画:

\n\n

注:我们并不支持多对多(many-to-many)的情况。

\n

然后,自定义系列,会在新旧组中,寻找声明为 morph: true 的图形元素,并分配他们形成真正的一一映射的形变,或者分裂(separating),或者合并(combining)。

\n

参见示例:custom-one-to-one-morph 和\ncustom-combine-separate-morph

\n" }, "renderItem.return_sector.z2": { "desc": "

用于决定图形元素的覆盖关系。

\n" }, "renderItem.return_sector.name": { "desc": "

参见 diffChildrenByName

\n" }, "renderItem.return_sector.info": { "desc": "

用户定义的任意数据,可以在 event listener 中访问,如:

\n
chart.on('click', function (params) {\n    console.log(params.info);\n});\n
\n" }, "renderItem.return_sector.silent": { "desc": "

是否不响应鼠标以及触摸事件。

\n" }, "renderItem.return_sector.invisible": { "desc": "

节点是否可见。

\n" }, "renderItem.return_sector.ignore": { "desc": "

节点是否完全被忽略(既不渲染,也不响应事件)。

\n" }, "renderItem.return_sector.shape.cx": { "desc": "

图形元素的中心在父节点坐标系(以父节点左上角为原点)中的横坐标值。

\n" }, "renderItem.return_sector.shape.cy": { "desc": "

图形元素的中心在父节点坐标系(以父节点左上角为原点)中的纵坐标值。

\n" }, "renderItem.return_sector.shape.r": { "desc": "

外半径。

\n" }, "renderItem.return_sector.shape.r0": { "desc": "

内半径。

\n" }, "renderItem.return_sector.shape.startAngle": { "desc": "

开始弧度。

\n" }, "renderItem.return_sector.shape.endAngle": { "desc": "

结束弧度。

\n" }, "renderItem.return_sector.shape.clockwise": { "desc": "

是否顺时针。

\n" }, "renderItem.return_sector.shape.transition": { "desc": "

可以是一个属性名,或者一组属性名。\n被指定的属性,在其指发生变化时,会开启过渡动画。\n只可以指定本 shape 下的属性。

\n

例如:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        shape: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n            // 这两个属性会开启过渡动画。\n            transition: ['mmm', 'ppp']\n        }\n    };\n}\n
\n

我们这样可以指定 shape 下所有属性开启过渡动画:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        shape: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n        },\n        // `shape` 下所有属性开启过渡动画。\n        transition: 'shape',\n    };\n}\n
\n" }, "renderItem.return_sector.style": { "desc": "

注:关于图形元素中更多的样式设置(例如 富文本标签),参见 zrender/graphic/Displayable 中的 style 相关属性。

\n

注意,这里图形元素的样式属性名称直接源于 zrender,和 echarts labelecharts itemStyle 等处同样含义的样式属性名称或有不同。例如,有如下对应:

\n\n" }, "renderItem.return_sector.style.fill": { "desc": "

填充色。

\n" }, "renderItem.return_sector.style.stroke": { "desc": "

笔画颜色。

\n" }, "renderItem.return_sector.style.lineWidth": { "desc": "

笔画宽度。

\n" }, "renderItem.return_sector.style.shadowBlur": { "desc": "

阴影宽度。

\n" }, "renderItem.return_sector.style.shadowOffsetX": { "desc": "

阴影 X 方向偏移。

\n" }, "renderItem.return_sector.style.shadowOffsetY": { "desc": "

阴影 Y 方向偏移。

\n" }, "renderItem.return_sector.style.shadowColor": { "desc": "

阴影颜色。

\n" }, "renderItem.return_sector.style.transition": { "desc": "

可以是一个属性名,或者一组属性名。\n被指定的属性,在其指发生变化时,会开启过渡动画。\n只可以指定本 style 下的属性。

\n

例如:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n            // 这两个属性会开启过渡动画。\n            transition: ['mmm', 'ppp']\n        }\n    };\n}\n
\n

我们这样可以指定 style 下所有属性开启过渡动画:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n        },\n        // `style` 下所有属性开启过渡动画。\n        transition: 'style',\n    };\n}\n
\n" }, "renderItem.return_sector.emphasis": { "desc": "

图形元素的高亮状态

\n" }, "renderItem.return_sector.emphasis.focus": { "desc": "
\n

v5.0.0 开始支持

\n
\n

在高亮图形时,是否淡出其它数据的图形已达到聚焦的效果。支持如下配置:

\n\n" }, "renderItem.return_sector.emphasis.blurScope": { "desc": "
\n

v5.0.0 开始支持

\n
\n

在开启focus的时候,可以通过blurScope配置淡出的范围。支持如下配置

\n\n" }, "renderItem.return_sector.emphasis.style": { "desc": "

结构同 style

\n" }, "renderItem.return_sector.blur": { "desc": "
\n

v5.0.0 开始支持

\n
\n

图形元素的淡出状态,配置focus时有效。

\n" }, "renderItem.return_sector.blur.style": { "desc": "

结构同 style

\n" }, "renderItem.return_sector.select": { "desc": "
\n

v5.0.0 开始支持

\n
\n

图形元素的选中状态,配置自定义系列的 selectedMode 时有效。

\n" }, "renderItem.return_sector.select.style": { "desc": "

结构同 style

\n" }, "renderItem.return_arc": { "desc": "

圆弧。

\n" }, "renderItem.return_arc.type": { "desc": "

用 setOption 首次设定图形元素时必须指定。\n可取值:

\n

image,\ntext,\ncircle,\nsector,\nring,\npolygon,\npolyline,\nrect,\nline,\nbezierCurve,\narc,\ngroup,

\n" }, "renderItem.return_arc.id": { "desc": "

id 用于在更新或删除图形元素时指定更新哪个图形元素,如果不需要用可以忽略。

\n" }, "renderItem.return_arc.x": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_arc.y": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_arc.rotation": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_arc.scaleX": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_arc.scaleY": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_arc.originX": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_arc.originY": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_arc.transition": { "desc": "

可以指定一个属性名,或者一组属性名。被指定的属性值变化时,会开启过渡动画。

\n

属性只可以是:

\n\n

当 transition 没有指定时,'x''y' 会默认开启过渡动画。如果想禁用这种默认,可设定:

\n
transition: [] // 一个空数组\n
\n

看这个 例子

\n" }, "renderItem.return_arc.morph": { "desc": "

是否开启形变动画。

\n

什么情况下会展示出形变动画?

\n

morph 设置为 true 后,还需按照如下规则,来形成形变动画:

\n

每次走渲染流程是,自定义系列会自动比较(diff)新旧数据。在这个 diff 过程中,如果发现,一组旧数据项和一组新数据项的值相等(相等的规则是,name 相同,或者 transition 所指定的维度上的值相同),那么我们就找到了能形成形变动画的一对候选集。

\n

在这组旧数据和这组新数据间,可能产生三种形变动画:

\n\n

注:我们并不支持多对多(many-to-many)的情况。

\n

然后,自定义系列,会在新旧组中,寻找声明为 morph: true 的图形元素,并分配他们形成真正的一一映射的形变,或者分裂(separating),或者合并(combining)。

\n

参见示例:custom-one-to-one-morph 和\ncustom-combine-separate-morph

\n" }, "renderItem.return_arc.z2": { "desc": "

用于决定图形元素的覆盖关系。

\n" }, "renderItem.return_arc.name": { "desc": "

参见 diffChildrenByName

\n" }, "renderItem.return_arc.info": { "desc": "

用户定义的任意数据,可以在 event listener 中访问,如:

\n
chart.on('click', function (params) {\n    console.log(params.info);\n});\n
\n" }, "renderItem.return_arc.silent": { "desc": "

是否不响应鼠标以及触摸事件。

\n" }, "renderItem.return_arc.invisible": { "desc": "

节点是否可见。

\n" }, "renderItem.return_arc.ignore": { "desc": "

节点是否完全被忽略(既不渲染,也不响应事件)。

\n" }, "renderItem.return_arc.shape.cx": { "desc": "

图形元素的中心在父节点坐标系(以父节点左上角为原点)中的横坐标值。

\n" }, "renderItem.return_arc.shape.cy": { "desc": "

图形元素的中心在父节点坐标系(以父节点左上角为原点)中的纵坐标值。

\n" }, "renderItem.return_arc.shape.r": { "desc": "

外半径。

\n" }, "renderItem.return_arc.shape.r0": { "desc": "

内半径。

\n" }, "renderItem.return_arc.shape.startAngle": { "desc": "

开始弧度。

\n" }, "renderItem.return_arc.shape.endAngle": { "desc": "

结束弧度。

\n" }, "renderItem.return_arc.shape.clockwise": { "desc": "

是否顺时针。

\n" }, "renderItem.return_arc.shape.transition": { "desc": "

可以是一个属性名,或者一组属性名。\n被指定的属性,在其指发生变化时,会开启过渡动画。\n只可以指定本 shape 下的属性。

\n

例如:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        shape: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n            // 这两个属性会开启过渡动画。\n            transition: ['mmm', 'ppp']\n        }\n    };\n}\n
\n

我们这样可以指定 shape 下所有属性开启过渡动画:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        shape: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n        },\n        // `shape` 下所有属性开启过渡动画。\n        transition: 'shape',\n    };\n}\n
\n" }, "renderItem.return_arc.style": { "desc": "

注:关于图形元素中更多的样式设置(例如 富文本标签),参见 zrender/graphic/Displayable 中的 style 相关属性。

\n

注意,这里图形元素的样式属性名称直接源于 zrender,和 echarts labelecharts itemStyle 等处同样含义的样式属性名称或有不同。例如,有如下对应:

\n\n" }, "renderItem.return_arc.style.fill": { "desc": "

填充色。

\n" }, "renderItem.return_arc.style.stroke": { "desc": "

笔画颜色。

\n" }, "renderItem.return_arc.style.lineWidth": { "desc": "

笔画宽度。

\n" }, "renderItem.return_arc.style.shadowBlur": { "desc": "

阴影宽度。

\n" }, "renderItem.return_arc.style.shadowOffsetX": { "desc": "

阴影 X 方向偏移。

\n" }, "renderItem.return_arc.style.shadowOffsetY": { "desc": "

阴影 Y 方向偏移。

\n" }, "renderItem.return_arc.style.shadowColor": { "desc": "

阴影颜色。

\n" }, "renderItem.return_arc.style.transition": { "desc": "

可以是一个属性名,或者一组属性名。\n被指定的属性,在其指发生变化时,会开启过渡动画。\n只可以指定本 style 下的属性。

\n

例如:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n            // 这两个属性会开启过渡动画。\n            transition: ['mmm', 'ppp']\n        }\n    };\n}\n
\n

我们这样可以指定 style 下所有属性开启过渡动画:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n        },\n        // `style` 下所有属性开启过渡动画。\n        transition: 'style',\n    };\n}\n
\n" }, "renderItem.return_arc.emphasis": { "desc": "

图形元素的高亮状态

\n" }, "renderItem.return_arc.emphasis.focus": { "desc": "
\n

v5.0.0 开始支持

\n
\n

在高亮图形时,是否淡出其它数据的图形已达到聚焦的效果。支持如下配置:

\n\n" }, "renderItem.return_arc.emphasis.blurScope": { "desc": "
\n

v5.0.0 开始支持

\n
\n

在开启focus的时候,可以通过blurScope配置淡出的范围。支持如下配置

\n\n" }, "renderItem.return_arc.emphasis.style": { "desc": "

结构同 style

\n" }, "renderItem.return_arc.blur": { "desc": "
\n

v5.0.0 开始支持

\n
\n

图形元素的淡出状态,配置focus时有效。

\n" }, "renderItem.return_arc.blur.style": { "desc": "

结构同 style

\n" }, "renderItem.return_arc.select": { "desc": "
\n

v5.0.0 开始支持

\n
\n

图形元素的选中状态,配置自定义系列的 selectedMode 时有效。

\n" }, "renderItem.return_arc.select.style": { "desc": "

结构同 style

\n" }, "renderItem.return_polygon": { "desc": "

多边形。

\n" }, "renderItem.return_polygon.type": { "desc": "

用 setOption 首次设定图形元素时必须指定。\n可取值:

\n

image,\ntext,\ncircle,\nsector,\nring,\npolygon,\npolyline,\nrect,\nline,\nbezierCurve,\narc,\ngroup,

\n" }, "renderItem.return_polygon.id": { "desc": "

id 用于在更新或删除图形元素时指定更新哪个图形元素,如果不需要用可以忽略。

\n" }, "renderItem.return_polygon.x": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_polygon.y": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_polygon.rotation": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_polygon.scaleX": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_polygon.scaleY": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_polygon.originX": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_polygon.originY": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_polygon.transition": { "desc": "

可以指定一个属性名,或者一组属性名。被指定的属性值变化时,会开启过渡动画。

\n

属性只可以是:

\n\n

当 transition 没有指定时,'x''y' 会默认开启过渡动画。如果想禁用这种默认,可设定:

\n
transition: [] // 一个空数组\n
\n

看这个 例子

\n" }, "renderItem.return_polygon.morph": { "desc": "

是否开启形变动画。

\n

什么情况下会展示出形变动画?

\n

morph 设置为 true 后,还需按照如下规则,来形成形变动画:

\n

每次走渲染流程是,自定义系列会自动比较(diff)新旧数据。在这个 diff 过程中,如果发现,一组旧数据项和一组新数据项的值相等(相等的规则是,name 相同,或者 transition 所指定的维度上的值相同),那么我们就找到了能形成形变动画的一对候选集。

\n

在这组旧数据和这组新数据间,可能产生三种形变动画:

\n\n

注:我们并不支持多对多(many-to-many)的情况。

\n

然后,自定义系列,会在新旧组中,寻找声明为 morph: true 的图形元素,并分配他们形成真正的一一映射的形变,或者分裂(separating),或者合并(combining)。

\n

参见示例:custom-one-to-one-morph 和\ncustom-combine-separate-morph

\n" }, "renderItem.return_polygon.z2": { "desc": "

用于决定图形元素的覆盖关系。

\n" }, "renderItem.return_polygon.name": { "desc": "

参见 diffChildrenByName

\n" }, "renderItem.return_polygon.info": { "desc": "

用户定义的任意数据,可以在 event listener 中访问,如:

\n
chart.on('click', function (params) {\n    console.log(params.info);\n});\n
\n" }, "renderItem.return_polygon.silent": { "desc": "

是否不响应鼠标以及触摸事件。

\n" }, "renderItem.return_polygon.invisible": { "desc": "

节点是否可见。

\n" }, "renderItem.return_polygon.ignore": { "desc": "

节点是否完全被忽略(既不渲染,也不响应事件)。

\n" }, "renderItem.return_polygon.shape.points": { "desc": "

点列表,用于定义形状,如 [[22, 44], [44, 55], [11, 44], ...]

\n" }, "renderItem.return_polygon.shape.smooth": { "desc": "

是否平滑曲线。

\n\n" }, "renderItem.return_polygon.shape.smoothConstraint": { "desc": "

是否将平滑曲线约束在包围盒中。smoothnumber(bezier)时生效。

\n" }, "renderItem.return_polygon.shape.transition": { "desc": "

可以是一个属性名,或者一组属性名。\n被指定的属性,在其指发生变化时,会开启过渡动画。\n只可以指定本 shape 下的属性。

\n

例如:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        shape: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n            // 这两个属性会开启过渡动画。\n            transition: ['mmm', 'ppp']\n        }\n    };\n}\n
\n

我们这样可以指定 shape 下所有属性开启过渡动画:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        shape: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n        },\n        // `shape` 下所有属性开启过渡动画。\n        transition: 'shape',\n    };\n}\n
\n" }, "renderItem.return_polygon.style": { "desc": "

注:关于图形元素中更多的样式设置(例如 富文本标签),参见 zrender/graphic/Displayable 中的 style 相关属性。

\n

注意,这里图形元素的样式属性名称直接源于 zrender,和 echarts labelecharts itemStyle 等处同样含义的样式属性名称或有不同。例如,有如下对应:

\n\n" }, "renderItem.return_polygon.style.fill": { "desc": "

填充色。

\n" }, "renderItem.return_polygon.style.stroke": { "desc": "

笔画颜色。

\n" }, "renderItem.return_polygon.style.lineWidth": { "desc": "

笔画宽度。

\n" }, "renderItem.return_polygon.style.shadowBlur": { "desc": "

阴影宽度。

\n" }, "renderItem.return_polygon.style.shadowOffsetX": { "desc": "

阴影 X 方向偏移。

\n" }, "renderItem.return_polygon.style.shadowOffsetY": { "desc": "

阴影 Y 方向偏移。

\n" }, "renderItem.return_polygon.style.shadowColor": { "desc": "

阴影颜色。

\n" }, "renderItem.return_polygon.style.transition": { "desc": "

可以是一个属性名,或者一组属性名。\n被指定的属性,在其指发生变化时,会开启过渡动画。\n只可以指定本 style 下的属性。

\n

例如:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n            // 这两个属性会开启过渡动画。\n            transition: ['mmm', 'ppp']\n        }\n    };\n}\n
\n

我们这样可以指定 style 下所有属性开启过渡动画:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n        },\n        // `style` 下所有属性开启过渡动画。\n        transition: 'style',\n    };\n}\n
\n" }, "renderItem.return_polygon.emphasis": { "desc": "

图形元素的高亮状态

\n" }, "renderItem.return_polygon.emphasis.focus": { "desc": "
\n

v5.0.0 开始支持

\n
\n

在高亮图形时,是否淡出其它数据的图形已达到聚焦的效果。支持如下配置:

\n\n" }, "renderItem.return_polygon.emphasis.blurScope": { "desc": "
\n

v5.0.0 开始支持

\n
\n

在开启focus的时候,可以通过blurScope配置淡出的范围。支持如下配置

\n\n" }, "renderItem.return_polygon.emphasis.style": { "desc": "

结构同 style

\n" }, "renderItem.return_polygon.blur": { "desc": "
\n

v5.0.0 开始支持

\n
\n

图形元素的淡出状态,配置focus时有效。

\n" }, "renderItem.return_polygon.blur.style": { "desc": "

结构同 style

\n" }, "renderItem.return_polygon.select": { "desc": "
\n

v5.0.0 开始支持

\n
\n

图形元素的选中状态,配置自定义系列的 selectedMode 时有效。

\n" }, "renderItem.return_polygon.select.style": { "desc": "

结构同 style

\n" }, "renderItem.return_polyline": { "desc": "

折线。

\n" }, "renderItem.return_polyline.type": { "desc": "

用 setOption 首次设定图形元素时必须指定。\n可取值:

\n

image,\ntext,\ncircle,\nsector,\nring,\npolygon,\npolyline,\nrect,\nline,\nbezierCurve,\narc,\ngroup,

\n" }, "renderItem.return_polyline.id": { "desc": "

id 用于在更新或删除图形元素时指定更新哪个图形元素,如果不需要用可以忽略。

\n" }, "renderItem.return_polyline.x": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_polyline.y": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_polyline.rotation": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_polyline.scaleX": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_polyline.scaleY": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_polyline.originX": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_polyline.originY": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_polyline.transition": { "desc": "

可以指定一个属性名,或者一组属性名。被指定的属性值变化时,会开启过渡动画。

\n

属性只可以是:

\n\n

当 transition 没有指定时,'x''y' 会默认开启过渡动画。如果想禁用这种默认,可设定:

\n
transition: [] // 一个空数组\n
\n

看这个 例子

\n" }, "renderItem.return_polyline.morph": { "desc": "

是否开启形变动画。

\n

什么情况下会展示出形变动画?

\n

morph 设置为 true 后,还需按照如下规则,来形成形变动画:

\n

每次走渲染流程是,自定义系列会自动比较(diff)新旧数据。在这个 diff 过程中,如果发现,一组旧数据项和一组新数据项的值相等(相等的规则是,name 相同,或者 transition 所指定的维度上的值相同),那么我们就找到了能形成形变动画的一对候选集。

\n

在这组旧数据和这组新数据间,可能产生三种形变动画:

\n\n

注:我们并不支持多对多(many-to-many)的情况。

\n

然后,自定义系列,会在新旧组中,寻找声明为 morph: true 的图形元素,并分配他们形成真正的一一映射的形变,或者分裂(separating),或者合并(combining)。

\n

参见示例:custom-one-to-one-morph 和\ncustom-combine-separate-morph

\n" }, "renderItem.return_polyline.z2": { "desc": "

用于决定图形元素的覆盖关系。

\n" }, "renderItem.return_polyline.name": { "desc": "

参见 diffChildrenByName

\n" }, "renderItem.return_polyline.info": { "desc": "

用户定义的任意数据,可以在 event listener 中访问,如:

\n
chart.on('click', function (params) {\n    console.log(params.info);\n});\n
\n" }, "renderItem.return_polyline.silent": { "desc": "

是否不响应鼠标以及触摸事件。

\n" }, "renderItem.return_polyline.invisible": { "desc": "

节点是否可见。

\n" }, "renderItem.return_polyline.ignore": { "desc": "

节点是否完全被忽略(既不渲染,也不响应事件)。

\n" }, "renderItem.return_polyline.shape.points": { "desc": "

点列表,用于定义形状,如 [[22, 44], [44, 55], [11, 44], ...]

\n" }, "renderItem.return_polyline.shape.smooth": { "desc": "

是否平滑曲线。

\n\n" }, "renderItem.return_polyline.shape.smoothConstraint": { "desc": "

是否将平滑曲线约束在包围盒中。smoothnumber(bezier)时生效。

\n" }, "renderItem.return_polyline.shape.transition": { "desc": "

可以是一个属性名,或者一组属性名。\n被指定的属性,在其指发生变化时,会开启过渡动画。\n只可以指定本 shape 下的属性。

\n

例如:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        shape: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n            // 这两个属性会开启过渡动画。\n            transition: ['mmm', 'ppp']\n        }\n    };\n}\n
\n

我们这样可以指定 shape 下所有属性开启过渡动画:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        shape: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n        },\n        // `shape` 下所有属性开启过渡动画。\n        transition: 'shape',\n    };\n}\n
\n" }, "renderItem.return_polyline.style": { "desc": "

注:关于图形元素中更多的样式设置(例如 富文本标签),参见 zrender/graphic/Displayable 中的 style 相关属性。

\n

注意,这里图形元素的样式属性名称直接源于 zrender,和 echarts labelecharts itemStyle 等处同样含义的样式属性名称或有不同。例如,有如下对应:

\n\n" }, "renderItem.return_polyline.style.fill": { "desc": "

填充色。

\n" }, "renderItem.return_polyline.style.stroke": { "desc": "

笔画颜色。

\n" }, "renderItem.return_polyline.style.lineWidth": { "desc": "

笔画宽度。

\n" }, "renderItem.return_polyline.style.shadowBlur": { "desc": "

阴影宽度。

\n" }, "renderItem.return_polyline.style.shadowOffsetX": { "desc": "

阴影 X 方向偏移。

\n" }, "renderItem.return_polyline.style.shadowOffsetY": { "desc": "

阴影 Y 方向偏移。

\n" }, "renderItem.return_polyline.style.shadowColor": { "desc": "

阴影颜色。

\n" }, "renderItem.return_polyline.style.transition": { "desc": "

可以是一个属性名,或者一组属性名。\n被指定的属性,在其指发生变化时,会开启过渡动画。\n只可以指定本 style 下的属性。

\n

例如:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n            // 这两个属性会开启过渡动画。\n            transition: ['mmm', 'ppp']\n        }\n    };\n}\n
\n

我们这样可以指定 style 下所有属性开启过渡动画:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n        },\n        // `style` 下所有属性开启过渡动画。\n        transition: 'style',\n    };\n}\n
\n" }, "renderItem.return_polyline.emphasis": { "desc": "

图形元素的高亮状态

\n" }, "renderItem.return_polyline.emphasis.focus": { "desc": "
\n

v5.0.0 开始支持

\n
\n

在高亮图形时,是否淡出其它数据的图形已达到聚焦的效果。支持如下配置:

\n\n" }, "renderItem.return_polyline.emphasis.blurScope": { "desc": "
\n

v5.0.0 开始支持

\n
\n

在开启focus的时候,可以通过blurScope配置淡出的范围。支持如下配置

\n\n" }, "renderItem.return_polyline.emphasis.style": { "desc": "

结构同 style

\n" }, "renderItem.return_polyline.blur": { "desc": "
\n

v5.0.0 开始支持

\n
\n

图形元素的淡出状态,配置focus时有效。

\n" }, "renderItem.return_polyline.blur.style": { "desc": "

结构同 style

\n" }, "renderItem.return_polyline.select": { "desc": "
\n

v5.0.0 开始支持

\n
\n

图形元素的选中状态,配置自定义系列的 selectedMode 时有效。

\n" }, "renderItem.return_polyline.select.style": { "desc": "

结构同 style

\n" }, "renderItem.return_line": { "desc": "

直线。

\n" }, "renderItem.return_line.type": { "desc": "

用 setOption 首次设定图形元素时必须指定。\n可取值:

\n

image,\ntext,\ncircle,\nsector,\nring,\npolygon,\npolyline,\nrect,\nline,\nbezierCurve,\narc,\ngroup,

\n" }, "renderItem.return_line.id": { "desc": "

id 用于在更新或删除图形元素时指定更新哪个图形元素,如果不需要用可以忽略。

\n" }, "renderItem.return_line.x": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_line.y": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_line.rotation": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_line.scaleX": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_line.scaleY": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_line.originX": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_line.originY": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_line.transition": { "desc": "

可以指定一个属性名,或者一组属性名。被指定的属性值变化时,会开启过渡动画。

\n

属性只可以是:

\n\n

当 transition 没有指定时,'x''y' 会默认开启过渡动画。如果想禁用这种默认,可设定:

\n
transition: [] // 一个空数组\n
\n

看这个 例子

\n" }, "renderItem.return_line.morph": { "desc": "

是否开启形变动画。

\n

什么情况下会展示出形变动画?

\n

morph 设置为 true 后,还需按照如下规则,来形成形变动画:

\n

每次走渲染流程是,自定义系列会自动比较(diff)新旧数据。在这个 diff 过程中,如果发现,一组旧数据项和一组新数据项的值相等(相等的规则是,name 相同,或者 transition 所指定的维度上的值相同),那么我们就找到了能形成形变动画的一对候选集。

\n

在这组旧数据和这组新数据间,可能产生三种形变动画:

\n\n

注:我们并不支持多对多(many-to-many)的情况。

\n

然后,自定义系列,会在新旧组中,寻找声明为 morph: true 的图形元素,并分配他们形成真正的一一映射的形变,或者分裂(separating),或者合并(combining)。

\n

参见示例:custom-one-to-one-morph 和\ncustom-combine-separate-morph

\n" }, "renderItem.return_line.z2": { "desc": "

用于决定图形元素的覆盖关系。

\n" }, "renderItem.return_line.name": { "desc": "

参见 diffChildrenByName

\n" }, "renderItem.return_line.info": { "desc": "

用户定义的任意数据,可以在 event listener 中访问,如:

\n
chart.on('click', function (params) {\n    console.log(params.info);\n});\n
\n" }, "renderItem.return_line.silent": { "desc": "

是否不响应鼠标以及触摸事件。

\n" }, "renderItem.return_line.invisible": { "desc": "

节点是否可见。

\n" }, "renderItem.return_line.ignore": { "desc": "

节点是否完全被忽略(既不渲染,也不响应事件)。

\n" }, "renderItem.return_line.shape.x1": { "desc": "

开始点的 x 值。

\n" }, "renderItem.return_line.shape.y1": { "desc": "

开始点的 y 值。

\n" }, "renderItem.return_line.shape.x2": { "desc": "

结束点的 x 值。

\n" }, "renderItem.return_line.shape.y2": { "desc": "

结束点的 y 值。

\n" }, "renderItem.return_line.shape.percent": { "desc": "

线画到百分之多少就不画了。值的范围:[0, 1]。

\n" }, "renderItem.return_line.shape.transition": { "desc": "

可以是一个属性名,或者一组属性名。\n被指定的属性,在其指发生变化时,会开启过渡动画。\n只可以指定本 shape 下的属性。

\n

例如:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        shape: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n            // 这两个属性会开启过渡动画。\n            transition: ['mmm', 'ppp']\n        }\n    };\n}\n
\n

我们这样可以指定 shape 下所有属性开启过渡动画:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        shape: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n        },\n        // `shape` 下所有属性开启过渡动画。\n        transition: 'shape',\n    };\n}\n
\n" }, "renderItem.return_line.style": { "desc": "

注:关于图形元素中更多的样式设置(例如 富文本标签),参见 zrender/graphic/Displayable 中的 style 相关属性。

\n

注意,这里图形元素的样式属性名称直接源于 zrender,和 echarts labelecharts itemStyle 等处同样含义的样式属性名称或有不同。例如,有如下对应:

\n\n" }, "renderItem.return_line.style.fill": { "desc": "

填充色。

\n" }, "renderItem.return_line.style.stroke": { "desc": "

笔画颜色。

\n" }, "renderItem.return_line.style.lineWidth": { "desc": "

笔画宽度。

\n" }, "renderItem.return_line.style.shadowBlur": { "desc": "

阴影宽度。

\n" }, "renderItem.return_line.style.shadowOffsetX": { "desc": "

阴影 X 方向偏移。

\n" }, "renderItem.return_line.style.shadowOffsetY": { "desc": "

阴影 Y 方向偏移。

\n" }, "renderItem.return_line.style.shadowColor": { "desc": "

阴影颜色。

\n" }, "renderItem.return_line.style.transition": { "desc": "

可以是一个属性名,或者一组属性名。\n被指定的属性,在其指发生变化时,会开启过渡动画。\n只可以指定本 style 下的属性。

\n

例如:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n            // 这两个属性会开启过渡动画。\n            transition: ['mmm', 'ppp']\n        }\n    };\n}\n
\n

我们这样可以指定 style 下所有属性开启过渡动画:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n        },\n        // `style` 下所有属性开启过渡动画。\n        transition: 'style',\n    };\n}\n
\n" }, "renderItem.return_line.emphasis": { "desc": "

图形元素的高亮状态

\n" }, "renderItem.return_line.emphasis.focus": { "desc": "
\n

v5.0.0 开始支持

\n
\n

在高亮图形时,是否淡出其它数据的图形已达到聚焦的效果。支持如下配置:

\n\n" }, "renderItem.return_line.emphasis.blurScope": { "desc": "
\n

v5.0.0 开始支持

\n
\n

在开启focus的时候,可以通过blurScope配置淡出的范围。支持如下配置

\n\n" }, "renderItem.return_line.emphasis.style": { "desc": "

结构同 style

\n" }, "renderItem.return_line.blur": { "desc": "
\n

v5.0.0 开始支持

\n
\n

图形元素的淡出状态,配置focus时有效。

\n" }, "renderItem.return_line.blur.style": { "desc": "

结构同 style

\n" }, "renderItem.return_line.select": { "desc": "
\n

v5.0.0 开始支持

\n
\n

图形元素的选中状态,配置自定义系列的 selectedMode 时有效。

\n" }, "renderItem.return_line.select.style": { "desc": "

结构同 style

\n" }, "renderItem.return_bezierCurve": { "desc": "

二次或三次贝塞尔曲线。

\n" }, "renderItem.return_bezierCurve.type": { "desc": "

用 setOption 首次设定图形元素时必须指定。\n可取值:

\n

image,\ntext,\ncircle,\nsector,\nring,\npolygon,\npolyline,\nrect,\nline,\nbezierCurve,\narc,\ngroup,

\n" }, "renderItem.return_bezierCurve.id": { "desc": "

id 用于在更新或删除图形元素时指定更新哪个图形元素,如果不需要用可以忽略。

\n" }, "renderItem.return_bezierCurve.x": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_bezierCurve.y": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_bezierCurve.rotation": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_bezierCurve.scaleX": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_bezierCurve.scaleY": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_bezierCurve.originX": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_bezierCurve.originY": { "desc": "

图形元素可以进行标准的 2D transform,其中包含:

\n\n

另外,originXoriginY 指定了旋转和缩放的中心点,默认值都是 0

\n

注意:

\n\n" }, "renderItem.return_bezierCurve.transition": { "desc": "

可以指定一个属性名,或者一组属性名。被指定的属性值变化时,会开启过渡动画。

\n

属性只可以是:

\n\n

当 transition 没有指定时,'x''y' 会默认开启过渡动画。如果想禁用这种默认,可设定:

\n
transition: [] // 一个空数组\n
\n

看这个 例子

\n" }, "renderItem.return_bezierCurve.morph": { "desc": "

是否开启形变动画。

\n

什么情况下会展示出形变动画?

\n

morph 设置为 true 后,还需按照如下规则,来形成形变动画:

\n

每次走渲染流程是,自定义系列会自动比较(diff)新旧数据。在这个 diff 过程中,如果发现,一组旧数据项和一组新数据项的值相等(相等的规则是,name 相同,或者 transition 所指定的维度上的值相同),那么我们就找到了能形成形变动画的一对候选集。

\n

在这组旧数据和这组新数据间,可能产生三种形变动画:

\n\n

注:我们并不支持多对多(many-to-many)的情况。

\n

然后,自定义系列,会在新旧组中,寻找声明为 morph: true 的图形元素,并分配他们形成真正的一一映射的形变,或者分裂(separating),或者合并(combining)。

\n

参见示例:custom-one-to-one-morph 和\ncustom-combine-separate-morph

\n" }, "renderItem.return_bezierCurve.z2": { "desc": "

用于决定图形元素的覆盖关系。

\n" }, "renderItem.return_bezierCurve.name": { "desc": "

参见 diffChildrenByName

\n" }, "renderItem.return_bezierCurve.info": { "desc": "

用户定义的任意数据,可以在 event listener 中访问,如:

\n
chart.on('click', function (params) {\n    console.log(params.info);\n});\n
\n" }, "renderItem.return_bezierCurve.silent": { "desc": "

是否不响应鼠标以及触摸事件。

\n" }, "renderItem.return_bezierCurve.invisible": { "desc": "

节点是否可见。

\n" }, "renderItem.return_bezierCurve.ignore": { "desc": "

节点是否完全被忽略(既不渲染,也不响应事件)。

\n" }, "renderItem.return_bezierCurve.shape.x1": { "desc": "

开始点的 x 值。

\n" }, "renderItem.return_bezierCurve.shape.y1": { "desc": "

开始点的 y 值。

\n" }, "renderItem.return_bezierCurve.shape.x2": { "desc": "

结束点的 x 值。

\n" }, "renderItem.return_bezierCurve.shape.y2": { "desc": "

结束点的 y 值。

\n" }, "renderItem.return_bezierCurve.shape.cpx1": { "desc": "

控制点 x 值。

\n" }, "renderItem.return_bezierCurve.shape.cpy1": { "desc": "

控制点 y 值。

\n" }, "renderItem.return_bezierCurve.shape.cpx2": { "desc": "

第二个控制点 x 值。如果设置则开启三阶贝塞尔曲线。

\n" }, "renderItem.return_bezierCurve.shape.cpy2": { "desc": "

第二个控制点 y 值。如果设置则开启三阶贝塞尔曲线。

\n" }, "renderItem.return_bezierCurve.shape.percent": { "desc": "

画到百分之多少就不画了。值的范围:[0, 1]。

\n" }, "renderItem.return_bezierCurve.shape.transition": { "desc": "

可以是一个属性名,或者一组属性名。\n被指定的属性,在其指发生变化时,会开启过渡动画。\n只可以指定本 shape 下的属性。

\n

例如:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        shape: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n            // 这两个属性会开启过渡动画。\n            transition: ['mmm', 'ppp']\n        }\n    };\n}\n
\n

我们这样可以指定 shape 下所有属性开启过渡动画:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        shape: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n        },\n        // `shape` 下所有属性开启过渡动画。\n        transition: 'shape',\n    };\n}\n
\n" }, "renderItem.return_bezierCurve.style": { "desc": "

注:关于图形元素中更多的样式设置(例如 富文本标签),参见 zrender/graphic/Displayable 中的 style 相关属性。

\n

注意,这里图形元素的样式属性名称直接源于 zrender,和 echarts labelecharts itemStyle 等处同样含义的样式属性名称或有不同。例如,有如下对应:

\n\n" }, "renderItem.return_bezierCurve.style.fill": { "desc": "

填充色。

\n" }, "renderItem.return_bezierCurve.style.stroke": { "desc": "

笔画颜色。

\n" }, "renderItem.return_bezierCurve.style.lineWidth": { "desc": "

笔画宽度。

\n" }, "renderItem.return_bezierCurve.style.shadowBlur": { "desc": "

阴影宽度。

\n" }, "renderItem.return_bezierCurve.style.shadowOffsetX": { "desc": "

阴影 X 方向偏移。

\n" }, "renderItem.return_bezierCurve.style.shadowOffsetY": { "desc": "

阴影 Y 方向偏移。

\n" }, "renderItem.return_bezierCurve.style.shadowColor": { "desc": "

阴影颜色。

\n" }, "renderItem.return_bezierCurve.style.transition": { "desc": "

可以是一个属性名,或者一组属性名。\n被指定的属性,在其指发生变化时,会开启过渡动画。\n只可以指定本 style 下的属性。

\n

例如:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n            // 这两个属性会开启过渡动画。\n            transition: ['mmm', 'ppp']\n        }\n    };\n}\n
\n

我们这样可以指定 style 下所有属性开启过渡动画:

\n
renderItem: function (params, api) {\n    return {\n        type: 'xxx',\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n        },\n        // `style` 下所有属性开启过渡动画。\n        transition: 'style',\n    };\n}\n
\n" }, "renderItem.return_bezierCurve.emphasis": { "desc": "

图形元素的高亮状态

\n" }, "renderItem.return_bezierCurve.emphasis.focus": { "desc": "
\n

v5.0.0 开始支持

\n
\n

在高亮图形时,是否淡出其它数据的图形已达到聚焦的效果。支持如下配置:

\n\n" }, "renderItem.return_bezierCurve.emphasis.blurScope": { "desc": "
\n

v5.0.0 开始支持

\n
\n

在开启focus的时候,可以通过blurScope配置淡出的范围。支持如下配置

\n\n" }, "renderItem.return_bezierCurve.emphasis.style": { "desc": "

结构同 style

\n" }, "renderItem.return_bezierCurve.blur": { "desc": "
\n

v5.0.0 开始支持

\n
\n

图形元素的淡出状态,配置focus时有效。

\n" }, "renderItem.return_bezierCurve.blur.style": { "desc": "

结构同 style

\n" }, "renderItem.return_bezierCurve.select": { "desc": "
\n

v5.0.0 开始支持

\n
\n

图形元素的选中状态,配置自定义系列的 selectedMode 时有效。

\n" }, "renderItem.return_bezierCurve.select.style": { "desc": "

结构同 style

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

图形样式。

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

图形的颜色。 默认从全局调色盘 option.color 获取颜色

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

图形的描边颜色。支持的颜色格式同 color,不支持回调函数。

\n", "uiControl": { "type": "color" } }, "itemStyle.borderWidth": { "desc": "\n\n

描边线宽。为 0 时无描边。

\n", "uiControl": { "type": "number", "value": "0", "min": "0", "step": "0.5" } }, "itemStyle.borderType": { "desc": "\n\n

柱条的描边类型,默认为实线,支持 'solid', 'dashed', 'dotted'

\n", "uiControl": { "type": "enum", "default": "solid", "options": "solid,dashed,dotted" } }, "itemStyle.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" } }, "itemStyle.shadowColor": { "desc": "\n\n

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

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

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

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

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

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

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

\n", "uiControl": { "type": "number", "default": "1", "min": "0", "max": "1", "step": "0.01" } }, "itemStyle.decal(Object | 'none')": { "desc": "

图形的贴花图案,在 aria.enabledaria.decal.show 都是 true 的情况下才生效。

\n

如果为 'none' 表示不使用贴花图案。

\n" }, "itemStyle.decal(Object | 'none').symbol(string|string[]) = 'rect'": { "desc": "

贴花的图案,如果是 string[] 表示循环使用数组中的图案。

\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
" }, "itemStyle.decal(Object | 'none').symbolSize": { "desc": "

取值范围:01,表示占图案区域的百分比。

\n" }, "itemStyle.decal(Object | 'none').symbolKeepAspect": { "desc": "

是否保持图案的长宽比。

\n" }, "itemStyle.decal(Object | 'none').color": { "desc": "

贴花图案的颜色,建议使用半透明色,这样能叠加在系列本身的颜色上。

\n" }, "itemStyle.decal(Object | 'none').backgroundColor": { "desc": "

贴花的背景色,将会覆盖在系列本身颜色之上,贴花图案之下。

\n" }, "itemStyle.decal(Object | 'none').dashArrayX(number | number[] | (number | number[])[]) = 5": { "desc": "

贴花图案的基本模式是在横向和纵向上分别以图案 - 空白 - 图案 - 空白 - 图案 - 空白的形式无限循环。通过设置每个图案和空白的长度,可以实现复杂的图案效果。

\n

dashArrayX 控制了横向的图案模式。当其值为 numbernumber[] 类型时,与 SVG stroke-dasharray 类似。

\n\n

可以结合以下的例子理解本接口:

\n