mirror of
https://gitee.com/baidu/amis.git
synced 2024-11-29 18:48:45 +08:00
16 lines
4.4 MiB
16 lines
4.4 MiB
;/*!examples/components/EChartsEditor/Title.tsx*/
|
||
amis.define("f669756",(function(e,n,o,c){"use strict";Object.defineProperty(n,"__esModule",{value:!0});var s=e("b666d70");n.default={type:"tabs",tabs:[{title:"内容",className:"echarts-tab",body:[(0,s.createHierarchy)("title",(0,s.buildOptions)("",{id:{desc:"<p>组件 ID。默认不指定。指定则可用于在 option 或者 API 中引用组件。</p>\n"},show:{desc:"\n\n<p>是否显示标题组件。</p>\n",uiControl:{type:"boolean",default:"true"}},text:{desc:'\n\n<p>主标题文本,支持使用 <code class="codespan">\\n</code> 换行。</p>\n',uiControl:{type:"text"}},link:{desc:"<p>主标题文本超链接。</p>\n"},target:{desc:'<p>指定窗口打开主标题超链接。</p>\n<p><strong>可选:</strong></p>\n<ul>\n<li><p><code class="codespan">'self'</code> 当前窗口打开</p>\n</li>\n<li><p><code class="codespan">'blank'</code> 新窗口打开</p>\n</li>\n</ul>\n'},"textStyle.color":{desc:"\n\n<p>主标题文字的颜色。</p>\n",uiControl:{type:"color",default:"'#333'"}},"textStyle.fontStyle":{desc:'\n\n<p>主标题文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"textStyle.fontWeight":{desc:'\n\n<p>主标题文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"textStyle.fontFamily":{desc:"\n\n<p>主标题文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"textStyle.fontSize":{desc:"\n\n<p>主标题文字的字体大小。</p>\n",uiControl:{type:"number",default:"18",min:"1",step:"1"}},"textStyle.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"textStyle.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"textStyle.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"textStyle.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"textStyle.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"textStyle.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"textStyle.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"textStyle.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"textStyle.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"textStyle.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"textStyle.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"textStyle.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"textStyle.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"textStyle.rich.<style_name>.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"textStyle.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"textStyle.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"textStyle.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"textStyle.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"textStyle.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"textStyle.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"textStyle.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"textStyle.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"textStyle.rich.<style_name>.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"textStyle.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"textStyle.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"textStyle.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"textStyle.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"textStyle.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"textStyle.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"textStyle.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"textStyle.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"textStyle.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"textStyle.rich.<style_name>.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"textStyle.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"textStyle.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"textStyle.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"textStyle.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"textStyle.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},subtext:{desc:'\n\n<p>副标题文本,支持使用 <code class="codespan">\\n</code> 换行。</p>\n',uiControl:{type:"text"}},sublink:{desc:"<p>副标题文本超链接。</p>\n"},subtarget:{desc:'<p>指定窗口打开副标题超链接,可选:</p>\n<ul>\n<li><p><code class="codespan">'self'</code> 当前窗口打开</p>\n</li>\n<li><p><code class="codespan">'blank'</code> 新窗口打开</p>\n</li>\n</ul>\n'},"subtextStyle.color":{desc:"\n\n<p>副标题文字的颜色。</p>\n",uiControl:{type:"color",default:"'#aaa'"}},"subtextStyle.fontStyle":{desc:'\n\n<p>副标题文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"subtextStyle.fontWeight":{desc:'\n\n<p>副标题文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"subtextStyle.fontFamily":{desc:"\n\n<p>副标题文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"subtextStyle.fontSize":{desc:"\n\n<p>副标题文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"subtextStyle.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"subtextStyle.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"subtextStyle.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"subtextStyle.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"subtextStyle.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"subtextStyle.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"subtextStyle.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"subtextStyle.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"subtextStyle.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"subtextStyle.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"subtextStyle.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"subtextStyle.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"subtextStyle.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"subtextStyle.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"subtextStyle.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"subtextStyle.rich.<style_name>.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"subtextStyle.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"subtextStyle.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"subtextStyle.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"subtextStyle.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"subtextStyle.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"subtextStyle.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"subtextStyle.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"subtextStyle.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"subtextStyle.rich.<style_name>.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"subtextStyle.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"subtextStyle.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"subtextStyle.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"subtextStyle.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"subtextStyle.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"subtextStyle.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"subtextStyle.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"subtextStyle.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"subtextStyle.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"subtextStyle.rich.<style_name>.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"subtextStyle.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"subtextStyle.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"subtextStyle.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"subtextStyle.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"subtextStyle.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},textAlign:{desc:'\n\n<p>整体(包括 text 和 subtext)的水平对齐。</p>\n<p>可选值:<code class="codespan">'auto'</code>、<code class="codespan">'left'</code>、<code class="codespan">'right'</code>、<code class="codespan">'center'</code>。</p>\n',uiControl:{type:"enum",options:"auto,left,center,right",default:"auto"}},textVerticalAlign:{desc:'\n\n<p>整体(包括 text 和 subtext)的垂直对齐。</p>\n<p>可选值:<code class="codespan">'auto'</code>、<code class="codespan">'top'</code>、<code class="codespan">'bottom'</code>、<code class="codespan">'middle'</code>。</p>\n',uiControl:{type:"enum",options:"auto,top,middle,bottom",default:"auto"}},triggerEvent:{desc:"<p>是否触发事件。</p>\n"},padding:{desc:'\n\n<p>标题内边距,单位px,默认各方向内边距为5,接受数组分别设定上右下左边距。</p>\n<p>使用示例:</p>\n<pre><code class="lang-js">// 设置内边距为 5\npadding: 5\n// 设置上下的内边距为 5,左右的内边距为 10\npadding: [5, 10]\n// 分别设置四个方向的内边距\npadding: [\n 5, // 上\n 10, // 右\n 5, // 下\n 10, // 左\n]\n</code></pre>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},itemGap:{desc:"\n\n<p>主副标题之间的间距。</p>\n",uiControl:{type:"number",min:"0",default:"10",step:"1"}},zlevel:{desc:'<p>所有图形的 zlevel 值。</p>\n<p><code class="codespan">zlevel</code>用于 Canvas 分层,不同<code class="codespan">zlevel</code>值的图形会放置在不同的 Canvas 中,Canvas 分层是一种常见的优化手段。我们可以把一些图形变化频繁(例如有动画)的组件设置成一个单独的<code class="codespan">zlevel</code>。需要注意的是过多的 Canvas 会引起内存开销的增大,在手机端上需要谨慎使用以防崩溃。</p>\n<p><code class="codespan">zlevel</code> 大的 Canvas 会放在 <code class="codespan">zlevel</code> 小的 Canvas 的上面。</p>\n'},z:{desc:'<p>组件的所有图形的<code class="codespan">z</code>值。控制图形的前后顺序。<code class="codespan">z</code>值小的图形会被<code class="codespan">z</code>值大的图形覆盖。</p>\n<p><code class="codespan">z</code>相比<code class="codespan">zlevel</code>优先级更低,而且不会创建新的 Canvas。</p>\n'},left:{desc:'\n\n<p>title 组件离容器左侧的距离。</p>\n<p><code class="codespan">left</code> 的值可以是像 <code class="codespan">20</code> 这样的具体像素值,可以是像 <code class="codespan">'20%'</code> 这样相对于容器高宽的百分比,也可以是 <code class="codespan">'left'</code>, <code class="codespan">'center'</code>, <code class="codespan">'right'</code>。</p>\n<p>如果 <code class="codespan">left</code> 的值为<code class="codespan">'left'</code>, <code class="codespan">'center'</code>, <code class="codespan">'right'</code>,组件会根据相应的位置自动对齐。</p>\n',uiControl:{type:"percent",default:"0%"}},top:{desc:'\n\n<p>title 组件离容器上侧的距离。</p>\n<p><code class="codespan">top</code> 的值可以是像 <code class="codespan">20</code> 这样的具体像素值,可以是像 <code class="codespan">'20%'</code> 这样相对于容器高宽的百分比,也可以是 <code class="codespan">'top'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'bottom'</code>。</p>\n<p>如果 <code class="codespan">top</code> 的值为<code class="codespan">'top'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'bottom'</code>,组件会根据相应的位置自动对齐。</p>\n',uiControl:{type:"percent",default:"0%"}},right:{desc:'\n\n<p>title 组件离容器右侧的距离。</p>\n<p><code class="codespan">right</code> 的值可以是像 <code class="codespan">20</code> 这样的具体像素值,可以是像 <code class="codespan">'20%'</code> 这样相对于容器高宽的百分比。</p>\n<p>默认自适应。</p>\n',uiControl:{type:"percent",default:"0%"}},bottom:{desc:'\n\n<p>title 组件离容器下侧的距离。</p>\n<p>bottom 的值可以是像 <code class="codespan">20</code> 这样的具体像素值,可以是像 <code class="codespan">'20%'</code> 这样相对于容器高宽的百分比。</p>\n<p>默认自适应。</p>\n',uiControl:{type:"percent",default:"0%"}},backgroundColor:{desc:'\n\n<p>标题背景色,默认透明。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code> ,如果想要加上 alpha 通道,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code></p>\n</blockquote>\n',uiControl:{type:"color"}},borderColor:{desc:"\n\n<p>标题的边框颜色。支持的颜色格式同 backgroundColor。</p>\n",uiControl:{type:"color",default:"#ccc"}},borderWidth:{desc:"\n\n<p>标题的边框线宽。</p>\n",uiControl:{type:"number",default:"0",min:"0",step:"0.5"}},borderRadius:{desc:"\n\n<p>圆角半径,单位px,支持传入数组分别指定 4 个圆角半径。\n如:</p>\n<pre><code>borderRadius: 5, // 统一设置四个角的圆角大小\nborderRadius: [5, 5, 0, 0] //(顺时针左上,右上,右下,左下)\n</code></pre>",uiControl:{type:"vector",min:"0",dims:"LT,RT,RB,LB"}},shadowBlur:{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n<p><strong>注意</strong>:此配置项生效的前提是,设置了 <code class="codespan">show: true</code> 以及值不为 <code class="codespan">tranparent</code> 的背景色 <code class="codespan">backgroundColor</code>。</p>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},shadowColor:{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n<p><strong>注意</strong>:此配置项生效的前提是,设置了 <code class="codespan">show: true</code>。</p>\n',uiControl:{type:"color",default:""}},shadowOffsetX:{desc:'\n\n<p>阴影水平方向上的偏移距离。</p>\n<p><strong>注意</strong>:此配置项生效的前提是,设置了 <code class="codespan">show: true</code>。</p>\n',uiControl:{type:"number",default:"0",step:"0.5"}},shadowOffsetY:{desc:'\n\n<p>阴影垂直方向上的偏移距离。</p>\n<p><strong>注意</strong>:此配置项生效的前提是,设置了 <code class="codespan">show: true</code>。</p>\n',uiControl:{type:"number",default:"0",step:"0.5"}}}))]},{title:"位置",body:[(0,s.createHierarchy)("legend",[(0,s.viewport)("","标题")])]},{title:"样式",body:[(0,s.createHierarchy)("title",(0,s.commonStyle)("","标题"))]},{title:"文字样式",body:[(0,s.createHierarchy)("title",[(0,s.textStyleControls)("textStyle","主标题"),(0,s.textStyleControls)("subtextStyle","副标题")])]}]}}));
|
||
;/*!examples/components/EChartsEditor/Legend.tsx*/
|
||
amis.define("3d59161",(function(e,n,o,c){"use strict";Object.defineProperty(n,"__esModule",{value:!0});var s=e("b666d70");n.default={type:"tabs",tabs:[{title:"基础",className:"echarts-tab",body:[(0,s.createHierarchy)("legend",(0,s.buildOptions)("",{type:{desc:'\n\n<p>图例的类型。可选值:</p>\n<ul>\n<li><code class="codespan">'plain'</code>:普通图例。缺省就是普通图例。</li>\n<li><code class="codespan">'scroll'</code>:可滚动翻页的图例。当图例数量较多时可以使用。</li>\n</ul>\n<p>参见 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=pie-legend&edit=1&reset=1" target="_blank">滚动图例(垂直)</a> 或 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=radar2&edit=1&reset=1" target="_blank">滚动图例(水平)</a>。</p>\n<p>当使用 <code class="codespan">'scroll'</code> 时,使用这些设置进行细节配置:</p>\n<ul>\n<li><a href="#legend.scrollDataIndex">legend.scrollDataIndex</a></li>\n<li><a href="#legend.pageButtonItemGap">legend.pageButtonItemGap</a></li>\n<li><a href="#legend.pageButtonGap">legend.pageButtonGap</a></li>\n<li><a href="#legend.pageButtonPosition">legend.pageButtonPosition</a></li>\n<li><a href="#legend.pageFormatter">legend.pageFormatter</a></li>\n<li><a href="#legend.pageIcons">legend.pageIcons</a></li>\n<li><a href="#legend.pageIconColor">legend.pageIconColor</a></li>\n<li><a href="#legend.pageIconInactiveColor">legend.pageIconInactiveColor</a></li>\n<li><a href="#legend.pageIconSize">legend.pageIconSize</a></li>\n<li><a href="#legend.pageTextStyle">legend.pageTextStyle</a></li>\n<li><a href="#legend.animation">legend.animation</a></li>\n<li><a href="#legend.animationDurationUpdate">legend.animationDurationUpdate</a></li>\n</ul>\n',uiControl:{type:"enum",options:"plain,scroll"}},id:{desc:"<p>组件 ID。默认不指定。指定则可用于在 option 或者 API 中引用组件。</p>\n"},show:{desc:"\n\n\n\n\n\n\n\n",uiControl:{type:"boolean",default:"true"}},zlevel:{desc:'<p>所有图形的 zlevel 值。</p>\n<p><code class="codespan">zlevel</code>用于 Canvas 分层,不同<code class="codespan">zlevel</code>值的图形会放置在不同的 Canvas 中,Canvas 分层是一种常见的优化手段。我们可以把一些图形变化频繁(例如有动画)的组件设置成一个单独的<code class="codespan">zlevel</code>。需要注意的是过多的 Canvas 会引起内存开销的增大,在手机端上需要谨慎使用以防崩溃。</p>\n<p><code class="codespan">zlevel</code> 大的 Canvas 会放在 <code class="codespan">zlevel</code> 小的 Canvas 的上面。</p>\n'},z:{desc:'<p>组件的所有图形的<code class="codespan">z</code>值。控制图形的前后顺序。<code class="codespan">z</code>值小的图形会被<code class="codespan">z</code>值大的图形覆盖。</p>\n<p><code class="codespan">z</code>相比<code class="codespan">zlevel</code>优先级更低,而且不会创建新的 Canvas。</p>\n'},left:{desc:'\n\n<p>图例组件离容器左侧的距离。</p>\n<p><code class="codespan">left</code> 的值可以是像 <code class="codespan">20</code> 这样的具体像素值,可以是像 <code class="codespan">'20%'</code> 这样相对于容器高宽的百分比,也可以是 <code class="codespan">'left'</code>, <code class="codespan">'center'</code>, <code class="codespan">'right'</code>。</p>\n<p>如果 <code class="codespan">left</code> 的值为<code class="codespan">'left'</code>, <code class="codespan">'center'</code>, <code class="codespan">'right'</code>,组件会根据相应的位置自动对齐。</p>\n',uiControl:{type:"percent",default:"0%"}},top:{desc:'\n\n<p>图例组件离容器上侧的距离。</p>\n<p><code class="codespan">top</code> 的值可以是像 <code class="codespan">20</code> 这样的具体像素值,可以是像 <code class="codespan">'20%'</code> 这样相对于容器高宽的百分比,也可以是 <code class="codespan">'top'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'bottom'</code>。</p>\n<p>如果 <code class="codespan">top</code> 的值为<code class="codespan">'top'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'bottom'</code>,组件会根据相应的位置自动对齐。</p>\n',uiControl:{type:"percent",default:"0%"}},right:{desc:'\n\n<p>图例组件离容器右侧的距离。</p>\n<p><code class="codespan">right</code> 的值可以是像 <code class="codespan">20</code> 这样的具体像素值,可以是像 <code class="codespan">'20%'</code> 这样相对于容器高宽的百分比。</p>\n<p>默认自适应。</p>\n',uiControl:{type:"percent",default:"0%"}},bottom:{desc:'\n\n<p>图例组件离容器下侧的距离。</p>\n<p>bottom 的值可以是像 <code class="codespan">20</code> 这样的具体像素值,可以是像 <code class="codespan">'20%'</code> 这样相对于容器高宽的百分比。</p>\n<p>默认自适应。</p>\n',uiControl:{type:"percent",default:"0%"}},width:{desc:"\n\n<p>图例组件的宽度。默认自适应。</p>\n",uiControl:{type:"percent",default:"50%"}},height:{desc:"\n\n<p>图例组件的高度。默认自适应。</p>\n",uiControl:{type:"percent",default:"50%"}},orient:{desc:'\n\n<p>图例列表的布局朝向。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'horizontal'</code></li>\n<li><code class="codespan">'vertical'</code></li>\n</ul>\n',uiControl:{type:"enum",options:"vertical,horizontal",default:"horizontal"}},align:{desc:'\n\n<p>图例标记和文本的对齐。默认自动,根据组件的位置和 orient 决定,当组件的 <a href="#legend.left">left</a> 值为 <code class="codespan">'right'</code> 以及纵向布局(<a href="#legend.orient">orient</a> 为 <code class="codespan">'vertical'</code>)的时候为右对齐,即为 <code class="codespan">'right'</code>。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'auto'</code></li>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n',uiControl:{type:"enum",options:"auto,left,right",default:"auto"}},padding:{desc:'\n\n\n\n\n\n<p>图例内边距,单位px,默认各方向内边距为5,接受数组分别设定上右下左边距。</p>\n<p>使用示例:</p>\n<pre><code class="lang-js">// 设置内边距为 5\npadding: 5\n// 设置上下的内边距为 5,左右的内边距为 10\npadding: [5, 10]\n// 分别设置四个方向的内边距\npadding: [\n 5, // 上\n 10, // 右\n 5, // 下\n 10, // 左\n]\n</code></pre>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},itemGap:{desc:"\n\n<p>图例每项之间的间隔。横向布局时为水平间隔,纵向布局时为纵向间隔。</p>\n",uiControl:{type:"number",default:"10",min:"0",step:"0.5"}},itemWidth:{desc:"\n\n<p>图例标记的图形宽度。</p>\n",uiControl:{type:"number",default:"25",min:"0",step:"0.5"}},itemHeight:{desc:"\n\n<p>图例标记的图形高度。</p>\n",uiControl:{type:"number",default:"14",min:"0",step:"0.5"}},symbolKeepAspect:{desc:'\n\n<p>如果图标(可能来自系列的 <code class="codespan">symbol</code> 或用户自定义的 <code class="codespan">legend.data.icon</code>)是 <code class="codespan">path://</code> 的形式,是否在缩放时保持该图形的长宽比。</p>\n',uiControl:{type:"boolean"}},formatter:{desc:'<p>用来格式化图例文本,支持字符串模板和回调函数两种形式。</p>\n<p>示例:</p>\n<pre><code class="lang-js">// 使用字符串模板,模板变量为图例名称 {name}\nformatter: 'Legend {name}'\n// 使用回调函数\nformatter: function (name) {\n return 'Legend ' + name;\n}\n</code></pre>\n'},selectedMode:{desc:'\n\n<p>图例选择的模式,控制是否可以通过点击图例改变系列的显示状态。默认开启图例选择,可以设成 <code class="codespan">false</code> 关闭。</p>\n<p>除此之外也可以设成 <code class="codespan">'single'</code> 或者 <code class="codespan">'multiple'</code> 使用单选或者多选模式。</p>\n',uiControl:{type:"boolean",options:"true,false,single,multiple"}},inactiveColor:{desc:"\n\n<p>图例关闭时的颜色。</p>\n",uiControl:{type:"color",default:"#ccc"}},selected:{desc:"<p>图例选中状态表。</p>\n<p>示例:</p>\n<pre><code>selected: {\n // 选中'系列1'\n '系列1': true,\n // 不选中'系列2'\n '系列2': false\n}\n</code></pre>"},textStyle:{desc:"<p>图例的公用文本样式。</p>\n"},"textStyle.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"#333"}},"textStyle.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"textStyle.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"textStyle.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"textStyle.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"textStyle.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"textStyle.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"textStyle.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"textStyle.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"textStyle.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"textStyle.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"textStyle.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"textStyle.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"textStyle.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"textStyle.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"textStyle.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"textStyle.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"textStyle.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"textStyle.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"textStyle.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"textStyle.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"textStyle.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"textStyle.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"textStyle.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"textStyle.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"textStyle.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"textStyle.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"textStyle.rich.<style_name>.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"textStyle.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"textStyle.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"textStyle.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"textStyle.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"textStyle.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"textStyle.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"textStyle.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"textStyle.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"textStyle.rich.<style_name>.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"textStyle.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"textStyle.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"textStyle.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"textStyle.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"textStyle.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"textStyle.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"textStyle.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"textStyle.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"textStyle.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"textStyle.rich.<style_name>.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"textStyle.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"textStyle.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"textStyle.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"textStyle.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"textStyle.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},tooltip:{desc:'<p>图例的 tooltip 配置,配置项同 <a href="#tooltip">tooltip</a>。默认不显示,可以在 legend 文字很多的时候对文字做裁剪并且开启 tooltip,如下示例:</p>\n<pre><code class="lang-js">legend: {\n formatter: function (name) {\n return echarts.format.truncateText(name, 40, '14px Microsoft Yahei', '…');\n },\n tooltip: {\n show: true\n }\n}\n</code></pre>\n'},icon:{desc:'\n\n<p>图例项的 icon。</p>\n<p>ECharts 提供的标记类型包括</p>\n<p><code class="codespan">'circle'</code>, <code class="codespan">'rect'</code>, <code class="codespan">'roundRect'</code>, <code class="codespan">'triangle'</code>, <code class="codespan">'diamond'</code>, <code class="codespan">'pin'</code>, <code class="codespan">'arrow'</code>, <code class="codespan">'none'</code></p>\n<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>',uiControl:{type:"icon"}},data:{desc:'<p>图例的数据数组。数组项通常为一个字符串,每一项代表一个系列的 <code class="codespan">name</code>(如果是<a href="#series-pie">饼图</a>,也可以是饼图单个数据的 <code class="codespan">name</code>)。图例组件会自动根据对应系列的图形标记(symbol)来绘制自己的颜色和标记,特殊字符串 <code class="codespan">''</code>(空字符串)或者 <code class="codespan">'\\n'</code>(换行字符串)用于图例的换行。</p>\n<p>如果 <code class="codespan">data</code> 没有被指定,会自动从当前系列中获取。多数系列会取自 <a href="#series.name">series.name</a> 或者 <a href="#series.encode">series.encode</a> 的 <code class="codespan">seriesName</code> 所指定的维度。如 <a href="#series-pie">饼图</a> and <a href="#series-funnel">漏斗图</a> 等会取自 series.data 中的 name。</p>\n<p>如果要设置单独一项的样式,也可以把该项写成配置项对象。此时必须使用 <code class="codespan">name</code> 属性对应表示系列的 <code class="codespan">name</code>。</p>\n<p>示例</p>\n<pre><code>data: [{\n name: '系列1',\n // 强制设置图形为圆。\n icon: 'circle',\n // 设置文本为红色\n textStyle: {\n color: 'red'\n }\n}]\n</code></pre>'},"data.name":{desc:'<p>图例项的名称,应等于某系列的<code class="codespan">name</code>值(如果是饼图,也可以是饼图单个数据的 <code class="codespan">name</code>)。</p>\n'},"data.icon":{desc:'<p>图例项的 icon。</p>\n<p>ECharts 提供的标记类型包括</p>\n<p><code class="codespan">'circle'</code>, <code class="codespan">'rect'</code>, <code class="codespan">'roundRect'</code>, <code class="codespan">'triangle'</code>, <code class="codespan">'diamond'</code>, <code class="codespan">'pin'</code>, <code class="codespan">'arrow'</code>, <code class="codespan">'none'</code></p>\n<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>'},"data.textStyle":{desc:"<p>图例项的文本样式。</p>\n"},backgroundColor:{desc:'\n\n<p>图例背景色,默认透明。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code> ,如果想要加上 alpha 通道,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code></p>\n</blockquote>\n',uiControl:{type:"color"}},borderColor:{desc:"\n\n<p>图例的边框颜色。支持的颜色格式同 backgroundColor。</p>\n",uiControl:{type:"color",default:"#ccc"}},borderWidth:{desc:"\n\n<p>图例的边框线宽。</p>\n",uiControl:{type:"number",default:"1",min:"0",step:"0.5"}},borderRadius:{desc:"\n\n<p>圆角半径,单位px,支持传入数组分别指定 4 个圆角半径。\n如:</p>\n<pre><code>borderRadius: 5, // 统一设置四个角的圆角大小\nborderRadius: [5, 5, 0, 0] //(顺时针左上,右上,右下,左下)\n</code></pre>",uiControl:{type:"vector",min:"0",dims:"LT,RT,RB,LB"}},shadowBlur:{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n<p><strong>注意</strong>:此配置项生效的前提是,设置了 <code class="codespan">show: true</code> 以及值不为 <code class="codespan">tranparent</code> 的背景色 <code class="codespan">backgroundColor</code>。</p>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},shadowColor:{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n<p><strong>注意</strong>:此配置项生效的前提是,设置了 <code class="codespan">show: true</code>。</p>\n',uiControl:{type:"color",default:""}},shadowOffsetX:{desc:'\n\n<p>阴影水平方向上的偏移距离。</p>\n<p><strong>注意</strong>:此配置项生效的前提是,设置了 <code class="codespan">show: true</code>。</p>\n',uiControl:{type:"number",default:"0",step:"0.5"}},shadowOffsetY:{desc:'\n\n<p>阴影垂直方向上的偏移距离。</p>\n<p><strong>注意</strong>:此配置项生效的前提是,设置了 <code class="codespan">show: true</code>。</p>\n',uiControl:{type:"number",default:"0",step:"0.5"}},scrollDataIndex:{desc:'<p><a href="#legend.type">legend.type</a> 为 <code class="codespan">'scroll'</code> 时有效。</p>\n<p>图例当前最左上显示项的 <code class="codespan">dataIndex</code>。</p>\n<p><code class="codespan">setOption</code> 时指定此项的话,可决定当前图例滚动到哪里。</p>\n<p>但是,如果仅仅想改变图例翻页,一般并不调用 <code class="codespan">setOption</code>(因为这太重量了),仅仅使用 action <a href="api.html#action.legend.legendScroll" target="_blank">legendScroll</a> 即可。</p>\n<p>参见 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=pie-legend&edit=1&reset=1" target="_blank">滚动图例(垂直)</a> 或 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=radar2&edit=1&reset=1" target="_blank">滚动图例(水平)</a>。</p>\n'},pageButtonItemGap:{desc:'<p><a href="#legend.type">legend.type</a> 为 <code class="codespan">'scroll'</code> 时有效。</p>\n<p>图例控制块中,按钮和页信息之间的间隔。</p>\n<p>参见 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=pie-legend&edit=1&reset=1" target="_blank">滚动图例(垂直)</a> 或 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=radar2&edit=1&reset=1" target="_blank">滚动图例(水平)</a>。</p>\n'},pageButtonGap:{desc:'<p><a href="#legend.type">legend.type</a> 为 <code class="codespan">'scroll'</code> 时有效。</p>\n<p>图例控制块和图例项之间的间隔。</p>\n<p>参见 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=pie-legend&edit=1&reset=1" target="_blank">滚动图例(垂直)</a> 或 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=radar2&edit=1&reset=1" target="_blank">滚动图例(水平)</a>。</p>\n'},pageButtonPosition:{desc:'<p><a href="#legend.type">legend.type</a> 为 <code class="codespan">'scroll'</code> 时有效。</p>\n<p>图例控制块的位置。可选值为:</p>\n<ul>\n<li><code class="codespan">'start'</code>:控制块在左或上。</li>\n<li><code class="codespan">'end'</code>:控制块在右或下。</li>\n</ul>\n<p>参见 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=pie-legend&edit=1&reset=1" target="_blank">滚动图例(垂直)</a> 或 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=radar2&edit=1&reset=1" target="_blank">滚动图例(水平)</a>。</p>\n'},pageFormatter:{desc:'<p><a href="#legend.type">legend.type</a> 为 <code class="codespan">'scroll'</code> 时有效。</p>\n<p>图例控制块中,页信息的显示格式。默认为 <code class="codespan">'{current}/{total}'</code>,其中 <code class="codespan">{current}</code> 是当前页号(从 1 开始计数),<code class="codespan">{total}</code> 是总页数。</p>\n<p>如果 <code class="codespan">pageFormatter</code> 使用函数,须返回字符串,参数为:</p>\n<pre><code class="lang-js">{\n current: number\n total: number\n}\n</code></pre>\n<p>参见 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=pie-legend&edit=1&reset=1" target="_blank">滚动图例(垂直)</a> 或 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=radar2&edit=1&reset=1" target="_blank">滚动图例(水平)</a>。</p>\n'},pageIcons:{desc:'<p><a href="#legend.type">legend.type</a> 为 <code class="codespan">'scroll'</code> 时有效。</p>\n<p>图例控制块的图标。</p>\n'},"pageIcons.horizontal":{desc:'<p><a href="#legend.orient">legend.orient</a> 为 <code class="codespan">'horizontal'</code> 时的翻页按钮图标。</p>\n<p>是一个数组,表示 <code class="codespan">[previous page button, next page button]</code>。默认值为 <code class="codespan">['M0,0L12,-10L12,10z', 'M0,0L-12,-10L-12,10z']</code>,。</p>\n<p>数组中每项,</p>\n<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre><p>参见 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=pie-legend&edit=1&reset=1" target="_blank">滚动图例(垂直)</a> 或 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=radar2&edit=1&reset=1" target="_blank">滚动图例(水平)</a>。</p>\n'},"pageIcons.vertical":{desc:'<p><a href="#legend.orient">legend.orient</a> 为 <code class="codespan">'vertical'</code> 时的翻页按钮图标。</p>\n<p>是一个数组,表示 <code class="codespan">[previous page button, next page button]</code>。默认值为 <code class="codespan">['M0,0L20,0L10,-20z', 'M0,0L20,0L10,20z']</code>,。</p>\n<p>数组中每项,</p>\n<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre><p>参见 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=pie-legend&edit=1&reset=1" target="_blank">滚动图例(垂直)</a> 或 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=radar2&edit=1&reset=1" target="_blank">滚动图例(水平)</a>。</p>\n'},pageIconColor:{desc:'\n\n<p><a href="#legend.type">legend.type</a> 为 <code class="codespan">'scroll'</code> 时有效。</p>\n<p>翻页按钮的颜色。</p>\n<p>参见 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=pie-legend&edit=1&reset=1" target="_blank">滚动图例(垂直)</a> 或 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=radar2&edit=1&reset=1" target="_blank">滚动图例(水平)</a>。</p>\n',uiControl:{type:"color",default:"#2f4554"}},pageIconInactiveColor:{desc:'\n\n<p><a href="#legend.type">legend.type</a> 为 <code class="codespan">'scroll'</code> 时有效。</p>\n<p>翻页按钮不激活时(即翻页到头时)的颜色。</p>\n<p>参见 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=pie-legend&edit=1&reset=1" target="_blank">滚动图例(垂直)</a> 或 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=radar2&edit=1&reset=1" target="_blank">滚动图例(水平)</a>。</p>\n',uiControl:{type:"color",default:"#aaa"}},pageIconSize:{desc:'\n\n<p><a href="#legend.type">legend.type</a> 为 <code class="codespan">'scroll'</code> 时有效。</p>\n<p>翻页按钮的大小。可以是数字,也可以是数组,如 <code class="codespan">[10, 3]</code>,表示 <code class="codespan">[宽,高]</code>。</p>\n<p>参见 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=pie-legend&edit=1&reset=1" target="_blank">滚动图例(垂直)</a> 或 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=radar2&edit=1&reset=1" target="_blank">滚动图例(水平)</a>。</p>\n',uiControl:{type:"vector",default:"15,15",dims:"w,h"}},pageTextStyle:{desc:'<p><a href="#legend.type">legend.type</a> 为 <code class="codespan">'scroll'</code> 时有效。</p>\n<p>图例页信息的文字样式。</p>\n'},"pageTextStyle.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"#333"}},"pageTextStyle.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"pageTextStyle.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"pageTextStyle.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"pageTextStyle.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"pageTextStyle.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"pageTextStyle.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"pageTextStyle.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"pageTextStyle.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"pageTextStyle.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"pageTextStyle.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"pageTextStyle.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"pageTextStyle.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"pageTextStyle.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"pageTextStyle.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"pageTextStyle.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"pageTextStyle.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},animation:{desc:"\n\n<p>图例翻页是否使用动画。</p>\n",uiControl:{type:"boolean",default:"true"}},animationDurationUpdate:{desc:"\n\n<p>图例翻页时的动画时长。</p>\n",uiControl:{type:"number",min:"0",default:"800",step:"20"}},"emphasis.selectorLabel":{desc:'<blockquote>\n<p>从 <code class="codespan">v4.4.0</code> 开始支持</p>\n</blockquote>\n'},"emphasis.selectorLabel.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"true"}},"emphasis.selectorLabel.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"emphasis.selectorLabel.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"emphasis.selectorLabel.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"emphasis.selectorLabel.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"emphasis.selectorLabel.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"emphasis.selectorLabel.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"emphasis.selectorLabel.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"emphasis.selectorLabel.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"emphasis.selectorLabel.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"emphasis.selectorLabel.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"emphasis.selectorLabel.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"emphasis.selectorLabel.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"emphasis.selectorLabel.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"emphasis.selectorLabel.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.selectorLabel.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"emphasis.selectorLabel.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"emphasis.selectorLabel.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"emphasis.selectorLabel.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.selectorLabel.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.selectorLabel.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.selectorLabel.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"emphasis.selectorLabel.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"emphasis.selectorLabel.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"emphasis.selectorLabel.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.selectorLabel.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"emphasis.selectorLabel.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.selectorLabel.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.selectorLabel.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.selectorLabel.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"emphasis.selectorLabel.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"emphasis.selectorLabel.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"emphasis.selectorLabel.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"emphasis.selectorLabel.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"emphasis.selectorLabel.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"emphasis.selectorLabel.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"emphasis.selectorLabel.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"emphasis.selectorLabel.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"emphasis.selectorLabel.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"emphasis.selectorLabel.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"emphasis.selectorLabel.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"emphasis.selectorLabel.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"emphasis.selectorLabel.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"emphasis.selectorLabel.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.selectorLabel.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"emphasis.selectorLabel.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"emphasis.selectorLabel.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"emphasis.selectorLabel.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.selectorLabel.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.selectorLabel.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.selectorLabel.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"emphasis.selectorLabel.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"emphasis.selectorLabel.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"emphasis.selectorLabel.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.selectorLabel.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"emphasis.selectorLabel.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.selectorLabel.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.selectorLabel.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},selector:{desc:'<blockquote>\n<p>从 <code class="codespan">v4.4.0</code> 开始支持</p>\n</blockquote>\n<p>图例组件中的选择器按钮,目前包括全选和反选两种功能。默认不显示,用户可手动开启,也可以手动配置每个按钮的标题。</p>\n<p>使用方式如下:</p>\n<pre><code class="lang-js">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</code></pre>\n'},selectorLabel:{desc:'<blockquote>\n<p>从 <code class="codespan">v4.4.0</code> 开始支持</p>\n</blockquote>\n<p>选择器按钮的文本标签样式,默认显示。</p>\n'},"selectorLabel.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"true"}},"selectorLabel.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"selectorLabel.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"selectorLabel.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"selectorLabel.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"selectorLabel.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"selectorLabel.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"selectorLabel.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"selectorLabel.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"selectorLabel.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"selectorLabel.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"selectorLabel.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"selectorLabel.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"selectorLabel.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"selectorLabel.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"selectorLabel.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"selectorLabel.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"selectorLabel.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"selectorLabel.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"selectorLabel.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"selectorLabel.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"selectorLabel.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"selectorLabel.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"selectorLabel.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"selectorLabel.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"selectorLabel.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"selectorLabel.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"selectorLabel.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"selectorLabel.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"selectorLabel.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"selectorLabel.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"selectorLabel.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"selectorLabel.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"selectorLabel.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"selectorLabel.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"selectorLabel.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"selectorLabel.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"selectorLabel.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"selectorLabel.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"selectorLabel.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"selectorLabel.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"selectorLabel.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"selectorLabel.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"selectorLabel.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"selectorLabel.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"selectorLabel.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"selectorLabel.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"selectorLabel.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"selectorLabel.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"selectorLabel.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"selectorLabel.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"selectorLabel.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"selectorLabel.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"selectorLabel.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"selectorLabel.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"selectorLabel.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"selectorLabel.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"selectorLabel.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},selectorPosition:{desc:'\n\n\n\n<blockquote>\n<p>从 <code class="codespan">v4.4.0</code> 开始支持</p>\n</blockquote>\n<p>选择器的位置,可以放在图例的尾部或者头部,对应的值分别为 <code class="codespan">'end'</code> 和 <code class="codespan">'start'</code>。默认情况下,图例横向布局的时候,选择器放在图例的尾部;图例纵向布局的时候,选择器放在图例的头部。</p>\n',uiControl:{type:"enum",options:"auto,start,end"}},selectorItemGap:{desc:'\n\n\n\n<blockquote>\n<p>从 <code class="codespan">v4.4.0</code> 开始支持</p>\n</blockquote>\n<p>选择器按钮之间的间隔。</p>\n',uiControl:{type:"number",min:"0",default:"7",step:"0.5"}},selectorButtonGap:{desc:'\n\n\n\n<blockquote>\n<p>从 <code class="codespan">v4.4.0</code> 开始支持</p>\n</blockquote>\n<p>选择器按钮与图例组件之间的间隔。</p>\n',uiControl:{type:"number",min:"0",default:"10",step:"0.5"}}}))]},{title:"位置",body:[(0,s.createHierarchy)("legend",[(0,s.viewport)("","图例")])]},{title:"样式",body:[(0,s.createHierarchy)("legend",(0,s.commonStyle)("","图例"))]},{title:"文字样式",body:[(0,s.createHierarchy)("legend",[(0,s.textStyleControls)("textStyle","图例"),(0,s.textStyleControls)("pageTextStyle","图例页信息")])]},{title:"数据",body:[(0,s.createHierarchy)("legend",[])]}]}}));
|
||
;/*!examples/components/EChartsEditor/Global.tsx*/
|
||
amis.define("513c7dd",(function(e,t,a,o){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var l=e("b666d70");t.default={type:"tabs",tabs:[{title:"主题",body:[{type:"input-array",name:"color",label:"调色盘颜色列表",labelRemark:"如果系列没有设置颜色,则会依次循环从该列表中取颜色作为系列颜色",value:["#c23531","#2f4554","#61a0a8","#d48265","#91c7ae","#749f83","#ca8622","#bda29a","#6e7074","#546570","#c4ccd3"],items:{type:"color"}},(0,l.color)("backgroundColor","背景色")]},{title:"动画",body:[(0,l.animation)(void 0,!1)]},{title:"文字样式",body:[(0,l.textStyleControls)("textStyle","全局文字")]},{title:"其它",body:[(0,l.text)("blendMode","图形的混合模式","不同的混合模式见 https://developer.mozilla.org/zh-CN/docs/Web/API/CanvasRenderingContext2D/globalCompositeOperation ","source-over"),(0,l.number)("hoverLayerThreshold","图形数量阈值","决定是否开启单独的 hover 层,在整个图表的图形数量大于该阈值时开启单独的 hover 层。单独的 hover 层主要是为了在高亮图形的时候不需要重绘整个图表,只需要把高亮的图形放入单独的一个 canvas 层进行绘制,防止在图形数量很多的时候因为高亮重绘所有图形导致卡顿",3e3),(0,l.falseSwitch)("useUTC","是否使用 UTC 时间","true: 表示 axis.type 为 'time' 时,依据 UTC 时间确定 tick 位置,并且 axisLabel 和 tooltip 默认展示的是 UTC 时间。\n false: 表示 axis.type 为 'time' 时,依据本地时间确定 tick 位置,并且 axisLabel 和 tooltip 默认展示的是本地时间。\n 默认取值为false,即使用本地时间。因为考虑到:\n\n 很多情况下,需要展示为本地时间(无论服务器存储的是否为 UTC 时间)。\n 如果 data 中的时间为 '2012-01-02' 这样的没有指定时区的时间表达式,往往意为本地时间。默认情况下,时间被展示时需要和输入一致而非有时差。")]}]}}));
|
||
;/*!examples/components/EChartsEditor/Axis.tsx*/
|
||
amis.define("def9c51",(function(e,n,o,s){"use strict";Object.defineProperty(n,"__esModule",{value:!0});var c=e("b666d70"),a={id:{desc:"<p>组件 ID。默认不指定。指定则可用于在 option 或者 API 中引用组件。</p>\n"},show:{desc:"\n\n<p>是否显示 x 轴。</p>\n",uiControl:{type:"boolean",default:"true"}},gridIndex:{desc:"<p>x 轴所在的 grid 的索引,默认位于第一个 grid。</p>\n"},position:{desc:'\n\n<p>x 轴的位置。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p>默认 grid 中的第一个 x 轴在 grid 的下方(<code class="codespan">'bottom'</code>),第二个 x 轴视第一个 x 轴的位置放在另一侧。</p>\n',uiControl:{type:"enum",options:"top,bottom",default:"bottom"}},offset:{desc:'\n\n<p>X 轴相对于默认位置的偏移,在相同的 <code class="codespan">position</code> 上有多个 X 轴的时候有用。</p>\n',uiControl:{type:"number",step:"0.5"}},realtimeSort:{desc:'<p>用于制作动态排序柱状图。设为 <code class="codespan">true</code> 时,表示 X 轴开启实时排序效果,仅当 X 轴的 <a href="#xAxis.type">type</a> 是 <code class="codespan">'value'</code> 时有效。</p>\n<p>需要配合其他配置项共同实现动态排序柱状图效果,具体参见<a href="tutorial.html#%E5%8A%A8%E6%80%81%E6%8E%92%E5%BA%8F%E6%9F%B1%E7%8A%B6%E5%9B%BE" target="_blank">动态排序柱状图</a>教程。</p>\n'},sortSeriesIndex:{desc:'<p>动态排序柱状图用于排序的系列 id。目前只支持一个系列的柱状图排序效果,所以这个值只能取 0。仅当 X 轴 <a href="#xAxis.realtimeSort">realtimeSort</a> 为 <code class="codespan">true</code> 并且 <a href="#xAxis.type">type</a> 是 <code class="codespan">'value'</code> 时有效。</p>\n<p>需要配合其他配置项共同实现动态排序柱状图效果,具体参见<a href="tutorial.html#%E5%8A%A8%E6%80%81%E6%8E%92%E5%BA%8F%E6%9F%B1%E7%8A%B6%E5%9B%BE" target="_blank">动态排序柱状图</a>教程。</p>\n'},type:{desc:'<p>坐标轴类型。</p>\n<p>可选:</p>\n<ul>\n<li><p><code class="codespan">'value'</code>\n 数值轴,适用于连续数据。</p>\n</li>\n<li><p><code class="codespan">'category'</code>\n 类目轴,适用于离散的类目数据。为该类型时类目数据可自动从 <a href="#series.data">series.data</a> 或 <a href="#dataset.source">dataset.source</a> 中取,或者可通过 <a href="#xAxis.data">xAxis.data</a> 设置类目数据。</p>\n</li>\n<li><p><code class="codespan">'time'</code>\n 时间轴,适用于连续的时序数据,与数值轴相比时间轴带有时间的格式化,在刻度计算上也有所不同,例如会根据跨度的范围来决定使用月,星期,日还是小时范围的刻度。</p>\n</li>\n<li><p><code class="codespan">'log'</code>\n 对数轴。适用于对数数据。</p>\n</li>\n</ul>\n'},name:{desc:"\n\n<p>坐标轴名称。</p>\n",uiControl:{type:"text"}},nameLocation:{desc:'\n\n<p>坐标轴名称显示位置。</p>\n<p><strong>可选:</strong></p>\n<ul>\n<li><code class="codespan">'start'</code></li>\n<li><code class="codespan">'middle'</code> 或者 <code class="codespan">'center'</code></li>\n<li><code class="codespan">'end'</code></li>\n</ul>\n',uiControl:{type:"enum",options:"start,middle,end",default:"end"}},nameTextStyle:{desc:"<p>坐标轴名称的文字样式。</p>\n"},"nameTextStyle.color":{desc:'\n\n<p>坐标轴名称的颜色,默认取 <a href="#xAxis.axisLine.lineStyle.color">axisLine.lineStyle.color</a>。</p>\n',uiControl:{type:"color"}},"nameTextStyle.fontStyle":{desc:'\n\n<p>坐标轴名称文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"nameTextStyle.fontWeight":{desc:'\n\n<p>坐标轴名称文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"nameTextStyle.fontFamily":{desc:"\n\n<p>坐标轴名称文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"nameTextStyle.fontSize":{desc:"\n\n<p>坐标轴名称文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"nameTextStyle.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"nameTextStyle.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"nameTextStyle.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"nameTextStyle.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"nameTextStyle.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"nameTextStyle.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"nameTextStyle.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"nameTextStyle.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"nameTextStyle.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"nameTextStyle.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"nameTextStyle.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"nameTextStyle.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"nameTextStyle.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"nameTextStyle.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"nameTextStyle.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"nameTextStyle.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"nameTextStyle.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"nameTextStyle.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"nameTextStyle.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"nameTextStyle.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"nameTextStyle.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"nameTextStyle.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"nameTextStyle.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"nameTextStyle.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"nameTextStyle.rich.<style_name>.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"nameTextStyle.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"nameTextStyle.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"nameTextStyle.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"nameTextStyle.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"nameTextStyle.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"nameTextStyle.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"nameTextStyle.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"nameTextStyle.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"nameTextStyle.rich.<style_name>.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"nameTextStyle.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"nameTextStyle.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"nameTextStyle.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"nameTextStyle.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"nameTextStyle.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"nameTextStyle.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"nameTextStyle.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"nameTextStyle.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"nameTextStyle.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"nameTextStyle.rich.<style_name>.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"nameTextStyle.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"nameTextStyle.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"nameTextStyle.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"nameTextStyle.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"nameTextStyle.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n\n",uiControl:{type:"number",step:"0.5"}},nameGap:{desc:"\n\n<p>坐标轴名称与轴线之间的距离。</p>\n",uiControl:{type:"number",step:"0.5",default:"15"}},nameRotate:{desc:"\n\n<p>坐标轴名字旋转,角度值。</p>\n",uiControl:{type:"angle",min:"-360",max:"360",step:"1"}},inverse:{desc:"\n\n<p>是否是反向坐标轴。</p>\n",uiControl:{type:"boolean"}},boundaryGap:{desc:'\n\n<p>坐标轴两边留白策略,类目轴和非类目轴的设置和表现不一样。</p>\n<p>类目轴中 <code class="codespan">boundaryGap</code> 可以配置为 <code class="codespan">true</code> 和 <code class="codespan">false</code>。默认为 <code class="codespan">true</code>,这时候<a href="#xAxis.axisTick">刻度</a>只是作为分隔线,标签和数据点都会在两个<a href="#xAxis.axisTick">刻度</a>之间的带(band)中间。</p>\n<p>非类目轴,包括时间,数值,对数轴,<code class="codespan">boundaryGap</code>是一个两个值的数组,分别表示数据最小值和最大值的延伸范围,可以直接设置数值或者相对的百分比,在设置 <a href="#xAxis.min">min</a> 和 <a href="#xAxis.max">max</a> 后无效。\n<strong>示例:</strong></p>\n<pre><code class="lang-js">boundaryGap: ['20%', '20%']\n</code></pre>\n',uiControl:{type:"boolean"}},min:{desc:'\n\n<p>坐标轴刻度最小值。</p>\n<p>可以设置成特殊值 <code class="codespan">'dataMin'</code>,此时取数据在该轴上的最小值作为最小刻度。</p>\n<p>不设置时会自动计算最小值保证坐标轴刻度的均匀分布。</p>\n<p>在类目轴中,也可以设置为类目的序数(如类目轴 <code class="codespan">data: ['类A', '类B', '类C']</code> 中,序数 <code class="codespan">2</code> 表示 <code class="codespan">'类C'</code>。也可以设置为负数,如 <code class="codespan">-3</code>)。</p>\n<p>当设置成 <code class="codespan">function</code> 形式时,可以根据计算得出的数据最大最小值设定坐标轴的最小值。如:</p>\n<pre><code class="lang-js">min: function (value) {\n return value.min - 20;\n}\n</code></pre>\n<p>其中 <code class="codespan">value</code> 是一个包含 <code class="codespan">min</code> 和 <code class="codespan">max</code> 的对象,分别表示数据的最大最小值,这个函数可返回坐标轴的最小值,也可返回 <code class="codespan">null</code>/<code class="codespan">undefined</code> 来表示“自动计算最小值”(返回 <code class="codespan">null</code>/<code class="codespan">undefined</code> 从 <code class="codespan">v4.8.0</code> 开始支持)。</p>\n',uiControl:{type:"number"}},max:{desc:'\n\n<p>坐标轴刻度最大值。</p>\n<p>可以设置成特殊值 <code class="codespan">'dataMax'</code>,此时取数据在该轴上的最大值作为最大刻度。</p>\n<p>不设置时会自动计算最大值保证坐标轴刻度的均匀分布。</p>\n<p>在类目轴中,也可以设置为类目的序数(如类目轴 <code class="codespan">data: ['类A', '类B', '类C']</code> 中,序数 <code class="codespan">2</code> 表示 <code class="codespan">'类C'</code>。也可以设置为负数,如 <code class="codespan">-3</code>)。</p>\n<p>当设置成 <code class="codespan">function</code> 形式时,可以根据计算得出的数据最大最小值设定坐标轴的最小值。如:</p>\n<pre><code class="lang-js">max: function (value) {\n return value.max - 20;\n}\n</code></pre>\n<p>其中 <code class="codespan">value</code> 是一个包含 <code class="codespan">min</code> 和 <code class="codespan">max</code> 的对象,分别表示数据的最大最小值,这个函数可返回坐标轴的最大值,也可返回 <code class="codespan">null</code>/<code class="codespan">undefined</code> 来表示“自动计算最大值”(返回 <code class="codespan">null</code>/<code class="codespan">undefined</code> 从 <code class="codespan">v4.8.0</code> 开始支持)。</p>\n',uiControl:{type:"number"}},scale:{desc:'\n\n<p>只在数值轴中(<a href="#xAxis.type">type</a>: 'value')有效。</p>\n<p>是否是脱离 0 值比例。设置成 <code class="codespan">true</code> 后坐标刻度不会强制包含零刻度。在双数值轴的散点图中比较有用。</p>\n<p>在设置 <a href="#xAxis.min">min</a> 和 <a href="#xAxis.max">max</a> 之后该配置项无效。</p>\n',uiControl:{type:"boolean"}},splitNumber:{desc:"\n\n<p>坐标轴的分割段数,需要注意的是这个分割段数只是个预估值,最后实际显示的段数会在这个基础上根据分割后坐标轴刻度显示的易读程度作调整。</p>\n<p>在类目轴中无效。</p>\n",uiControl:{type:"number",min:"1",step:"1",default:"5"}},minInterval:{desc:'\n\n<p>自动计算的坐标轴最小间隔大小。</p>\n<p>例如可以设置成<code class="codespan">1</code>保证坐标轴分割刻度显示成整数。</p>\n<pre><code class="lang-js">{\n minInterval: 1\n}\n</code></pre>\n<p>只在数值轴或时间轴中(<a href="#xAxis.type">type</a>: 'value' 或 'time')有效。</p>\n',uiControl:{type:"number"}},maxInterval:{desc:'\n\n<p>自动计算的坐标轴最大间隔大小。</p>\n<p>例如,在时间轴((<a href="#xAxis.type">type</a>: 'time'))可以设置成 <code class="codespan">3600 * 24 * 1000</code> 保证坐标轴分割刻度最大为一天。</p>\n<pre><code class="lang-js">{\n maxInterval: 3600 * 24 * 1000\n}\n</code></pre>\n<p>只在数值轴或时间轴中(<a href="#xAxis.type">type</a>: 'value' 或 'time')有效。</p>\n',uiControl:{type:"number"}},interval:{desc:'\n\n<p>强制设置坐标轴分割间隔。</p>\n<p>因为 <a href="#xAxis.splitNumber">splitNumber</a> 是预估的值,实际根据策略计算出来的刻度可能无法达到想要的效果,这时候可以使用 interval 配合 <a href="#xAxis.min">min</a>、<a href="#xAxis.max">max</a> 强制设定刻度划分,一般不建议使用。</p>\n<p>无法在类目轴中使用。在时间轴(<a href="#xAxis.type">type</a>: 'time')中需要传时间戳,在对数轴(<a href="#xAxis.type">type</a>: 'log')中需要传指数值。</p>\n',uiControl:{type:"number"}},logBase:{desc:'\n\n<p>对数轴的底数,只在对数轴中(<a href="#xAxis.type">type</a>: 'log')有效。</p>\n',uiControl:{type:"number",default:"10"}},silent:{desc:"<p>坐标轴是否是静态无法交互。</p>\n"},triggerEvent:{desc:'<p>坐标轴的标签是否响应和触发鼠标事件,默认不响应。</p>\n<p>事件参数如下:</p>\n<pre><code class="lang-js">{\n // 组件类型,xAxis, yAxis, radiusAxis, angleAxis\n // 对应组件类型都会有一个属性表示组件的 index,例如 xAxis 就是 xAxisIndex\n componentType: string,\n // 未格式化过的刻度值, 点击刻度标签有效\n value: '',\n // 坐标轴名称, 点击坐标轴名称有效\n name: ''\n}\n</code></pre>\n'},axisLine:{desc:"<p>坐标轴轴线相关设置。</p>\n"},"axisLine.show":{desc:"\n\n<p>是否显示坐标轴轴线。</p>\n",uiControl:{type:"boolean",default:"true"}},"axisLine.onZero":{desc:"\n\n<p>X 轴或者 Y 轴的轴线是否在另一个轴的 0 刻度上,只有在另一个轴为数值轴且包含 0 刻度时有效。</p>\n",uiControl:{type:"boolean",default:"true"}},"axisLine.onZeroAxisIndex":{desc:"<p>当有双轴时,可以用这个属性手动指定,在哪个轴的 0 刻度上。</p>\n"},"axisLine.symbol":{desc:'\n\n<p>轴线两边的箭头。可以是字符串,表示两端使用同样的箭头;或者长度为 2 的字符串数组,分别表示两端的箭头。默认不显示箭头,即 <code class="codespan">'none'</code>。两端都显示箭头可以设置为 <code class="codespan">'arrow'</code>,只在末端显示箭头可以设置为 <code class="codespan">['none', 'arrow']</code>。</p>\n',uiControl:{type:"icon",default:"none"}},"axisLine.symbolSize":{desc:"\n\n<p>轴线两边的箭头的大小,第一个数字表示宽度(垂直坐标轴方向),第二个数字表示高度(平行坐标轴方向)。</p>\n",uiControl:{type:"vector",default:"10,15"}},"axisLine.symbolOffset":{desc:"\n\n<p>轴线两边的箭头的偏移,如果是数组,第一个数字表示起始箭头的偏移,第二个数字表示末端箭头的偏移;如果是数字,表示这两个箭头使用同样的偏移。</p>\n",uiControl:{type:"vector",default:"0,0"}},"axisLine.lineStyle.color":{desc:'\n\n<p>坐标轴线线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"axisLine.lineStyle.width":{desc:"\n\n<p>坐标轴线线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"axisLine.lineStyle.type":{desc:'\n\n<p>坐标轴线线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"axisLine.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"axisLine.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"axisLine.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisLine.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisLine.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},axisTick:{desc:"<p>坐标轴刻度相关设置。</p>\n"},"axisTick.show":{desc:"\n\n<p>是否显示坐标轴刻度。</p>\n",uiControl:{type:"boolean",default:"true"}},"axisTick.alignWithLabel":{desc:'\n\n<p>类目轴中在 <code class="codespan">boundaryGap</code> 为 <code class="codespan">true</code> 的时候有效,可以保证刻度线和标签对齐。如下图:</p>\n<p><img width="600" height="auto" src="documents/asset/img/axis-align-with-label.png"></p>\n',uiControl:{type:"boolean",default:"false"}},"axisTick.interval":{desc:'\n\n\n\n<p>坐标轴刻度的显示间隔,在类目轴中有效。默认同 <a href="#xAxis.axisLabel.interval">axisLabel.interval</a> 一样。</p>\n<p>默认会采用标签不重叠的策略间隔显示标签。</p>\n<p>可以设置成 0 强制显示所有标签。</p>\n<p>如果设置为 <code class="codespan">1</code>,表示『隔一个标签显示一个标签』,如果值为 <code class="codespan">2</code>,表示隔两个标签显示一个标签,以此类推。</p>\n<p>可以用数值表示间隔的数据,也可以通过回调函数控制。回调函数格式如下:</p>\n<pre><code class="lang-js">(index:number, value: string) => boolean\n</code></pre>\n<p>第一个参数是类目的 index,第二个值是类目名称,如果跳过则返回 <code class="codespan">false</code>。</p>\n',uiControl:{type:"number",min:"0",step:"1"}},"axisTick.inside":{desc:"\n\n<p>坐标轴刻度是否朝内,默认朝外。</p>\n",uiControl:{type:"boolean"}},"axisTick.length":{desc:"\n\n<p>坐标轴刻度的长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5",default:"5"}},"axisTick.lineStyle":{desc:"<p>刻度线的样式设置。</p>\n"},"axisTick.lineStyle.color":{desc:'<p>刻度线的颜色,默认取 <a href="#xAxis.axisTick.lineStyle.color">axisTick.lineStyle.color</a>。</p>\n'},"axisTick.lineStyle.width":{desc:"\n\n<p>坐标轴刻度线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"axisTick.lineStyle.type":{desc:'\n\n<p>坐标轴刻度线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"axisTick.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"axisTick.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"axisTick.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisTick.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisTick.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},minorTick:{desc:'<blockquote>\n<p>从 <code class="codespan">v4.6.0</code> 开始支持</p>\n</blockquote>\n<p>坐标轴次刻度线相关设置。</p>\n<p>注意:次刻度线无法在类目轴(<a href="#xAxis.type">type</a>: <code class="codespan">'category'</code>)中使用。</p>\n<p>示例:</p>\n<p>1) 函数绘图中使用次刻度线</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=line-function&edit=1&reset=1" width="600" height="350"><iframe />\n\n\n<p>2) 在对数轴中使用次刻度线</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=line-log&edit=1&reset=1" width="600" height="350"><iframe />\n\n'},"minorTick.show":{desc:"\n\n<p>是否显示次刻度线。</p>\n",uiControl:{type:"boolean",default:"true"}},"minorTick.splitNumber":{desc:"\n\n<p>次刻度线分割数,默认会分割成 5 段</p>\n",uiControl:{type:"number",min:"1",step:"1",default:"5"}},"minorTick.length":{desc:"\n\n<p>次刻度线的长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5",default:"3"}},"minorTick.lineStyle.color":{desc:'\n\n<p>刻度线的颜色,默认取 <a href="#xAxis.axisLine.lineStyle.color">axisLine.lineStyle.color</a>。</p>\n',uiControl:{type:"color"}},"minorTick.lineStyle.width":{desc:"\n\n<p>次刻度线线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"minorTick.lineStyle.type":{desc:'\n\n<p>次刻度线线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"minorTick.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"minorTick.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"minorTick.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"minorTick.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"minorTick.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},axisLabel:{desc:"<p>坐标轴刻度标签的相关设置。</p>\n"},"axisLabel.show":{desc:"\n\n<p>是否显示刻度标签。</p>\n",uiControl:{type:"boolean",default:"true"}},"axisLabel.interval":{desc:'\n\n\n\n<p>坐标轴刻度标签的显示间隔,在类目轴中有效。</p>\n<p>默认会采用标签不重叠的策略间隔显示标签。</p>\n<p>可以设置成 0 强制显示所有标签。</p>\n<p>如果设置为 <code class="codespan">1</code>,表示『隔一个标签显示一个标签』,如果值为 <code class="codespan">2</code>,表示隔两个标签显示一个标签,以此类推。</p>\n<p>可以用数值表示间隔的数据,也可以通过回调函数控制。回调函数格式如下:</p>\n<pre><code class="lang-js">(index:number, value: string) => boolean\n</code></pre>\n<p>第一个参数是类目的 index,第二个值是类目名称,如果跳过则返回 <code class="codespan">false</code>。</p>\n',uiControl:{type:"number",min:"0",step:"1"}},"axisLabel.inside":{desc:"\n\n<p>刻度标签是否朝内,默认朝外。</p>\n",uiControl:{type:"boolean"}},"axisLabel.rotate":{desc:"\n\n<p>刻度标签旋转的角度,在类目轴的类目标签显示不下的时候可以通过旋转防止标签之间重叠。</p>\n<p>旋转的角度从 -90 度到 90 度。</p>\n",uiControl:{type:"angle",min:"-90",max:"90",step:"1"}},"axisLabel.margin":{desc:"\n\n<p>刻度标签与轴线之间的距离。</p>\n",uiControl:{type:"number",default:"8",step:"0.5"}},"axisLabel.formatter":{desc:'<p>刻度标签的内容格式器,支持字符串模板和回调函数两种形式。</p>\n<p>示例:</p>\n<pre><code class="lang-js">// 使用字符串模板,模板变量为刻度默认标签 {value}\nformatter: '{value} kg'\n</code></pre>\n<p>对于时间轴(<a href="#.type">type</a>: <code class="codespan">'time'</code>),<code class="codespan">formatter</code> 的字符串模板支持多种形式:</p>\n<ul>\n<li><strong>字符串模板</strong>:简单快速实现常用日期时间模板,<code class="codespan">string</code> 类型</li>\n<li><strong>回调函数</strong>:自定义 formatter,可以用来实现复杂高级的格式,<code class="codespan">Function</code> 类型</li>\n<li><strong>分级模板</strong>:为不同时间粒度的标签使用不同的 formatter,<code class="codespan">object</code> 类型</li>\n</ul>\n<p>下面我们分别介绍这三种形式。</p>\n<p><strong> 字符串模板 </strong></p>\n<p>使用字符串模板是一种方便实现常用日期时间格式化方式的形式。如果字符串模板可以实现你的效果,那我们优先推荐使用此方式;如果无法实现,再考虑其他两种更复杂的方式。支持的模板如下:</p>\n<table>\n<thead>\n<tr>\n<th>分类</th>\n<th>模板</th>\n<th>取值(英文)</th>\n<th>取值(中文)</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>Year</td>\n<td>{yyyy}</td>\n<td>e.g., 2020, 2021, ...</td>\n<td>例:2020, 2021, ...</td>\n</tr>\n<tr>\n<td></td>\n<td>{yy}</td>\n<td>00-99</td>\n<td>00-99</td>\n</tr>\n<tr>\n<td>Quarter</td>\n<td>{Q}</td>\n<td>1, 2, 3, 4</td>\n<td>1, 2, 3, 4</td>\n</tr>\n<tr>\n<td>Month</td>\n<td>{MMMM}</td>\n<td>e.g., January, February, ...</td>\n<td>一月、二月、……</td>\n</tr>\n<tr>\n<td></td>\n<td>{MMM}</td>\n<td>e.g., Jan, Feb, ...</td>\n<td>1月、2月、……</td>\n</tr>\n<tr>\n<td></td>\n<td>{MM}</td>\n<td>01-12</td>\n<td>01-12</td>\n</tr>\n<tr>\n<td></td>\n<td>{M}</td>\n<td>1-12</td>\n<td>1-12</td>\n</tr>\n<tr>\n<td>Day of Month</td>\n<td>{dd}</td>\n<td>01-31</td>\n<td>01-31</td>\n</tr>\n<tr>\n<td></td>\n<td>{d}</td>\n<td>1-31</td>\n<td>1-31</td>\n</tr>\n<tr>\n<td>Day of Week</td>\n<td>{eeee}</td>\n<td>Sunday, Monday, Tuesday, Wednesday, Thursday, Friday, Saturday</td>\n<td>星期日、星期一、星期二、星期三、星期四、星期五、星期六</td>\n</tr>\n<tr>\n<td></td>\n<td>{ee}</td>\n<td>Sun, Mon, Tues, Wed, Thu, Fri, Sat</td>\n<td>日、一、二、三、四、五、六</td>\n</tr>\n<tr>\n<td></td>\n<td>{e}</td>\n<td>1-54</td>\n<td>1-54</td>\n</tr>\n<tr>\n<td>Hour</td>\n<td>{HH}</td>\n<td>00-23</td>\n<td>00-23</td>\n</tr>\n<tr>\n<td></td>\n<td>{H}</td>\n<td>0-23</td>\n<td>0-23</td>\n</tr>\n<tr>\n<td></td>\n<td>{hh}</td>\n<td>01-12</td>\n<td>01-12</td>\n</tr>\n<tr>\n<td></td>\n<td>{h}</td>\n<td>1-12</td>\n<td>1-12</td>\n</tr>\n<tr>\n<td>Minute</td>\n<td>{mm}</td>\n<td>00-59</td>\n<td>00-59</td>\n</tr>\n<tr>\n<td></td>\n<td>{m}</td>\n<td>0-59</td>\n<td>0-59</td>\n</tr>\n<tr>\n<td>Second</td>\n<td>{ss}</td>\n<td>00-59</td>\n<td>00-59</td>\n</tr>\n<tr>\n<td></td>\n<td>{s}</td>\n<td>0-59</td>\n<td>0-59</td>\n</tr>\n<tr>\n<td>Millisecond</td>\n<td>{SSS}</td>\n<td>000-999</td>\n<td>000-999</td>\n</tr>\n<tr>\n<td></td>\n<td>{S}</td>\n<td>0-999</td>\n<td>0-999</td>\n</tr>\n</tbody>\n</table>\n<blockquote>\n<p>其他语言请参考相应<a href="https://github.com/apache/incubator-echarts/tree/master/src/i18n" target="_blank">语言包</a>中的定义,语言包可以通过 <a href="api.html#echarts.registerLocale" target="_blank">echarts.registerLocale</a> 注册。</p>\n</blockquote>\n<p>示例:</p>\n<pre><code class="lang-js">formatter: '{yyyy}-{MM}-{dd}' // 得到的 label 形如:'2020-12-02'\nformatter: '{d}日' // 得到的 label 形如:'2日'\n</code></pre>\n<p><strong> 回调函数 </strong></p>\n<p>回调函数可以根据刻度值返回不同的格式,如果有复杂的时间格式化需求,也可以引用第三方的日期时间相关的库(如 <a href="https://momentjs.com/" target="_blank">Moment.js</a>、<a href="https://date-fns.org/" target="_blank">date-fns</a> 等),返回显示的文本。</p>\n<p>示例:</p>\n<pre><code class="lang-js">// 使用函数模板,函数参数分别为刻度数值(类目),刻度的索引\nformatter: function (value, index) {\n // 格式化成月/日,只在第一个刻度显示年份\n var date = new Date(value);\n var texts = [(date.getMonth() + 1), date.getDate()];\n if (index === 0) {\n texts.unshift(date.getYear());\n }\n return texts.join('/');\n}\n</code></pre>\n<p><strong> 分级模板 </strong></p>\n<p>有时候,我们希望对不同的时间粒度采用不同的格式化策略。例如,在季度图表中,我们可能希望对每个月的第一天显示月份,而其他日期显示日期。我们可以使用以下方式实现该效果:</p>\n<p>示例:</p>\n<pre><code class="lang-js">formatter: {\n month: '{MMMM}', // 一月、二月、……\n day: '{d}日' // 1日、2日、……\n}\n</code></pre>\n<p>支持的分级以及各自默认的取值为:</p>\n<pre><code class="lang-js">{\n year: '{yyyy}',\n month: '{MMM}',\n day: '{d}',\n hour: '{HH}:{mm}',\n minute: '{HH}:{mm}',\n second: '{HH}:{mm}:{ss}',\n millisecond: '{hh}:{mm}:{ss} {SSS}',\n none: '{yyyy}-{MM}-{dd} {hh}:{mm}:{ss} {SSS}'\n}\n</code></pre>\n<p>以 <code class="codespan">day</code> 为例,当一个刻度点的值的小时、分钟、秒、毫秒都为 <code class="codespan">0</code> 时,将采用 <code class="codespan">day</code> 的分级值作为模板。<code class="codespan">none</code> 表示当其他规则都不适用时采用的模板,也就是带有毫秒值的刻度点的模板。</p>\n<p><strong> 富文本 </strong></p>\n<p>以上这三种形式的 formatter 都支持富文本,所以可以做成一些复杂的效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">xAxis: {\n type: 'time',\n axisLabel: {\n formatter: {\n // 一年的第一个月显示年度信息和月份信息\n year: '{yearStyle|{yyyy}}\\n{monthStyle|{MMM}}',\n month: '{monthStyle|{MMM}}'\n },\n rich: {\n yearStyle: {\n // 让年度信息更醒目\n color: '#000',\n fontWeight: 'bold'\n },\n monthStyle: {\n color: '#999'\n }\n }\n }\n},\n</code></pre>\n<p>使用回调函数形式实现上面例子同样的效果:</p>\n<p>示例:</p>\n<pre><code class="lang-js">xAxis: {\n type: 'time',\n axisLabel: {\n formatter: function (value) {\n const date = new Date(value);\n const yearStart = new Date(value);\n yearStart.setMonth(0);\n yearStart.setDate(1);\n yearStart.setHours(0);\n yearStart.setMinutes(0);\n yearStart.setSeconds(0);\n yearStart.setMilliseconds(0);\n // 判断一个刻度值知否为一年的开始\n if (date.getTime() === yearStart.getTime()) {\n return '{year|' + date.getFullYear() + '}\\n'\n + '{month|' + (date.getMonth() + 1) + '月}';\n }\n else {\n return '{month|' + (date.getMonth() + 1) + '月}'\n }\n },\n rich: {\n year: {\n color: '#000',\n fontWeight: 'bold'\n },\n month: {\n color: '#999'\n }\n }\n }\n},\n</code></pre>\n'},"axisLabel.showMinLabel":{desc:'\n\n<p>是否显示最小 tick 的 label。可取值 <code class="codespan">true</code>, <code class="codespan">false</code>, <code class="codespan">null</code>。默认自动判定(即如果标签重叠,不会显示最小 tick 的 label)。</p>\n',uiControl:{type:"boolean"}},"axisLabel.showMaxLabel":{desc:'\n\n<p>是否显示最大 tick 的 label。可取值 <code class="codespan">true</code>, <code class="codespan">false</code>, <code class="codespan">null</code>。默认自动判定(即如果标签重叠,不会显示最大 tick 的 label)。</p>\n',uiControl:{type:"boolean"}},"axisLabel.color":{desc:'\n\n<p>刻度标签文字的颜色,默认取 <a href="#xAxis.axisLine.lineStyle.color">axisLine.lineStyle.color</a>。支持回调函数,格式如下</p>\n<pre><code class="lang-js">(val: string) => Color\n</code></pre>\n<p>参数是标签的文本,返回颜色值,如下示例:</p>\n<pre><code class="lang-js">textStyle: {\n color: function (value, index) {\n return value >= 0 ? 'green' : 'red';\n }\n}\n</code></pre>\n',uiControl:{type:"color"}},"axisLabel.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"axisLabel.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"axisLabel.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"axisLabel.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"axisLabel.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"axisLabel.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"axisLabel.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"axisLabel.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"axisLabel.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"axisLabel.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisLabel.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"axisLabel.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"axisLabel.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"axisLabel.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisLabel.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisLabel.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisLabel.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"axisLabel.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"axisLabel.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"axisLabel.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisLabel.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"axisLabel.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisLabel.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisLabel.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisLabel.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"axisLabel.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"axisLabel.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"axisLabel.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"axisLabel.rich.<style_name>.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"axisLabel.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"axisLabel.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"axisLabel.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"axisLabel.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"axisLabel.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"axisLabel.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"axisLabel.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"axisLabel.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"axisLabel.rich.<style_name>.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"axisLabel.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisLabel.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"axisLabel.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"axisLabel.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"axisLabel.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisLabel.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisLabel.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisLabel.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"axisLabel.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"axisLabel.rich.<style_name>.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"axisLabel.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisLabel.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"axisLabel.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisLabel.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisLabel.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n\n",uiControl:{type:"number",step:"0.5"}},splitLine:{desc:'<p>坐标轴在 <a href="#grid">grid</a> 区域中的分隔线。</p>\n'},"splitLine.show":{desc:"\n\n<p>是否显示分隔线。默认数值轴显示,类目轴不显示。</p>\n",uiControl:{type:"boolean",default:"true"}},"splitLine.interval":{desc:'\n\n\n\n<p>坐标轴分隔线的显示间隔,在类目轴中有效。默认同 <a href="#xAxis.axisLabel.interval">axisLabel.interval</a> 一样。</p>\n<p>默认会采用标签不重叠的策略间隔显示标签。</p>\n<p>可以设置成 0 强制显示所有标签。</p>\n<p>如果设置为 <code class="codespan">1</code>,表示『隔一个标签显示一个标签』,如果值为 <code class="codespan">2</code>,表示隔两个标签显示一个标签,以此类推。</p>\n<p>可以用数值表示间隔的数据,也可以通过回调函数控制。回调函数格式如下:</p>\n<pre><code class="lang-js">(index:number, value: string) => boolean\n</code></pre>\n<p>第一个参数是类目的 index,第二个值是类目名称,如果跳过则返回 <code class="codespan">false</code>。</p>\n',uiControl:{type:"number",min:"0",step:"1"}},"splitLine.lineStyle.color":{desc:"\n\n<p>分隔线颜色,可以设置成单个颜色。</p>\n<p>也可以设置成颜色数组,分隔线会按数组中颜色的顺序依次循环设置颜色。</p>\n<p>示例</p>\n<pre><code>splitLine: {\n lineStyle: {\n // 使用深浅的间隔色\n color: ['#aaa', '#ddd']\n }\n}\n</code></pre>",uiControl:{type:"color"}},"splitLine.lineStyle.width":{desc:"\n\n<p>分隔线线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"splitLine.lineStyle.type":{desc:'\n\n<p>分隔线线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"splitLine.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"splitLine.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"splitLine.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"splitLine.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"splitLine.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},minorSplitLine:{desc:'<blockquote>\n<p>从 <code class="codespan">v4.6.0</code> 开始支持</p>\n</blockquote>\n<p>坐标轴在 <a href="#grid">grid</a> 区域中的次分隔线。次分割线会对齐次刻度线 <a href="#xAxis.minorTick">minorTick</a></p>\n'},"minorSplitLine.show":{desc:"\n\n<p>是否显示次分隔线。默认不显示。</p>\n",uiControl:{type:"boolean",default:"true"}},"minorSplitLine.lineStyle.color":{desc:'\n\n<p>次分隔线线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"minorSplitLine.lineStyle.width":{desc:"\n\n<p>次分隔线线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"minorSplitLine.lineStyle.type":{desc:'\n\n<p>次分隔线线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"minorSplitLine.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"minorSplitLine.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"minorSplitLine.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"minorSplitLine.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"minorSplitLine.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},splitArea:{desc:'<p>坐标轴在 <a href="#grid">grid</a> 区域中的分隔区域,默认不显示。</p>\n'},"splitArea.interval":{desc:'\n\n\n\n<p>坐标轴分隔区域的显示间隔,在类目轴中有效。默认同 <a href="#xAxis.axisLabel.interval">axisLabel.interval</a> 一样。</p>\n<p>默认会采用标签不重叠的策略间隔显示标签。</p>\n<p>可以设置成 0 强制显示所有标签。</p>\n<p>如果设置为 <code class="codespan">1</code>,表示『隔一个标签显示一个标签』,如果值为 <code class="codespan">2</code>,表示隔两个标签显示一个标签,以此类推。</p>\n<p>可以用数值表示间隔的数据,也可以通过回调函数控制。回调函数格式如下:</p>\n<pre><code class="lang-js">(index:number, value: string) => boolean\n</code></pre>\n<p>第一个参数是类目的 index,第二个值是类目名称,如果跳过则返回 <code class="codespan">false</code>。</p>\n',uiControl:{type:"number",min:"0",step:"1"}},"splitArea.show":{desc:"\n\n<p>是否显示分隔区域。</p>\n",uiControl:{type:"boolean",default:"true"}},"splitArea.areaStyle":{desc:"<p>分隔区域的样式设置。</p>\n"},"splitArea.areaStyle.color":{desc:"<p>分隔区域颜色。分隔区域会按数组中颜色的顺序依次循环设置颜色。默认是一个深浅的间隔色。</p>\n"},"splitArea.areaStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"splitArea.areaStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"splitArea.areaStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"splitArea.areaStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"splitArea.areaStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},data:{desc:'<p>类目数据,在类目轴(<a href="#xAxis.type">type</a>: <code class="codespan">'category'</code>)中有效。</p>\n<p>如果没有设置 <a href="#xAxis.type">type</a>,但是设置了 <code class="codespan">axis.data</code>,则认为 <code class="codespan">type</code> 是 <code class="codespan">'category'</code>。</p>\n<p>如果设置了 <a href="#xAxis.type">type</a> 是 <code class="codespan">'category'</code>,但没有设置 <code class="codespan">axis.data</code>,则 <code class="codespan">axis.data</code> 的内容会自动从 <a href="#series.data">series.data</a> 中获取,这会比较方便。不过注意,<code class="codespan">axis.data</code> 指明的是 <code class="codespan">'category'</code> 轴的取值范围。如果不指定而是从 <a href="#series.data">series.data</a> 中获取,那么只能获取到 <a href="#series.data">series.data</a> 中出现的值。比如说,假如 <a href="#series.data">series.data</a> 为空时,就什么也获取不到。</p>\n<p>示例:</p>\n<pre><code class="lang-js">// 所有类目名称列表\ndata: ['周一', '周二', '周三', '周四', '周五', '周六', '周日']\n// 每一项也可以是具体的配置项,此时取配置项中的 `value` 为类目名\ndata: [{\n value: '周一',\n // 突出周一\n textStyle: {\n fontSize: 20,\n color: 'red'\n }\n}, '周二', '周三', '周四', '周五', '周六', '周日']\n</code></pre>\n'},"data.value":{desc:"<p>单个类目名称。</p>\n"},"data.textStyle":{desc:"<p>类目标签的文字样式。</p>\n"},"data.textStyle.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"data.textStyle.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.textStyle.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.textStyle.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.textStyle.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.textStyle.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.textStyle.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.textStyle.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.textStyle.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.textStyle.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"data.textStyle.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.textStyle.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.textStyle.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.textStyle.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.textStyle.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.textStyle.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.textStyle.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.textStyle.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"data.textStyle.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"data.textStyle.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"data.textStyle.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.textStyle.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.textStyle.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.textStyle.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.textStyle.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.textStyle.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"data.textStyle.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"data.textStyle.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"data.textStyle.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"data.textStyle.rich.<style_name>.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"data.textStyle.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.textStyle.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.textStyle.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.textStyle.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.textStyle.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.textStyle.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.textStyle.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.textStyle.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.textStyle.rich.<style_name>.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"data.textStyle.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.textStyle.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.textStyle.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.textStyle.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.textStyle.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.textStyle.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.textStyle.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.textStyle.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.textStyle.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.textStyle.rich.<style_name>.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"data.textStyle.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.textStyle.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.textStyle.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.textStyle.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.textStyle.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},axisPointer:{desc:"<p>坐标轴指示器配置项。</p>\n"},"axisPointer.show":{desc:'\n\n<p>默认不显示。但是如果 <a href="#tooltip.trigger">tooltip.trigger</a> 设置为 <code class="codespan">'axis'</code> 或者 <a href="#tooltip.axisPointer.type">tooltip.axisPointer.type</a> 设置为 <code class="codespan">'cross'</code>,则自动显示 axisPointer。坐标系会自动选择显示显示哪个轴的 axisPointer,也可以使用 <a href="#tooltip.axisPointer.axis">tooltip.axisPointer.axis</a> 改变这种选择。</p>\n',uiControl:{type:"boolean"}},"axisPointer.type":{desc:'\n\n<p>指示器类型。</p>\n<p>可选</p>\n<ul>\n<li><p><code class="codespan">'line'</code> 直线指示器</p>\n</li>\n<li><p><code class="codespan">'shadow'</code> 阴影指示器</p>\n</li>\n<li><p><code class="codespan">'none'</code> 无指示器</p>\n</li>\n</ul>\n',uiControl:{type:"enum",options:"line,shadow,none"}},"axisPointer.snap":{desc:"<p>坐标轴指示器是否自动吸附到点上。默认自动判断。</p>\n<p>这个功能在数值轴和时间轴上比较有意义,可以自动寻找细小的数值点。</p>\n"},"axisPointer.z":{desc:'<p>坐标轴指示器的 z 值。控制图形的前后顺序。<code class="codespan">z</code>值小的图形会被<code class="codespan">z</code>值大的图形覆盖。</p>\n'},"axisPointer.label":{desc:"<p>坐标轴指示器的文本标签。</p>\n"},"axisPointer.label.show":{desc:'<p>是否显示文本标签。如果 <a href="#tooltip.axisPointer.type">tooltip.axisPointer.type</a> 设置为 <code class="codespan">'cross'</code> 则默认显示标签,否则默认不显示。</p>\n'},"axisPointer.label.precision":{desc:'<p>文本标签中数值的小数点精度。默认根据当前轴的值自动判断。也可以指定如 <code class="codespan">2</code> 表示保留两位小数。</p>\n'},"axisPointer.label.formatter":{desc:'<p>文本标签文字的格式化器。</p>\n<p>如果为 <code class="codespan">string</code>,可以是例如:<code class="codespan">formatter: 'some text {value} some text</code>,其中 <code class="codespan">{value}</code> 会被自动替换为轴的值。</p>\n<p>如果为 <code class="codespan">function</code>,可以是例如:</p>\n<p><strong>参数:</strong></p>\n<p><code class="codespan">{Object}</code> params: 含有:</p>\n<p><code class="codespan">{Object}</code> params.value: 轴当前值,如果 axis.type 为 'category' 时,其值为 axis.data 里的数值。如果 axis.type 为 <code class="codespan">'time'</code>,其值为时间戳。</p>\n<p><code class="codespan">{Array.<Object>}</code> params.seriesData: 一个数组,是当前 axisPointer 最近的点的信息,每项内容为</p>\n<p><code class="codespan">{string}</code> params.axisDimension: 轴的维度名,例如直角坐标系中是 <code class="codespan">'x'</code>、<code class="codespan">'y'</code>,极坐标系中是 <code class="codespan">'radius'</code>、<code class="codespan">'angle'</code>。</p>\n<p><code class="codespan">{number}</code> params.axisIndex: 轴的 index,<code class="codespan">0</code>、<code class="codespan">1</code>、<code class="codespan">2</code>、...</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n<p>每项内容还包括轴的信息:</p>\n<pre><code class="lang-js">{\n axisDim: 'x', // 'x', 'y', 'angle', 'radius', 'single'\n axisId: 'xxx',\n axisName: 'xxx',\n axisIndex: 3,\n axisValue: 121, // 当前 axisPointer 对应的 value。\n axisValueLabel: '文本'\n}\n</code></pre>\n<p><strong>返回值:</strong></p>\n<p>显示的 string。</p>\n<p>例如:</p>\n<pre><code class="lang-js">formatter: function (params) {\n // 假设此轴的 type 为 'time'。\n return 'some text' + echarts.format.formatTime(params.value);\n}\n</code></pre>\n'},"axisPointer.label.margin":{desc:"<p>label 距离轴的距离。</p>\n"},"axisPointer.label.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"'#fff'"}},"axisPointer.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"axisPointer.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"axisPointer.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"axisPointer.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"axisPointer.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"axisPointer.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"axisPointer.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"axisPointer.label.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"axisPointer.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisPointer.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"axisPointer.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisPointer.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisPointer.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisPointer.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"axisPointer.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"axisPointer.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"axisPointer.label.padding":{desc:'\n\n<p>axisPointer内边距,单位px,默认各方向内边距为5,接受数组分别设定上右下左边距。</p>\n<p>使用示例:</p>\n<pre><code class="lang-js">// 设置内边距为 5\npadding: 5\n// 设置上下的内边距为 5,左右的内边距为 10\npadding: [5, 10]\n// 分别设置四个方向的内边距\npadding: [\n 5, // 上\n 10, // 右\n 5, // 下\n 10, // 左\n]\n</code></pre>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"axisPointer.label.backgroundColor":{desc:'<p>文本标签的背景颜色,默认是和 <a href="#xAxis.axisLine.lineStyle.color">axis.axisLine.lineStyle.color</a> 相同。</p>\n'},"axisPointer.label.borderColor":{desc:"<p>文本标签的边框颜色。</p>\n"},"axisPointer.label.borderWidth":{desc:"<p>文本标签的边框宽度。</p>\n"},"axisPointer.label.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"3",min:"0",step:"0.5"}},"axisPointer.label.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:"#aaa"}},"axisPointer.label.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisPointer.label.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisPointer.lineStyle":{desc:'<p><a href="#tooltip.axisPointer.type">axisPointer.type</a> 为 <code class="codespan">'line'</code> 时有效。</p>\n'},"axisPointer.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"axisPointer.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"axisPointer.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"axisPointer.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"axisPointer.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"axisPointer.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisPointer.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisPointer.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"axisPointer.shadowStyle":{desc:'<p><a href="#tooltip.axisPointer.type">axisPointer.type</a> 为 <code class="codespan">'shadow'</code> 时有效。</p>\n'},"axisPointer.shadowStyle.color":{desc:'\n\n<p>填充的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"axisPointer.shadowStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"axisPointer.shadowStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"axisPointer.shadowStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisPointer.shadowStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisPointer.shadowStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"axisPointer.triggerTooltip":{desc:"\n\n<p>是否触发 tooltip。如果不想触发 tooltip 可以关掉。</p>\n",uiControl:{type:"boolean",default:"true"}},"axisPointer.value":{desc:'<p>当前的 value。在使用 <a href="xAxisPointer.handle" target="_blank">axisPointer.handle</a> 时,可以设置此值进行初始值设定,从而决定 axisPointer 的初始位置。</p>\n'},"axisPointer.status":{desc:'\n\n<p>当前的状态,可取值为 <code class="codespan">'show'</code> 和 <code class="codespan">'hide'</code>。</p>\n',uiControl:{type:"enum",options:"show,hide"}},"axisPointer.handle":{desc:'<p>拖拽手柄,适用于触屏的环境。参见 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=line-tooltip-touch&edit=1&reset=1" target="_blank">例子</a>。</p>\n'},"axisPointer.handle.show":{desc:'\n\n<p>当 show 设为 <code class="codespan">true</code> 时开启,这时显示手柄,并且 axisPointer 会一直显示。</p>\n',uiControl:{type:"boolean"}},"axisPointer.handle.icon":{desc:'\n\n<p>手柄的图标。</p>\n<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre><p>参见 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/axisPointer-handle-image&edit=1&reset=1" target="_blank">使用图片的例子</a></p>\n',uiControl:{type:"icon",clean:"true"}},"axisPointer.handle.size":{desc:'\n\n<p>手柄的尺寸,可以设置单值,如 <code class="codespan">45</code>,也可以设置为数组:<code class="codespan">[width, height]</code>。</p>\n',uiControl:{type:"vector",default:"45,45",min:"0",step:"0.5",dims:"width,height"}},"axisPointer.handle.margin":{desc:"\n\n<p>手柄与轴的距离。注意,这是手柄中心点和轴的距离。</p>\n",uiControl:{type:"number",default:"50",min:"0",step:"0.5"}},"axisPointer.handle.color":{desc:"\n\n<p>手柄颜色。</p>\n",uiControl:{type:"color"}},"axisPointer.handle.throttle":{desc:"\n\n<p>手柄拖拽时触发视图更新周期,单位毫秒,调大这个数值可以改善性能,但是降低体验。</p>\n",uiControl:{type:"number",default:"40",min:"0",step:"10"}},"axisPointer.handle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"3",min:"0",step:"0.5"}},"axisPointer.handle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:"#aaa"}},"axisPointer.handle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"2",step:"0.5"}},"axisPointer.handle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},zlevel:{desc:'<p>X 轴所有图形的 zlevel 值。</p>\n<p><code class="codespan">zlevel</code>用于 Canvas 分层,不同<code class="codespan">zlevel</code>值的图形会放置在不同的 Canvas 中,Canvas 分层是一种常见的优化手段。我们可以把一些图形变化频繁(例如有动画)的组件设置成一个单独的<code class="codespan">zlevel</code>。需要注意的是过多的 Canvas 会引起内存开销的增大,在手机端上需要谨慎使用以防崩溃。</p>\n<p><code class="codespan">zlevel</code> 大的 Canvas 会放在 <code class="codespan">zlevel</code> 小的 Canvas 的上面。</p>\n'},z:{desc:'<p>X 轴组件的所有图形的<code class="codespan">z</code>值。控制图形的前后顺序。<code class="codespan">z</code>值小的图形会被<code class="codespan">z</code>值大的图形覆盖。</p>\n<p><code class="codespan">z</code>相比<code class="codespan">zlevel</code>优先级更低,而且不会创建新的 Canvas。</p>\n'}},d={id:{desc:"<p>组件 ID。默认不指定。指定则可用于在 option 或者 API 中引用组件。</p>\n"},show:{desc:"\n\n<p>是否显示 y 轴。</p>\n",uiControl:{type:"boolean",default:"true"}},gridIndex:{desc:"<p>y 轴所在的 grid 的索引,默认位于第一个 grid。</p>\n"},position:{desc:'\n\n<p>y 轴的位置。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p>默认 grid 中的第一个 y 轴在 grid 的左侧(<code class="codespan">'left'</code>),第二个 y 轴视第一个 y 轴的位置放在另一侧。</p>\n',uiControl:{type:"enum",options:"left,right",default:"left"}},offset:{desc:'\n\n<p>Y 轴相对于默认位置的偏移,在相同的 <code class="codespan">position</code> 上有多个 Y 轴的时候有用。</p>\n',uiControl:{type:"number",step:"0.5"}},realtimeSort:{desc:'<p>用于制作动态排序柱状图。设为 <code class="codespan">true</code> 时,表示 Y 轴开启实时排序效果,仅当 X 轴的 <a href="#yAxis.type">type</a> 是 <code class="codespan">'value'</code> 时有效。</p>\n<p>需要配合其他配置项共同实现动态排序柱状图效果,具体参见<a href="tutorial.html#%E5%8A%A8%E6%80%81%E6%8E%92%E5%BA%8F%E6%9F%B1%E7%8A%B6%E5%9B%BE" target="_blank">动态排序柱状图</a>教程。</p>\n'},sortSeriesIndex:{desc:'<p>动态排序柱状图用于排序的系列 id。目前只支持一个系列的柱状图排序效果,所以这个值只能取 0。仅当 Y 轴 <a href="#yAxis.realtimeSort">realtimeSort</a> 为 <code class="codespan">true</code> 并且 <a href="#yAxis.type">type</a> 是 <code class="codespan">'value'</code> 时有效。</p>\n<p>需要配合其他配置项共同实现动态排序柱状图效果,具体参见<a href="tutorial.html#%E5%8A%A8%E6%80%81%E6%8E%92%E5%BA%8F%E6%9F%B1%E7%8A%B6%E5%9B%BE" target="_blank">动态排序柱状图</a>教程。</p>\n'},type:{desc:'<p>坐标轴类型。</p>\n<p>可选:</p>\n<ul>\n<li><p><code class="codespan">'value'</code>\n 数值轴,适用于连续数据。</p>\n</li>\n<li><p><code class="codespan">'category'</code>\n 类目轴,适用于离散的类目数据。为该类型时类目数据可自动从 <a href="#series.data">series.data</a> 或 <a href="#dataset.source">dataset.source</a> 中取,或者可通过 <a href="#yAxis.data">yAxis.data</a> 设置类目数据。</p>\n</li>\n<li><p><code class="codespan">'time'</code>\n 时间轴,适用于连续的时序数据,与数值轴相比时间轴带有时间的格式化,在刻度计算上也有所不同,例如会根据跨度的范围来决定使用月,星期,日还是小时范围的刻度。</p>\n</li>\n<li><p><code class="codespan">'log'</code>\n 对数轴。适用于对数数据。</p>\n</li>\n</ul>\n'},name:{desc:"\n\n<p>坐标轴名称。</p>\n",uiControl:{type:"text"}},nameLocation:{desc:'\n\n<p>坐标轴名称显示位置。</p>\n<p><strong>可选:</strong></p>\n<ul>\n<li><code class="codespan">'start'</code></li>\n<li><code class="codespan">'middle'</code> 或者 <code class="codespan">'center'</code></li>\n<li><code class="codespan">'end'</code></li>\n</ul>\n',uiControl:{type:"enum",options:"start,middle,end",default:"end"}},nameTextStyle:{desc:"<p>坐标轴名称的文字样式。</p>\n"},"nameTextStyle.color":{desc:'\n\n<p>坐标轴名称的颜色,默认取 <a href="#yAxis.axisLine.lineStyle.color">axisLine.lineStyle.color</a>。</p>\n',uiControl:{type:"color"}},"nameTextStyle.fontStyle":{desc:'\n\n<p>坐标轴名称文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"nameTextStyle.fontWeight":{desc:'\n\n<p>坐标轴名称文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"nameTextStyle.fontFamily":{desc:"\n\n<p>坐标轴名称文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"nameTextStyle.fontSize":{desc:"\n\n<p>坐标轴名称文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"nameTextStyle.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"nameTextStyle.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"nameTextStyle.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"nameTextStyle.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"nameTextStyle.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"nameTextStyle.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"nameTextStyle.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"nameTextStyle.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"nameTextStyle.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"nameTextStyle.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"nameTextStyle.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"nameTextStyle.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"nameTextStyle.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"nameTextStyle.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"nameTextStyle.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"nameTextStyle.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"nameTextStyle.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"nameTextStyle.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"nameTextStyle.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"nameTextStyle.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"nameTextStyle.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"nameTextStyle.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"nameTextStyle.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"nameTextStyle.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"nameTextStyle.rich.<style_name>.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"nameTextStyle.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"nameTextStyle.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"nameTextStyle.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"nameTextStyle.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"nameTextStyle.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"nameTextStyle.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"nameTextStyle.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"nameTextStyle.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"nameTextStyle.rich.<style_name>.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"nameTextStyle.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"nameTextStyle.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"nameTextStyle.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"nameTextStyle.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"nameTextStyle.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"nameTextStyle.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"nameTextStyle.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"nameTextStyle.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"nameTextStyle.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"nameTextStyle.rich.<style_name>.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"nameTextStyle.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"nameTextStyle.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"nameTextStyle.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"nameTextStyle.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"nameTextStyle.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n\n",uiControl:{type:"number",step:"0.5"}},nameGap:{desc:"\n\n<p>坐标轴名称与轴线之间的距离。</p>\n",uiControl:{type:"number",step:"0.5",default:"15"}},nameRotate:{desc:"\n\n<p>坐标轴名字旋转,角度值。</p>\n",uiControl:{type:"angle",min:"-360",max:"360",step:"1"}},inverse:{desc:"\n\n<p>是否是反向坐标轴。</p>\n",uiControl:{type:"boolean"}},boundaryGap:{desc:'\n\n<p>坐标轴两边留白策略,类目轴和非类目轴的设置和表现不一样。</p>\n<p>类目轴中 <code class="codespan">boundaryGap</code> 可以配置为 <code class="codespan">true</code> 和 <code class="codespan">false</code>。默认为 <code class="codespan">true</code>,这时候<a href="#yAxis.axisTick">刻度</a>只是作为分隔线,标签和数据点都会在两个<a href="#yAxis.axisTick">刻度</a>之间的带(band)中间。</p>\n<p>非类目轴,包括时间,数值,对数轴,<code class="codespan">boundaryGap</code>是一个两个值的数组,分别表示数据最小值和最大值的延伸范围,可以直接设置数值或者相对的百分比,在设置 <a href="#yAxis.min">min</a> 和 <a href="#yAxis.max">max</a> 后无效。\n<strong>示例:</strong></p>\n<pre><code class="lang-js">boundaryGap: ['20%', '20%']\n</code></pre>\n',uiControl:{type:"boolean"}},min:{desc:'\n\n<p>坐标轴刻度最小值。</p>\n<p>可以设置成特殊值 <code class="codespan">'dataMin'</code>,此时取数据在该轴上的最小值作为最小刻度。</p>\n<p>不设置时会自动计算最小值保证坐标轴刻度的均匀分布。</p>\n<p>在类目轴中,也可以设置为类目的序数(如类目轴 <code class="codespan">data: ['类A', '类B', '类C']</code> 中,序数 <code class="codespan">2</code> 表示 <code class="codespan">'类C'</code>。也可以设置为负数,如 <code class="codespan">-3</code>)。</p>\n<p>当设置成 <code class="codespan">function</code> 形式时,可以根据计算得出的数据最大最小值设定坐标轴的最小值。如:</p>\n<pre><code class="lang-js">min: function (value) {\n return value.min - 20;\n}\n</code></pre>\n<p>其中 <code class="codespan">value</code> 是一个包含 <code class="codespan">min</code> 和 <code class="codespan">max</code> 的对象,分别表示数据的最大最小值,这个函数可返回坐标轴的最小值,也可返回 <code class="codespan">null</code>/<code class="codespan">undefined</code> 来表示“自动计算最小值”(返回 <code class="codespan">null</code>/<code class="codespan">undefined</code> 从 <code class="codespan">v4.8.0</code> 开始支持)。</p>\n',uiControl:{type:"number"}},max:{desc:'\n\n<p>坐标轴刻度最大值。</p>\n<p>可以设置成特殊值 <code class="codespan">'dataMax'</code>,此时取数据在该轴上的最大值作为最大刻度。</p>\n<p>不设置时会自动计算最大值保证坐标轴刻度的均匀分布。</p>\n<p>在类目轴中,也可以设置为类目的序数(如类目轴 <code class="codespan">data: ['类A', '类B', '类C']</code> 中,序数 <code class="codespan">2</code> 表示 <code class="codespan">'类C'</code>。也可以设置为负数,如 <code class="codespan">-3</code>)。</p>\n<p>当设置成 <code class="codespan">function</code> 形式时,可以根据计算得出的数据最大最小值设定坐标轴的最小值。如:</p>\n<pre><code class="lang-js">max: function (value) {\n return value.max - 20;\n}\n</code></pre>\n<p>其中 <code class="codespan">value</code> 是一个包含 <code class="codespan">min</code> 和 <code class="codespan">max</code> 的对象,分别表示数据的最大最小值,这个函数可返回坐标轴的最大值,也可返回 <code class="codespan">null</code>/<code class="codespan">undefined</code> 来表示“自动计算最大值”(返回 <code class="codespan">null</code>/<code class="codespan">undefined</code> 从 <code class="codespan">v4.8.0</code> 开始支持)。</p>\n',uiControl:{type:"number"}},scale:{desc:'\n\n<p>只在数值轴中(<a href="#yAxis.type">type</a>: 'value')有效。</p>\n<p>是否是脱离 0 值比例。设置成 <code class="codespan">true</code> 后坐标刻度不会强制包含零刻度。在双数值轴的散点图中比较有用。</p>\n<p>在设置 <a href="#yAxis.min">min</a> 和 <a href="#yAxis.max">max</a> 之后该配置项无效。</p>\n',uiControl:{type:"boolean"}},splitNumber:{desc:"\n\n<p>坐标轴的分割段数,需要注意的是这个分割段数只是个预估值,最后实际显示的段数会在这个基础上根据分割后坐标轴刻度显示的易读程度作调整。</p>\n<p>在类目轴中无效。</p>\n",uiControl:{type:"number",min:"1",step:"1",default:"5"}},minInterval:{desc:'\n\n<p>自动计算的坐标轴最小间隔大小。</p>\n<p>例如可以设置成<code class="codespan">1</code>保证坐标轴分割刻度显示成整数。</p>\n<pre><code class="lang-js">{\n minInterval: 1\n}\n</code></pre>\n<p>只在数值轴或时间轴中(<a href="#yAxis.type">type</a>: 'value' 或 'time')有效。</p>\n',uiControl:{type:"number"}},maxInterval:{desc:'\n\n<p>自动计算的坐标轴最大间隔大小。</p>\n<p>例如,在时间轴((<a href="#yAxis.type">type</a>: 'time'))可以设置成 <code class="codespan">3600 * 24 * 1000</code> 保证坐标轴分割刻度最大为一天。</p>\n<pre><code class="lang-js">{\n maxInterval: 3600 * 24 * 1000\n}\n</code></pre>\n<p>只在数值轴或时间轴中(<a href="#yAxis.type">type</a>: 'value' 或 'time')有效。</p>\n',uiControl:{type:"number"}},interval:{desc:'\n\n<p>强制设置坐标轴分割间隔。</p>\n<p>因为 <a href="#yAxis.splitNumber">splitNumber</a> 是预估的值,实际根据策略计算出来的刻度可能无法达到想要的效果,这时候可以使用 interval 配合 <a href="#yAxis.min">min</a>、<a href="#yAxis.max">max</a> 强制设定刻度划分,一般不建议使用。</p>\n<p>无法在类目轴中使用。在时间轴(<a href="#yAxis.type">type</a>: 'time')中需要传时间戳,在对数轴(<a href="#yAxis.type">type</a>: 'log')中需要传指数值。</p>\n',uiControl:{type:"number"}},logBase:{desc:'\n\n<p>对数轴的底数,只在对数轴中(<a href="#yAxis.type">type</a>: 'log')有效。</p>\n',uiControl:{type:"number",default:"10"}},silent:{desc:"<p>坐标轴是否是静态无法交互。</p>\n"},triggerEvent:{desc:'<p>坐标轴的标签是否响应和触发鼠标事件,默认不响应。</p>\n<p>事件参数如下:</p>\n<pre><code class="lang-js">{\n // 组件类型,xAxis, yAxis, radiusAxis, angleAxis\n // 对应组件类型都会有一个属性表示组件的 index,例如 xAxis 就是 xAxisIndex\n componentType: string,\n // 未格式化过的刻度值, 点击刻度标签有效\n value: '',\n // 坐标轴名称, 点击坐标轴名称有效\n name: ''\n}\n</code></pre>\n'},axisLine:{desc:"<p>坐标轴轴线相关设置。</p>\n"},"axisLine.show":{desc:"\n\n<p>是否显示坐标轴轴线。</p>\n",uiControl:{type:"boolean",default:"true"}},"axisLine.onZero":{desc:"\n\n<p>X 轴或者 Y 轴的轴线是否在另一个轴的 0 刻度上,只有在另一个轴为数值轴且包含 0 刻度时有效。</p>\n",uiControl:{type:"boolean",default:"true"}},"axisLine.onZeroAxisIndex":{desc:"<p>当有双轴时,可以用这个属性手动指定,在哪个轴的 0 刻度上。</p>\n"},"axisLine.symbol":{desc:'\n\n<p>轴线两边的箭头。可以是字符串,表示两端使用同样的箭头;或者长度为 2 的字符串数组,分别表示两端的箭头。默认不显示箭头,即 <code class="codespan">'none'</code>。两端都显示箭头可以设置为 <code class="codespan">'arrow'</code>,只在末端显示箭头可以设置为 <code class="codespan">['none', 'arrow']</code>。</p>\n',uiControl:{type:"icon",default:"none"}},"axisLine.symbolSize":{desc:"\n\n<p>轴线两边的箭头的大小,第一个数字表示宽度(垂直坐标轴方向),第二个数字表示高度(平行坐标轴方向)。</p>\n",uiControl:{type:"vector",default:"10,15"}},"axisLine.symbolOffset":{desc:"\n\n<p>轴线两边的箭头的偏移,如果是数组,第一个数字表示起始箭头的偏移,第二个数字表示末端箭头的偏移;如果是数字,表示这两个箭头使用同样的偏移。</p>\n",uiControl:{type:"vector",default:"0,0"}},"axisLine.lineStyle.color":{desc:'\n\n<p>坐标轴线线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"axisLine.lineStyle.width":{desc:"\n\n<p>坐标轴线线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"axisLine.lineStyle.type":{desc:'\n\n<p>坐标轴线线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"axisLine.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"axisLine.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"axisLine.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisLine.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisLine.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},axisTick:{desc:"<p>坐标轴刻度相关设置。</p>\n"},"axisTick.show":{desc:"\n\n<p>是否显示坐标轴刻度。</p>\n",uiControl:{type:"boolean",default:"true"}},"axisTick.alignWithLabel":{desc:'\n\n<p>类目轴中在 <code class="codespan">boundaryGap</code> 为 <code class="codespan">true</code> 的时候有效,可以保证刻度线和标签对齐。如下图:</p>\n<p><img width="600" height="auto" src="documents/asset/img/axis-align-with-label.png"></p>\n',uiControl:{type:"boolean",default:"false"}},"axisTick.interval":{desc:'\n\n\n\n<p>坐标轴刻度的显示间隔,在类目轴中有效。默认同 <a href="#yAxis.axisLabel.interval">axisLabel.interval</a> 一样。</p>\n<p>默认会采用标签不重叠的策略间隔显示标签。</p>\n<p>可以设置成 0 强制显示所有标签。</p>\n<p>如果设置为 <code class="codespan">1</code>,表示『隔一个标签显示一个标签』,如果值为 <code class="codespan">2</code>,表示隔两个标签显示一个标签,以此类推。</p>\n<p>可以用数值表示间隔的数据,也可以通过回调函数控制。回调函数格式如下:</p>\n<pre><code class="lang-js">(index:number, value: string) => boolean\n</code></pre>\n<p>第一个参数是类目的 index,第二个值是类目名称,如果跳过则返回 <code class="codespan">false</code>。</p>\n',uiControl:{type:"number",min:"0",step:"1"}},"axisTick.inside":{desc:"\n\n<p>坐标轴刻度是否朝内,默认朝外。</p>\n",uiControl:{type:"boolean"}},"axisTick.length":{desc:"\n\n<p>坐标轴刻度的长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5",default:"5"}},"axisTick.lineStyle":{desc:"<p>刻度线的样式设置。</p>\n"},"axisTick.lineStyle.color":{desc:'<p>刻度线的颜色,默认取 <a href="#yAxis.axisTick.lineStyle.color">axisTick.lineStyle.color</a>。</p>\n'},"axisTick.lineStyle.width":{desc:"\n\n<p>坐标轴刻度线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"axisTick.lineStyle.type":{desc:'\n\n<p>坐标轴刻度线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"axisTick.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"axisTick.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"axisTick.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisTick.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisTick.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},minorTick:{desc:'<blockquote>\n<p>从 <code class="codespan">v4.6.0</code> 开始支持</p>\n</blockquote>\n<p>坐标轴次刻度线相关设置。</p>\n<p>注意:次刻度线无法在类目轴(<a href="#yAxis.type">type</a>: <code class="codespan">'category'</code>)中使用。</p>\n<p>示例:</p>\n<p>1) 函数绘图中使用次刻度线</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=line-function&edit=1&reset=1" width="600" height="350"><iframe />\n\n\n<p>2) 在对数轴中使用次刻度线</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=line-log&edit=1&reset=1" width="600" height="350"><iframe />\n\n'},"minorTick.show":{desc:"\n\n<p>是否显示次刻度线。</p>\n",uiControl:{type:"boolean",default:"true"}},"minorTick.splitNumber":{desc:"\n\n<p>次刻度线分割数,默认会分割成 5 段</p>\n",uiControl:{type:"number",min:"1",step:"1",default:"5"}},"minorTick.length":{desc:"\n\n<p>次刻度线的长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5",default:"3"}},"minorTick.lineStyle.color":{desc:'\n\n<p>刻度线的颜色,默认取 <a href="#yAxis.axisLine.lineStyle.color">axisLine.lineStyle.color</a>。</p>\n',uiControl:{type:"color"}},"minorTick.lineStyle.width":{desc:"\n\n<p>次刻度线线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"minorTick.lineStyle.type":{desc:'\n\n<p>次刻度线线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"minorTick.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"minorTick.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"minorTick.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"minorTick.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"minorTick.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},axisLabel:{desc:"<p>坐标轴刻度标签的相关设置。</p>\n"},"axisLabel.show":{desc:"\n\n<p>是否显示刻度标签。</p>\n",uiControl:{type:"boolean",default:"true"}},"axisLabel.interval":{desc:'\n\n\n\n<p>坐标轴刻度标签的显示间隔,在类目轴中有效。</p>\n<p>默认会采用标签不重叠的策略间隔显示标签。</p>\n<p>可以设置成 0 强制显示所有标签。</p>\n<p>如果设置为 <code class="codespan">1</code>,表示『隔一个标签显示一个标签』,如果值为 <code class="codespan">2</code>,表示隔两个标签显示一个标签,以此类推。</p>\n<p>可以用数值表示间隔的数据,也可以通过回调函数控制。回调函数格式如下:</p>\n<pre><code class="lang-js">(index:number, value: string) => boolean\n</code></pre>\n<p>第一个参数是类目的 index,第二个值是类目名称,如果跳过则返回 <code class="codespan">false</code>。</p>\n',uiControl:{type:"number",min:"0",step:"1"}},"axisLabel.inside":{desc:"\n\n<p>刻度标签是否朝内,默认朝外。</p>\n",uiControl:{type:"boolean"}},"axisLabel.rotate":{desc:"\n\n<p>刻度标签旋转的角度,在类目轴的类目标签显示不下的时候可以通过旋转防止标签之间重叠。</p>\n<p>旋转的角度从 -90 度到 90 度。</p>\n",uiControl:{type:"angle",min:"-90",max:"90",step:"1"}},"axisLabel.margin":{desc:"\n\n<p>刻度标签与轴线之间的距离。</p>\n",uiControl:{type:"number",default:"8",step:"0.5"}},"axisLabel.formatter":{desc:'<p>刻度标签的内容格式器,支持字符串模板和回调函数两种形式。</p>\n<p>示例:</p>\n<pre><code class="lang-js">// 使用字符串模板,模板变量为刻度默认标签 {value}\nformatter: '{value} kg'\n</code></pre>\n<p>对于时间轴(<a href="#.type">type</a>: <code class="codespan">'time'</code>),<code class="codespan">formatter</code> 的字符串模板支持多种形式:</p>\n<ul>\n<li><strong>字符串模板</strong>:简单快速实现常用日期时间模板,<code class="codespan">string</code> 类型</li>\n<li><strong>回调函数</strong>:自定义 formatter,可以用来实现复杂高级的格式,<code class="codespan">Function</code> 类型</li>\n<li><strong>分级模板</strong>:为不同时间粒度的标签使用不同的 formatter,<code class="codespan">object</code> 类型</li>\n</ul>\n<p>下面我们分别介绍这三种形式。</p>\n<p><strong> 字符串模板 </strong></p>\n<p>使用字符串模板是一种方便实现常用日期时间格式化方式的形式。如果字符串模板可以实现你的效果,那我们优先推荐使用此方式;如果无法实现,再考虑其他两种更复杂的方式。支持的模板如下:</p>\n<table>\n<thead>\n<tr>\n<th>分类</th>\n<th>模板</th>\n<th>取值(英文)</th>\n<th>取值(中文)</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>Year</td>\n<td>{yyyy}</td>\n<td>e.g., 2020, 2021, ...</td>\n<td>例:2020, 2021, ...</td>\n</tr>\n<tr>\n<td></td>\n<td>{yy}</td>\n<td>00-99</td>\n<td>00-99</td>\n</tr>\n<tr>\n<td>Quarter</td>\n<td>{Q}</td>\n<td>1, 2, 3, 4</td>\n<td>1, 2, 3, 4</td>\n</tr>\n<tr>\n<td>Month</td>\n<td>{MMMM}</td>\n<td>e.g., January, February, ...</td>\n<td>一月、二月、……</td>\n</tr>\n<tr>\n<td></td>\n<td>{MMM}</td>\n<td>e.g., Jan, Feb, ...</td>\n<td>1月、2月、……</td>\n</tr>\n<tr>\n<td></td>\n<td>{MM}</td>\n<td>01-12</td>\n<td>01-12</td>\n</tr>\n<tr>\n<td></td>\n<td>{M}</td>\n<td>1-12</td>\n<td>1-12</td>\n</tr>\n<tr>\n<td>Day of Month</td>\n<td>{dd}</td>\n<td>01-31</td>\n<td>01-31</td>\n</tr>\n<tr>\n<td></td>\n<td>{d}</td>\n<td>1-31</td>\n<td>1-31</td>\n</tr>\n<tr>\n<td>Day of Week</td>\n<td>{eeee}</td>\n<td>Sunday, Monday, Tuesday, Wednesday, Thursday, Friday, Saturday</td>\n<td>星期日、星期一、星期二、星期三、星期四、星期五、星期六</td>\n</tr>\n<tr>\n<td></td>\n<td>{ee}</td>\n<td>Sun, Mon, Tues, Wed, Thu, Fri, Sat</td>\n<td>日、一、二、三、四、五、六</td>\n</tr>\n<tr>\n<td></td>\n<td>{e}</td>\n<td>1-54</td>\n<td>1-54</td>\n</tr>\n<tr>\n<td>Hour</td>\n<td>{HH}</td>\n<td>00-23</td>\n<td>00-23</td>\n</tr>\n<tr>\n<td></td>\n<td>{H}</td>\n<td>0-23</td>\n<td>0-23</td>\n</tr>\n<tr>\n<td></td>\n<td>{hh}</td>\n<td>01-12</td>\n<td>01-12</td>\n</tr>\n<tr>\n<td></td>\n<td>{h}</td>\n<td>1-12</td>\n<td>1-12</td>\n</tr>\n<tr>\n<td>Minute</td>\n<td>{mm}</td>\n<td>00-59</td>\n<td>00-59</td>\n</tr>\n<tr>\n<td></td>\n<td>{m}</td>\n<td>0-59</td>\n<td>0-59</td>\n</tr>\n<tr>\n<td>Second</td>\n<td>{ss}</td>\n<td>00-59</td>\n<td>00-59</td>\n</tr>\n<tr>\n<td></td>\n<td>{s}</td>\n<td>0-59</td>\n<td>0-59</td>\n</tr>\n<tr>\n<td>Millisecond</td>\n<td>{SSS}</td>\n<td>000-999</td>\n<td>000-999</td>\n</tr>\n<tr>\n<td></td>\n<td>{S}</td>\n<td>0-999</td>\n<td>0-999</td>\n</tr>\n</tbody>\n</table>\n<blockquote>\n<p>其他语言请参考相应<a href="https://github.com/apache/incubator-echarts/tree/master/src/i18n" target="_blank">语言包</a>中的定义,语言包可以通过 <a href="api.html#echarts.registerLocale" target="_blank">echarts.registerLocale</a> 注册。</p>\n</blockquote>\n<p>示例:</p>\n<pre><code class="lang-js">formatter: '{yyyy}-{MM}-{dd}' // 得到的 label 形如:'2020-12-02'\nformatter: '{d}日' // 得到的 label 形如:'2日'\n</code></pre>\n<p><strong> 回调函数 </strong></p>\n<p>回调函数可以根据刻度值返回不同的格式,如果有复杂的时间格式化需求,也可以引用第三方的日期时间相关的库(如 <a href="https://momentjs.com/" target="_blank">Moment.js</a>、<a href="https://date-fns.org/" target="_blank">date-fns</a> 等),返回显示的文本。</p>\n<p>示例:</p>\n<pre><code class="lang-js">// 使用函数模板,函数参数分别为刻度数值(类目),刻度的索引\nformatter: function (value, index) {\n // 格式化成月/日,只在第一个刻度显示年份\n var date = new Date(value);\n var texts = [(date.getMonth() + 1), date.getDate()];\n if (index === 0) {\n texts.unshift(date.getYear());\n }\n return texts.join('/');\n}\n</code></pre>\n<p><strong> 分级模板 </strong></p>\n<p>有时候,我们希望对不同的时间粒度采用不同的格式化策略。例如,在季度图表中,我们可能希望对每个月的第一天显示月份,而其他日期显示日期。我们可以使用以下方式实现该效果:</p>\n<p>示例:</p>\n<pre><code class="lang-js">formatter: {\n month: '{MMMM}', // 一月、二月、……\n day: '{d}日' // 1日、2日、……\n}\n</code></pre>\n<p>支持的分级以及各自默认的取值为:</p>\n<pre><code class="lang-js">{\n year: '{yyyy}',\n month: '{MMM}',\n day: '{d}',\n hour: '{HH}:{mm}',\n minute: '{HH}:{mm}',\n second: '{HH}:{mm}:{ss}',\n millisecond: '{hh}:{mm}:{ss} {SSS}',\n none: '{yyyy}-{MM}-{dd} {hh}:{mm}:{ss} {SSS}'\n}\n</code></pre>\n<p>以 <code class="codespan">day</code> 为例,当一个刻度点的值的小时、分钟、秒、毫秒都为 <code class="codespan">0</code> 时,将采用 <code class="codespan">day</code> 的分级值作为模板。<code class="codespan">none</code> 表示当其他规则都不适用时采用的模板,也就是带有毫秒值的刻度点的模板。</p>\n<p><strong> 富文本 </strong></p>\n<p>以上这三种形式的 formatter 都支持富文本,所以可以做成一些复杂的效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">xAxis: {\n type: 'time',\n axisLabel: {\n formatter: {\n // 一年的第一个月显示年度信息和月份信息\n year: '{yearStyle|{yyyy}}\\n{monthStyle|{MMM}}',\n month: '{monthStyle|{MMM}}'\n },\n rich: {\n yearStyle: {\n // 让年度信息更醒目\n color: '#000',\n fontWeight: 'bold'\n },\n monthStyle: {\n color: '#999'\n }\n }\n }\n},\n</code></pre>\n<p>使用回调函数形式实现上面例子同样的效果:</p>\n<p>示例:</p>\n<pre><code class="lang-js">xAxis: {\n type: 'time',\n axisLabel: {\n formatter: function (value) {\n const date = new Date(value);\n const yearStart = new Date(value);\n yearStart.setMonth(0);\n yearStart.setDate(1);\n yearStart.setHours(0);\n yearStart.setMinutes(0);\n yearStart.setSeconds(0);\n yearStart.setMilliseconds(0);\n // 判断一个刻度值知否为一年的开始\n if (date.getTime() === yearStart.getTime()) {\n return '{year|' + date.getFullYear() + '}\\n'\n + '{month|' + (date.getMonth() + 1) + '月}';\n }\n else {\n return '{month|' + (date.getMonth() + 1) + '月}'\n }\n },\n rich: {\n year: {\n color: '#000',\n fontWeight: 'bold'\n },\n month: {\n color: '#999'\n }\n }\n }\n},\n</code></pre>\n'},"axisLabel.showMinLabel":{desc:'\n\n<p>是否显示最小 tick 的 label。可取值 <code class="codespan">true</code>, <code class="codespan">false</code>, <code class="codespan">null</code>。默认自动判定(即如果标签重叠,不会显示最小 tick 的 label)。</p>\n',uiControl:{type:"boolean"}},"axisLabel.showMaxLabel":{desc:'\n\n<p>是否显示最大 tick 的 label。可取值 <code class="codespan">true</code>, <code class="codespan">false</code>, <code class="codespan">null</code>。默认自动判定(即如果标签重叠,不会显示最大 tick 的 label)。</p>\n',uiControl:{type:"boolean"}},"axisLabel.color":{desc:'\n\n<p>刻度标签文字的颜色,默认取 <a href="#yAxis.axisLine.lineStyle.color">axisLine.lineStyle.color</a>。支持回调函数,格式如下</p>\n<pre><code class="lang-js">(val: string) => Color\n</code></pre>\n<p>参数是标签的文本,返回颜色值,如下示例:</p>\n<pre><code class="lang-js">textStyle: {\n color: function (value, index) {\n return value >= 0 ? 'green' : 'red';\n }\n}\n</code></pre>\n',uiControl:{type:"color"}},"axisLabel.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"axisLabel.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"axisLabel.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"axisLabel.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"axisLabel.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"axisLabel.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"axisLabel.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"axisLabel.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"axisLabel.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"axisLabel.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisLabel.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"axisLabel.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"axisLabel.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"axisLabel.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisLabel.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisLabel.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisLabel.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"axisLabel.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"axisLabel.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"axisLabel.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisLabel.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"axisLabel.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisLabel.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisLabel.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisLabel.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"axisLabel.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"axisLabel.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"axisLabel.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"axisLabel.rich.<style_name>.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"axisLabel.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"axisLabel.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"axisLabel.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"axisLabel.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"axisLabel.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"axisLabel.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"axisLabel.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"axisLabel.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"axisLabel.rich.<style_name>.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"axisLabel.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisLabel.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"axisLabel.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"axisLabel.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"axisLabel.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisLabel.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisLabel.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisLabel.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"axisLabel.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"axisLabel.rich.<style_name>.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"axisLabel.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisLabel.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"axisLabel.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisLabel.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisLabel.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n\n",uiControl:{type:"number",step:"0.5"}},splitLine:{desc:'<p>坐标轴在 <a href="#grid">grid</a> 区域中的分隔线。</p>\n'},"splitLine.show":{desc:"\n\n<p>是否显示分隔线。默认数值轴显示,类目轴不显示。</p>\n",uiControl:{type:"boolean",default:"true"}},"splitLine.interval":{desc:'\n\n\n\n<p>坐标轴分隔线的显示间隔,在类目轴中有效。默认同 <a href="#yAxis.axisLabel.interval">axisLabel.interval</a> 一样。</p>\n<p>默认会采用标签不重叠的策略间隔显示标签。</p>\n<p>可以设置成 0 强制显示所有标签。</p>\n<p>如果设置为 <code class="codespan">1</code>,表示『隔一个标签显示一个标签』,如果值为 <code class="codespan">2</code>,表示隔两个标签显示一个标签,以此类推。</p>\n<p>可以用数值表示间隔的数据,也可以通过回调函数控制。回调函数格式如下:</p>\n<pre><code class="lang-js">(index:number, value: string) => boolean\n</code></pre>\n<p>第一个参数是类目的 index,第二个值是类目名称,如果跳过则返回 <code class="codespan">false</code>。</p>\n',uiControl:{type:"number",min:"0",step:"1"}},"splitLine.lineStyle.color":{desc:"\n\n<p>分隔线颜色,可以设置成单个颜色。</p>\n<p>也可以设置成颜色数组,分隔线会按数组中颜色的顺序依次循环设置颜色。</p>\n<p>示例</p>\n<pre><code>splitLine: {\n lineStyle: {\n // 使用深浅的间隔色\n color: ['#aaa', '#ddd']\n }\n}\n</code></pre>",uiControl:{type:"color"}},"splitLine.lineStyle.width":{desc:"\n\n<p>分隔线线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"splitLine.lineStyle.type":{desc:'\n\n<p>分隔线线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"splitLine.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"splitLine.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"splitLine.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"splitLine.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"splitLine.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},minorSplitLine:{desc:'<blockquote>\n<p>从 <code class="codespan">v4.6.0</code> 开始支持</p>\n</blockquote>\n<p>坐标轴在 <a href="#grid">grid</a> 区域中的次分隔线。次分割线会对齐次刻度线 <a href="#yAxis.minorTick">minorTick</a></p>\n'},"minorSplitLine.show":{desc:"\n\n<p>是否显示次分隔线。默认不显示。</p>\n",uiControl:{type:"boolean",default:"true"}},"minorSplitLine.lineStyle.color":{desc:'\n\n<p>次分隔线线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"minorSplitLine.lineStyle.width":{desc:"\n\n<p>次分隔线线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"minorSplitLine.lineStyle.type":{desc:'\n\n<p>次分隔线线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"minorSplitLine.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"minorSplitLine.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"minorSplitLine.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"minorSplitLine.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"minorSplitLine.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},splitArea:{desc:'<p>坐标轴在 <a href="#grid">grid</a> 区域中的分隔区域,默认不显示。</p>\n'},"splitArea.interval":{desc:'\n\n\n\n<p>坐标轴分隔区域的显示间隔,在类目轴中有效。默认同 <a href="#yAxis.axisLabel.interval">axisLabel.interval</a> 一样。</p>\n<p>默认会采用标签不重叠的策略间隔显示标签。</p>\n<p>可以设置成 0 强制显示所有标签。</p>\n<p>如果设置为 <code class="codespan">1</code>,表示『隔一个标签显示一个标签』,如果值为 <code class="codespan">2</code>,表示隔两个标签显示一个标签,以此类推。</p>\n<p>可以用数值表示间隔的数据,也可以通过回调函数控制。回调函数格式如下:</p>\n<pre><code class="lang-js">(index:number, value: string) => boolean\n</code></pre>\n<p>第一个参数是类目的 index,第二个值是类目名称,如果跳过则返回 <code class="codespan">false</code>。</p>\n',uiControl:{type:"number",min:"0",step:"1"}},"splitArea.show":{desc:"\n\n<p>是否显示分隔区域。</p>\n",uiControl:{type:"boolean",default:"true"}},"splitArea.areaStyle":{desc:"<p>分隔区域的样式设置。</p>\n"},"splitArea.areaStyle.color":{desc:"<p>分隔区域颜色。分隔区域会按数组中颜色的顺序依次循环设置颜色。默认是一个深浅的间隔色。</p>\n"},"splitArea.areaStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"splitArea.areaStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"splitArea.areaStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"splitArea.areaStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"splitArea.areaStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},data:{desc:'<p>类目数据,在类目轴(<a href="#yAxis.type">type</a>: <code class="codespan">'category'</code>)中有效。</p>\n<p>如果没有设置 <a href="#yAxis.type">type</a>,但是设置了 <code class="codespan">axis.data</code>,则认为 <code class="codespan">type</code> 是 <code class="codespan">'category'</code>。</p>\n<p>如果设置了 <a href="#yAxis.type">type</a> 是 <code class="codespan">'category'</code>,但没有设置 <code class="codespan">axis.data</code>,则 <code class="codespan">axis.data</code> 的内容会自动从 <a href="#series.data">series.data</a> 中获取,这会比较方便。不过注意,<code class="codespan">axis.data</code> 指明的是 <code class="codespan">'category'</code> 轴的取值范围。如果不指定而是从 <a href="#series.data">series.data</a> 中获取,那么只能获取到 <a href="#series.data">series.data</a> 中出现的值。比如说,假如 <a href="#series.data">series.data</a> 为空时,就什么也获取不到。</p>\n<p>示例:</p>\n<pre><code class="lang-js">// 所有类目名称列表\ndata: ['周一', '周二', '周三', '周四', '周五', '周六', '周日']\n// 每一项也可以是具体的配置项,此时取配置项中的 `value` 为类目名\ndata: [{\n value: '周一',\n // 突出周一\n textStyle: {\n fontSize: 20,\n color: 'red'\n }\n}, '周二', '周三', '周四', '周五', '周六', '周日']\n</code></pre>\n'},"data.value":{desc:"<p>单个类目名称。</p>\n"},"data.textStyle":{desc:"<p>类目标签的文字样式。</p>\n"},"data.textStyle.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"data.textStyle.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.textStyle.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.textStyle.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.textStyle.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.textStyle.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.textStyle.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.textStyle.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.textStyle.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.textStyle.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"data.textStyle.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.textStyle.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.textStyle.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.textStyle.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.textStyle.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.textStyle.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.textStyle.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.textStyle.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"data.textStyle.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"data.textStyle.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"data.textStyle.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.textStyle.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.textStyle.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.textStyle.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.textStyle.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.textStyle.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"data.textStyle.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"data.textStyle.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"data.textStyle.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"data.textStyle.rich.<style_name>.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"data.textStyle.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.textStyle.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.textStyle.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.textStyle.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.textStyle.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.textStyle.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.textStyle.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.textStyle.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.textStyle.rich.<style_name>.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"data.textStyle.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.textStyle.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.textStyle.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.textStyle.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.textStyle.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.textStyle.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.textStyle.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.textStyle.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.textStyle.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.textStyle.rich.<style_name>.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"data.textStyle.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.textStyle.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.textStyle.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.textStyle.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.textStyle.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},axisPointer:{desc:"<p>坐标轴指示器配置项。</p>\n"},"axisPointer.show":{desc:'\n\n<p>默认不显示。但是如果 <a href="#tooltip.trigger">tooltip.trigger</a> 设置为 <code class="codespan">'axis'</code> 或者 <a href="#tooltip.axisPointer.type">tooltip.axisPointer.type</a> 设置为 <code class="codespan">'cross'</code>,则自动显示 axisPointer。坐标系会自动选择显示显示哪个轴的 axisPointer,也可以使用 <a href="#tooltip.axisPointer.axis">tooltip.axisPointer.axis</a> 改变这种选择。</p>\n',uiControl:{type:"boolean"}},"axisPointer.type":{desc:'\n\n<p>指示器类型。</p>\n<p>可选</p>\n<ul>\n<li><p><code class="codespan">'line'</code> 直线指示器</p>\n</li>\n<li><p><code class="codespan">'shadow'</code> 阴影指示器</p>\n</li>\n<li><p><code class="codespan">'none'</code> 无指示器</p>\n</li>\n</ul>\n',uiControl:{type:"enum",options:"line,shadow,none"}},"axisPointer.snap":{desc:"<p>坐标轴指示器是否自动吸附到点上。默认自动判断。</p>\n<p>这个功能在数值轴和时间轴上比较有意义,可以自动寻找细小的数值点。</p>\n"},"axisPointer.z":{desc:'<p>坐标轴指示器的 z 值。控制图形的前后顺序。<code class="codespan">z</code>值小的图形会被<code class="codespan">z</code>值大的图形覆盖。</p>\n'},"axisPointer.label":{desc:"<p>坐标轴指示器的文本标签。</p>\n"},"axisPointer.label.show":{desc:'<p>是否显示文本标签。如果 <a href="#tooltip.axisPointer.type">tooltip.axisPointer.type</a> 设置为 <code class="codespan">'cross'</code> 则默认显示标签,否则默认不显示。</p>\n'},"axisPointer.label.precision":{desc:'<p>文本标签中数值的小数点精度。默认根据当前轴的值自动判断。也可以指定如 <code class="codespan">2</code> 表示保留两位小数。</p>\n'},"axisPointer.label.formatter":{desc:'<p>文本标签文字的格式化器。</p>\n<p>如果为 <code class="codespan">string</code>,可以是例如:<code class="codespan">formatter: 'some text {value} some text</code>,其中 <code class="codespan">{value}</code> 会被自动替换为轴的值。</p>\n<p>如果为 <code class="codespan">function</code>,可以是例如:</p>\n<p><strong>参数:</strong></p>\n<p><code class="codespan">{Object}</code> params: 含有:</p>\n<p><code class="codespan">{Object}</code> params.value: 轴当前值,如果 axis.type 为 'category' 时,其值为 axis.data 里的数值。如果 axis.type 为 <code class="codespan">'time'</code>,其值为时间戳。</p>\n<p><code class="codespan">{Array.<Object>}</code> params.seriesData: 一个数组,是当前 axisPointer 最近的点的信息,每项内容为</p>\n<p><code class="codespan">{string}</code> params.axisDimension: 轴的维度名,例如直角坐标系中是 <code class="codespan">'x'</code>、<code class="codespan">'y'</code>,极坐标系中是 <code class="codespan">'radius'</code>、<code class="codespan">'angle'</code>。</p>\n<p><code class="codespan">{number}</code> params.axisIndex: 轴的 index,<code class="codespan">0</code>、<code class="codespan">1</code>、<code class="codespan">2</code>、...</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n<p>每项内容还包括轴的信息:</p>\n<pre><code class="lang-js">{\n axisDim: 'x', // 'x', 'y', 'angle', 'radius', 'single'\n axisId: 'xxx',\n axisName: 'xxx',\n axisIndex: 3,\n axisValue: 121, // 当前 axisPointer 对应的 value。\n axisValueLabel: '文本'\n}\n</code></pre>\n<p><strong>返回值:</strong></p>\n<p>显示的 string。</p>\n<p>例如:</p>\n<pre><code class="lang-js">formatter: function (params) {\n // 假设此轴的 type 为 'time'。\n return 'some text' + echarts.format.formatTime(params.value);\n}\n</code></pre>\n'},"axisPointer.label.margin":{desc:"<p>label 距离轴的距离。</p>\n"},"axisPointer.label.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"'#fff'"}},"axisPointer.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"axisPointer.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"axisPointer.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"axisPointer.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"axisPointer.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"axisPointer.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"axisPointer.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"axisPointer.label.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"axisPointer.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisPointer.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"axisPointer.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisPointer.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisPointer.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisPointer.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"axisPointer.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"axisPointer.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"axisPointer.label.padding":{desc:'\n\n<p>axisPointer内边距,单位px,默认各方向内边距为5,接受数组分别设定上右下左边距。</p>\n<p>使用示例:</p>\n<pre><code class="lang-js">// 设置内边距为 5\npadding: 5\n// 设置上下的内边距为 5,左右的内边距为 10\npadding: [5, 10]\n// 分别设置四个方向的内边距\npadding: [\n 5, // 上\n 10, // 右\n 5, // 下\n 10, // 左\n]\n</code></pre>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"axisPointer.label.backgroundColor":{desc:'<p>文本标签的背景颜色,默认是和 <a href="#xAxis.axisLine.lineStyle.color">axis.axisLine.lineStyle.color</a> 相同。</p>\n'},"axisPointer.label.borderColor":{desc:"<p>文本标签的边框颜色。</p>\n"},"axisPointer.label.borderWidth":{desc:"<p>文本标签的边框宽度。</p>\n"},"axisPointer.label.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"3",min:"0",step:"0.5"}},"axisPointer.label.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:"#aaa"}},"axisPointer.label.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisPointer.label.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisPointer.lineStyle":{desc:'<p><a href="#tooltip.axisPointer.type">axisPointer.type</a> 为 <code class="codespan">'line'</code> 时有效。</p>\n'},"axisPointer.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"axisPointer.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"axisPointer.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"axisPointer.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"axisPointer.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"axisPointer.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisPointer.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisPointer.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"axisPointer.shadowStyle":{desc:'<p><a href="#tooltip.axisPointer.type">axisPointer.type</a> 为 <code class="codespan">'shadow'</code> 时有效。</p>\n'},"axisPointer.shadowStyle.color":{desc:'\n\n<p>填充的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"axisPointer.shadowStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"axisPointer.shadowStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"axisPointer.shadowStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisPointer.shadowStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisPointer.shadowStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"axisPointer.triggerTooltip":{desc:"\n\n<p>是否触发 tooltip。如果不想触发 tooltip 可以关掉。</p>\n",uiControl:{type:"boolean",default:"true"}},"axisPointer.value":{desc:'<p>当前的 value。在使用 <a href="xAxisPointer.handle" target="_blank">axisPointer.handle</a> 时,可以设置此值进行初始值设定,从而决定 axisPointer 的初始位置。</p>\n'},"axisPointer.status":{desc:'\n\n<p>当前的状态,可取值为 <code class="codespan">'show'</code> 和 <code class="codespan">'hide'</code>。</p>\n',uiControl:{type:"enum",options:"show,hide"}},"axisPointer.handle":{desc:'<p>拖拽手柄,适用于触屏的环境。参见 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=line-tooltip-touch&edit=1&reset=1" target="_blank">例子</a>。</p>\n'},"axisPointer.handle.show":{desc:'\n\n<p>当 show 设为 <code class="codespan">true</code> 时开启,这时显示手柄,并且 axisPointer 会一直显示。</p>\n',uiControl:{type:"boolean"}},"axisPointer.handle.icon":{desc:'\n\n<p>手柄的图标。</p>\n<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre><p>参见 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/axisPointer-handle-image&edit=1&reset=1" target="_blank">使用图片的例子</a></p>\n',uiControl:{type:"icon",clean:"true"}},"axisPointer.handle.size":{desc:'\n\n<p>手柄的尺寸,可以设置单值,如 <code class="codespan">45</code>,也可以设置为数组:<code class="codespan">[width, height]</code>。</p>\n',uiControl:{type:"vector",default:"45,45",min:"0",step:"0.5",dims:"width,height"}},"axisPointer.handle.margin":{desc:"\n\n<p>手柄与轴的距离。注意,这是手柄中心点和轴的距离。</p>\n",uiControl:{type:"number",default:"50",min:"0",step:"0.5"}},"axisPointer.handle.color":{desc:"\n\n<p>手柄颜色。</p>\n",uiControl:{type:"color"}},"axisPointer.handle.throttle":{desc:"\n\n<p>手柄拖拽时触发视图更新周期,单位毫秒,调大这个数值可以改善性能,但是降低体验。</p>\n",uiControl:{type:"number",default:"40",min:"0",step:"10"}},"axisPointer.handle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"3",min:"0",step:"0.5"}},"axisPointer.handle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:"#aaa"}},"axisPointer.handle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"2",step:"0.5"}},"axisPointer.handle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},zlevel:{desc:'<p>Y 轴所有图形的 zlevel 值。</p>\n<p><code class="codespan">zlevel</code>用于 Canvas 分层,不同<code class="codespan">zlevel</code>值的图形会放置在不同的 Canvas 中,Canvas 分层是一种常见的优化手段。我们可以把一些图形变化频繁(例如有动画)的组件设置成一个单独的<code class="codespan">zlevel</code>。需要注意的是过多的 Canvas 会引起内存开销的增大,在手机端上需要谨慎使用以防崩溃。</p>\n<p><code class="codespan">zlevel</code> 大的 Canvas 会放在 <code class="codespan">zlevel</code> 小的 Canvas 的上面。</p>\n'},z:{desc:'<p>Y 轴组件的所有图形的<code class="codespan">z</code>值。控制图形的前后顺序。<code class="codespan">z</code>值小的图形会被<code class="codespan">z</code>值大的图形覆盖。</p>\n<p><code class="codespan">z</code>相比<code class="codespan">zlevel</code>优先级更低,而且不会创建新的 Canvas。</p>\n'}};n.default=function(e){return void 0===e&&(e="x"),(0,c.objectOrArray)("x"===e?"xAxis":"yAxis","多轴模式",(0,c.buildOptions)("","x"===e?a:d))}}));
|
||
;/*!examples/components/EChartsEditor/Polar.tsx*/
|
||
amis.define("4ac2682",(function(e,n,o,s){"use strict";Object.defineProperty(n,"__esModule",{value:!0});var a=e("b666d70");n.default={type:"tabs",tabs:[{title:"坐标系",body:(0,a.buildOptions)("polar.",{id:{desc:"<p>组件 ID。默认不指定。指定则可用于在 option 或者 API 中引用组件。</p>\n"},zlevel:{desc:'<p>所有图形的 zlevel 值。</p>\n<p><code class="codespan">zlevel</code>用于 Canvas 分层,不同<code class="codespan">zlevel</code>值的图形会放置在不同的 Canvas 中,Canvas 分层是一种常见的优化手段。我们可以把一些图形变化频繁(例如有动画)的组件设置成一个单独的<code class="codespan">zlevel</code>。需要注意的是过多的 Canvas 会引起内存开销的增大,在手机端上需要谨慎使用以防崩溃。</p>\n<p><code class="codespan">zlevel</code> 大的 Canvas 会放在 <code class="codespan">zlevel</code> 小的 Canvas 的上面。</p>\n'},z:{desc:'<p>组件的所有图形的<code class="codespan">z</code>值。控制图形的前后顺序。<code class="codespan">z</code>值小的图形会被<code class="codespan">z</code>值大的图形覆盖。</p>\n<p><code class="codespan">z</code>相比<code class="codespan">zlevel</code>优先级更低,而且不会创建新的 Canvas。</p>\n'},center:{desc:"\n\n<p>极坐标系的中心(圆心)坐标,数组的第一项是横坐标,第二项是纵坐标。</p>\n<p>支持设置成百分比,设置成百分比时第一项是相对于容器宽度,第二项是相对于容器高度。</p>\n<p><strong>使用示例:</strong></p>\n<pre><code>// 设置成绝对的像素值\ncenter: [400, 300]\n// 设置成相对的百分比\ncenter: ['50%', '50%']\n</code></pre>",uiControl:{type:"percentvector",dims:"x,y"}},radius:{desc:'\n\n<p>极坐标系的半径。可以为如下类型:</p>\n<ul>\n<li><code class="codespan">number</code>:直接指定外半径值。</li>\n<li><code class="codespan">string</code>:例如,<code class="codespan">'20%'</code>,表示外半径为可视区尺寸(容器高宽中较小一项)的 20% 长度。</li>\n</ul>\n<ul>\n<li><code class="codespan">Array.<number|string></code>:数组的第一项是内半径,第二项是外半径。每一项遵从上述 <code class="codespan">number</code> <code class="codespan">string</code> 的描述。</li>\n</ul>\n',uiControl:{type:"percentvector",dims:"inner,outer",default:"0%, 75%"}},tooltip:{desc:'<p>本坐标系特定的 tooltip 设定。</p>\n<hr>\n<p><strong>提示框组件的通用介绍:</strong></p>\n<p>提示框组件可以设置在多种地方:</p>\n<ul>\n<li><p>可以设置在全局,即 <a href="#tooltip">tooltip</a></p>\n</li>\n<li><p>可以设置在坐标系中,即 <a href="#grid.tooltip">grid.tooltip</a>、<a href="#polar.tooltip">polar.tooltip</a>、<a href="#single.tooltip">single.tooltip</a></p>\n</li>\n<li><p>可以设置在系列中,即 <a href="#series.tooltip">series.tooltip</a></p>\n</li>\n<li><p>可以设置在系列的每个数据项中,即 <a href="#series.data.tooltip">series.data.tooltip</a></p>\n</li>\n</ul>\n<hr>\n'},"tooltip.show":{desc:'\n\n<p>是否显示提示框组件,包括提示框浮层和 <a href="#tooltip.axisPointer">axisPointer</a>。</p>\n',uiControl:{type:"boolean",default:"true"}},"tooltip.trigger":{desc:'\n\n<p>触发类型。</p>\n<p>可选:</p>\n<ul>\n<li><p><code class="codespan">'item'</code></p>\n<p> 数据项图形触发,主要在散点图,饼图等无类目轴的图表中使用。</p>\n</li>\n<li><p><code class="codespan">'axis'</code></p>\n<p> 坐标轴触发,主要在柱状图,折线图等会使用类目轴的图表中使用。</p>\n<p> 在 ECharts 2.x 中只支持类目轴上使用 axis trigger,在 ECharts 3 中支持在<a href="#grid">直角坐标系</a>和<a href="#polar">极坐标系</a>上的所有类型的轴。并且可以通过 <a href="#tooltip.axisPointer.axis">axisPointer.axis</a> 指定坐标轴。</p>\n</li>\n<li><p><code class="codespan">'none'</code></p>\n<p> 什么都不触发。</p>\n</li>\n</ul>\n',uiControl:{type:"enum",options:"item,axis,none",default:"item"}},"tooltip.axisPointer":{desc:'<p>坐标轴指示器配置项。</p>\n<p><code class="codespan">tooltip.axisPointer</code> 是配置坐标轴指示器的快捷方式。实际上坐标轴指示器的全部功能,都可以通过轴上的 axisPointer 配置项完成(例如 <a href="#xAxis.axisPointer">xAxis.axisPointer</a> 或 <a href="#angleAxis.axisPointer">angleAxis.axisPointer</a>)。但是使用 <code class="codespan">tooltip.axisPointer</code> 在简单场景下会更方便一些。</p>\n<blockquote>\n<p><strong>注意:</strong> <code class="codespan">tooltip.axisPointer</code> 中诸配置项的优先级低于轴上的 axisPointer 的配置项。</p>\n</blockquote>\n<hr>\n<p>坐标轴指示器是指示坐标轴当前刻度的工具。</p>\n<p>如下例,鼠标悬浮到图上,可以出现标线和刻度文本。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/candlestick-axisPointer&edit=1&reset=1" width="600" height="450"><iframe />\n\n\n<p>上例中,使用了 <a href="#axisPointer.link">axisPointer.link</a> 来关联不同的坐标系中的 axisPointer。</p>\n<p>坐标轴指示器也有适合触屏的交互方式,如下:</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=line-tooltip-touch&edit=1&reset=1" width="600" height="400"><iframe />\n\n\n<p>坐标轴指示器在多轴的场景能起到辅助作用:</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=multiple-y-axis&edit=1&reset=1" width="600" height="300"><iframe />\n\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=multiple-x-axis&edit=1&reset=1" width="600" height="300"><iframe />\n\n\n\n\n<hr>\n<blockquote>\n<p><strong>注意:</strong>\n一般来说,axisPointer 的具体配置项会配置在各个轴中(如 <a href="#xAxis.axisPointer">xAxis.axisPointer</a>)或者 <code class="codespan">tooltip</code> 中(如 <a href="#tooltip.axisPointer">tooltip.axisPointer</a>)。</p>\n</blockquote>\n<blockquote>\n<p>但是这几个选项只能配置在全局的 axisPointer 中:<a href="#axisPointer.triggerOn">axisPointer.triggerOn</a>、<a href="#axisPointer.link">axisPointer.link</a>。</p>\n</blockquote>\n<hr>\n<p><strong>如何显示 axisPointer:</strong></p>\n<p>直角坐标系 <a href="#grid">grid</a>、极坐标系 <a href="#polar">polar</a>、单轴坐标系 <a href="#single">single</a> 中的每个轴都自己的 axisPointer。</p>\n<p>他们的 axisPointer 默认不显示。有两种方法可以让他们显示:</p>\n<ul>\n<li><p>设置轴上的 <code class="codespan">axisPointer.show</code>(例如 <a href="#xAxis.axisPointer.show">xAxis.axisPointer.show</a>)为 <code class="codespan">true</code>,则显示此轴的 axisPointer。</p>\n</li>\n<li><p>设置 <a href="#tooltip.trigger">tooltip.trigger</a> 设置为 <code class="codespan">'axis'</code> 或者 <a href="#tooltip.axisPointer.type">tooltip.axisPointer.type</a> 设置为 <code class="codespan">'cross'</code>,则此时坐标系会自动选择显示哪个轴的 axisPointer,也可以使用 <a href="#tooltip.axisPointer.axis">tooltip.axisPointer.axis</a> 改变这种选择。注意,轴上如果设置了 axisPointer,会覆盖此设置。</p>\n</li>\n</ul>\n<hr>\n<p><strong>如何显示 axisPointer 的 label:</strong></p>\n<p>axisPointer 的 label 默认不显示(也就是默认只显示指示线),除非:</p>\n<ul>\n<li><p>设置轴上的 <code class="codespan">axisPointer.label.show</code>(例如 <a href="#xAxis.axisPointer.show">xAxis.axisPointer.label.show</a>)为 <code class="codespan">true</code>,则显示此轴的 axisPointer 的 label。</p>\n</li>\n<li><p>设置 <a href="#tooltip.axisPointer.type">tooltip.axisPointer.type</a> 为 <code class="codespan">'cross'</code> 时会自动显示 axisPointer 的 label。</p>\n</li>\n</ul>\n<hr>\n<p><strong>关于触屏的 axisPointer 的设置</strong></p>\n<p>设置轴上的 <code class="codespan">axisPointer.handle.show</code>(例如 <a href="#xAxis.axisPointer.handle.show">xAxis.axisPointer.handle.show</a> 为 <code class="codespan">true</code> 则会显示出此 axisPointer 的拖拽按钮。(polar 坐标系暂不支持此功能)。</p>\n<p><strong>注意:</strong>\n如果发现此时 tooltip 效果不良好,可设置 <a href="#tooltip.triggerOn">tooltip.triggerOn</a> 为 <code class="codespan">'none'</code>(于是效果为:手指按住按钮则显示 tooltip,松开按钮则隐藏 tooltip),或者 <a href="#tooltip.alwaysShowContent">tooltip.alwaysShowContent</a> 为 <code class="codespan">true</code>(效果为 tooltip 一直显示)。</p>\n<p>参见<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=line-tooltip-touch&edit=1&reset=1" target="_blank">例子</a>。</p>\n<hr>\n<p><strong>自动吸附到数据(snap)</strong></p>\n<p>对于数值轴、时间轴,如果开启了 <a href="#xAxis.axisPointer.snap">snap</a>,则 axisPointer 会自动吸附到最近的点上。</p>\n<hr>\n'},"tooltip.axisPointer.type":{desc:'\n\n<p>指示器类型。</p>\n<p>可选</p>\n<ul>\n<li><p><code class="codespan">'line'</code> 直线指示器</p>\n</li>\n<li><p><code class="codespan">'shadow'</code> 阴影指示器</p>\n</li>\n<li><p><code class="codespan">'none'</code> 无指示器</p>\n</li>\n<li><p><code class="codespan">'cross'</code> 十字准星指示器。其实是种简写,表示启用两个正交的轴的 axisPointer。</p>\n</li>\n</ul>\n',uiControl:{type:"enum",options:"none,line,shadow,cross",default:"line"}},"tooltip.axisPointer.axis":{desc:'<p>指示器的坐标轴。</p>\n<p>默认情况,坐标系会自动选择显示哪个轴的 axisPointer(默认取类目轴或者时间轴)。</p>\n<p>可以是 <code class="codespan">'x'</code>, <code class="codespan">'y'</code>, <code class="codespan">'radius'</code>, <code class="codespan">'angle'</code>。</p>\n'},"tooltip.axisPointer.snap":{desc:"<p>坐标轴指示器是否自动吸附到点上。默认自动判断。</p>\n<p>这个功能在数值轴和时间轴上比较有意义,可以自动寻找细小的数值点。</p>\n"},"tooltip.axisPointer.z":{desc:'<p>坐标轴指示器的 z 值。控制图形的前后顺序。<code class="codespan">z</code>值小的图形会被<code class="codespan">z</code>值大的图形覆盖。</p>\n'},"tooltip.axisPointer.label":{desc:"<p>坐标轴指示器的文本标签。</p>\n"},"tooltip.axisPointer.label.show":{desc:'<p>是否显示文本标签。如果 <a href="#tooltip.axisPointer.type">tooltip.axisPointer.type</a> 设置为 <code class="codespan">'cross'</code> 则默认显示标签,否则默认不显示。</p>\n'},"tooltip.axisPointer.label.precision":{desc:'<p>文本标签中数值的小数点精度。默认根据当前轴的值自动判断。也可以指定如 <code class="codespan">2</code> 表示保留两位小数。</p>\n'},"tooltip.axisPointer.label.formatter":{desc:'<p>文本标签文字的格式化器。</p>\n<p>如果为 <code class="codespan">string</code>,可以是例如:<code class="codespan">formatter: 'some text {value} some text</code>,其中 <code class="codespan">{value}</code> 会被自动替换为轴的值。</p>\n<p>如果为 <code class="codespan">function</code>,可以是例如:</p>\n<p><strong>参数:</strong></p>\n<p><code class="codespan">{Object}</code> params: 含有:</p>\n<p><code class="codespan">{Object}</code> params.value: 轴当前值,如果 axis.type 为 'category' 时,其值为 axis.data 里的数值。如果 axis.type 为 <code class="codespan">'time'</code>,其值为时间戳。</p>\n<p><code class="codespan">{Array.<Object>}</code> params.seriesData: 一个数组,是当前 axisPointer 最近的点的信息,每项内容为</p>\n<p><code class="codespan">{string}</code> params.axisDimension: 轴的维度名,例如直角坐标系中是 <code class="codespan">'x'</code>、<code class="codespan">'y'</code>,极坐标系中是 <code class="codespan">'radius'</code>、<code class="codespan">'angle'</code>。</p>\n<p><code class="codespan">{number}</code> params.axisIndex: 轴的 index,<code class="codespan">0</code>、<code class="codespan">1</code>、<code class="codespan">2</code>、...</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n<p>每项内容还包括轴的信息:</p>\n<pre><code class="lang-js">{\n axisDim: 'x', // 'x', 'y', 'angle', 'radius', 'single'\n axisId: 'xxx',\n axisName: 'xxx',\n axisIndex: 3,\n axisValue: 121, // 当前 axisPointer 对应的 value。\n axisValueLabel: '文本'\n}\n</code></pre>\n<p><strong>返回值:</strong></p>\n<p>显示的 string。</p>\n<p>例如:</p>\n<pre><code class="lang-js">formatter: function (params) {\n // 假设此轴的 type 为 'time'。\n return 'some text' + echarts.format.formatTime(params.value);\n}\n</code></pre>\n'},"tooltip.axisPointer.label.margin":{desc:"<p>label 距离轴的距离。</p>\n"},"tooltip.axisPointer.label.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"'#fff'"}},"tooltip.axisPointer.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"tooltip.axisPointer.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"tooltip.axisPointer.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"tooltip.axisPointer.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"tooltip.axisPointer.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"tooltip.axisPointer.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"tooltip.axisPointer.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"tooltip.axisPointer.label.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"tooltip.axisPointer.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"tooltip.axisPointer.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"tooltip.axisPointer.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"tooltip.axisPointer.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"tooltip.axisPointer.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"tooltip.axisPointer.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"tooltip.axisPointer.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"tooltip.axisPointer.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"tooltip.axisPointer.label.padding":{desc:'\n\n<p>axisPointer内边距,单位px,默认各方向内边距为5,接受数组分别设定上右下左边距。</p>\n<p>使用示例:</p>\n<pre><code class="lang-js">// 设置内边距为 5\npadding: 5\n// 设置上下的内边距为 5,左右的内边距为 10\npadding: [5, 10]\n// 分别设置四个方向的内边距\npadding: [\n 5, // 上\n 10, // 右\n 5, // 下\n 10, // 左\n]\n</code></pre>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"tooltip.axisPointer.label.backgroundColor":{desc:'<p>文本标签的背景颜色,默认是和 <a href="#xAxis.axisLine.lineStyle.color">axis.axisLine.lineStyle.color</a> 相同。</p>\n'},"tooltip.axisPointer.label.borderColor":{desc:"<p>文本标签的边框颜色。</p>\n"},"tooltip.axisPointer.label.borderWidth":{desc:"<p>文本标签的边框宽度。</p>\n"},"tooltip.axisPointer.label.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"3",min:"0",step:"0.5"}},"tooltip.axisPointer.label.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:"#aaa"}},"tooltip.axisPointer.label.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"tooltip.axisPointer.label.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"tooltip.axisPointer.lineStyle":{desc:'<p><a href="#tooltip.axisPointer.type">axisPointer.type</a> 为 <code class="codespan">'line'</code> 时有效。</p>\n'},"tooltip.axisPointer.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"tooltip.axisPointer.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"tooltip.axisPointer.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"tooltip.axisPointer.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"tooltip.axisPointer.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"tooltip.axisPointer.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"tooltip.axisPointer.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"tooltip.axisPointer.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"tooltip.axisPointer.shadowStyle":{desc:'<p><a href="#tooltip.axisPointer.type">axisPointer.type</a> 为 <code class="codespan">'shadow'</code> 时有效。</p>\n'},"tooltip.axisPointer.shadowStyle.color":{desc:'\n\n<p>填充的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"tooltip.axisPointer.shadowStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"tooltip.axisPointer.shadowStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"tooltip.axisPointer.shadowStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"tooltip.axisPointer.shadowStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"tooltip.axisPointer.shadowStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"tooltip.axisPointer.crossStyle":{desc:'<p><a href="#tooltip.axisPointer.type">axisPointer.type</a> 为 <code class="codespan">'cross'</code> 时有效。</p>\n'},"tooltip.axisPointer.crossStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"tooltip.axisPointer.crossStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"tooltip.axisPointer.crossStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"tooltip.axisPointer.crossStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"tooltip.axisPointer.crossStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"tooltip.axisPointer.crossStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"tooltip.axisPointer.crossStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"tooltip.axisPointer.crossStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"tooltip.axisPointer.animation":{desc:"\n\n<p>是否开启动画。</p>\n",uiControl:{type:"boolean",default:"true",clean:"true"}},"tooltip.axisPointer.animationThreshold":{desc:"<p>是否开启动画的阈值,当单个系列显示的图形数量大于这个阈值时会关闭动画。</p>\n"},"tooltip.axisPointer.animationDuration":{desc:'\n\n<p>初始动画的时长,支持回调函数,可以通过每个数据返回不同的时长实现更戏剧的初始动画效果:</p>\n<pre><code class="lang-js">animationDuration: function (idx) {\n // 越往后的数据时长越大\n return idx * 100;\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",default:"1000",step:"20",clean:"true"}},"tooltip.axisPointer.animationEasing":{desc:'\n\n<p>初始动画的缓动效果。不同的缓动效果可以参考 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=line-easing" target="_blank">缓动示例</a>。</p>\n',uiControl:{type:"enum",options:"linear,quadraticIn,quadraticOut,quadraticInOut,cubicIn,cubicOut,cubicInOut,quarticIn,quarticOut,quarticInOut,quinticIn,quinticOut,quinticInOut,sinusoidalIn,sinusoidalOut,sinusoidalInOut,exponentialIn,exponentialOut,exponentialInOut,circularIn,circularOut,circularInOut,elasticIn,elasticOut,elasticInOut,backIn,backOut,backInOut,bounceIn,bounceOut,bounceInOut",clean:"true"}},"tooltip.axisPointer.animationDelay":{desc:'<p>初始动画的延迟,支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的初始动画效果。</p>\n<p>如下示例:</p>\n<pre><code class="lang-js">animationDelay: function (idx) {\n // 越往后的数据延迟越大\n return idx * 100;\n}\n</code></pre>\n<p>也可以看<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-animation-delay" target="_blank">该示例</a></p>\n'},"tooltip.axisPointer.animationDurationUpdate":{desc:'\n\n<p>数据更新动画的时长。</p>\n<p>支持回调函数,可以通过每个数据返回不同的时长实现更戏剧的更新动画效果:</p>\n<pre><code class="lang-js">animationDurationUpdate: function (idx) {\n // 越往后的数据时长越大\n return idx * 100;\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",default:"1000",step:"20"}},"tooltip.axisPointer.animationEasingUpdate":{desc:"\n\n<p>数据更新动画的缓动效果。</p>\n",uiControl:{type:"enum",options:"linear,quadraticIn,quadraticOut,quadraticInOut,cubicIn,cubicOut,cubicInOut,quarticIn,quarticOut,quarticInOut,quinticIn,quinticOut,quinticInOut,sinusoidalIn,sinusoidalOut,sinusoidalInOut,exponentialIn,exponentialOut,exponentialInOut,circularIn,circularOut,circularInOut,elasticIn,elasticOut,elasticInOut,backIn,backOut,backInOut,bounceIn,bounceOut,bounceInOut"}},"tooltip.axisPointer.animationDelayUpdate":{desc:'<p>数据更新动画的延迟,支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的更新动画效果。</p>\n<p>如下示例:</p>\n<pre><code class="lang-js">animationDelayUpdate: function (idx) {\n // 越往后的数据延迟越大\n return idx * 100;\n}\n</code></pre>\n<p>也可以看<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-animation-delay" target="_blank">该示例</a></p>\n'},"tooltip.position":{desc:'<p>提示框浮层的位置,默认不设置时位置会跟随鼠标的位置。</p>\n<p>可选:</p>\n<ul>\n<li><p><code class="codespan">Array</code></p>\n<p> 通过数组表示提示框浮层的位置,支持数字设置绝对位置,百分比设置相对位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对位置,相对于容器左侧 10px, 上侧 10 px\n position: [10, 10]\n // 相对位置,放置在容器正中间\n position: ['50%', '50%']\n</code></pre>\n</li>\n<li><p><code class="codespan">Function</code></p>\n<p> 回调函数,格式如下:</p>\n<pre><code class="lang-js"> (point: Array, params: Object|Array.<Object>, dom: HTMLDomElement, rect: Object, size: Object) => Array\n</code></pre>\n<p> <strong>参数:</strong><br>\n point: 鼠标位置,如 [20, 40]。<br>\n params: 同 formatter 的参数相同。<br>\n dom: tooltip 的 dom 对象。<br>\n rect: 只有鼠标在图形上时有效,是一个用<code class="codespan">x</code>, <code class="codespan">y</code>, <code class="codespan">width</code>, <code class="codespan">height</code>四个属性表达的图形包围盒。<br>\n size: 包括 dom 的尺寸和 echarts 容器的当前尺寸,例如:<code class="codespan">{contentSize: [width, height], viewSize: [width, height]}</code>。<br></p>\n<p> <strong>返回值:</strong><br>\n 可以是一个表示 tooltip 位置的数组,数组值可以是绝对的像素值,也可以是相 百分比。<br>\n 也可以是一个对象,如:<code class="codespan">{left: 10, top: 30}</code>,或者 <code class="codespan">{right: '20%', bottom: 40}</code>。<br></p>\n<p> 如下示例:</p>\n<pre><code class="lang-js"> position: function (point, params, dom, rect, size) {\n // 固定在顶部\n return [point[0], '10%'];\n }\n</code></pre>\n<p> 或者:</p>\n<pre><code class="lang-js"> position: function (pos, params, dom, rect, size) {\n // 鼠标在左侧时 tooltip 显示到右侧,鼠标在右侧时 tooltip 显示到左侧。\n var obj = {top: 60};\n obj[['left', 'right'][+(pos[0] < size.viewSize[0] / 2)]] = 5;\n return obj;\n }\n</code></pre>\n</li>\n</ul>\n<ul>\n<li><p><code class="codespan">'inside'</code></p>\n<p> 鼠标所在图形的内部中心位置,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'top'</code></p>\n<p> 鼠标所在图形上侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'left'</code></p>\n<p> 鼠标所在图形左侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'right'</code></p>\n<p> 鼠标所在图形右侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'bottom'</code></p>\n<p> 鼠标所在图形底侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n</ul>\n'},"tooltip.formatter":{desc:'<p>提示框浮层内容格式器,支持字符串模板和回调函数两种形式。</p>\n<p><strong>1, 字符串模板</strong></p>\n<p>模板变量有 <code class="codespan">{a}</code>, <code class="codespan">{b}</code>,<code class="codespan">{c}</code>,<code class="codespan">{d}</code>,<code class="codespan">{e}</code>,分别表示系列名,数据名,数据值等。\n在 <a href="#tooltip.trigger">trigger</a> 为 <code class="codespan">'axis'</code> 的时候,会有多个系列的数据,此时可以通过 <code class="codespan">{a0}</code>, <code class="codespan">{a1}</code>, <code class="codespan">{a2}</code> 这种后面加索引的方式表示系列的索引。\n不同图表类型下的 <code class="codespan">{a}</code>,<code class="codespan">{b}</code>,<code class="codespan">{c}</code>,<code class="codespan">{d}</code> 含义不一样。\n其中变量<code class="codespan">{a}</code>, <code class="codespan">{b}</code>, <code class="codespan">{c}</code>, <code class="codespan">{d}</code>在不同图表类型下代表数据含义为:</p>\n<ul>\n<li><p>折线(区域)图、柱状(条形)图、K线图 : <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(类目值),<code class="codespan">{c}</code>(数值), <code class="codespan">{d}</code>(无)</p>\n</li>\n<li><p>散点图(气泡)图 : <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(数据名称),<code class="codespan">{c}</code>(数值数组), <code class="codespan">{d}</code>(无)</p>\n</li>\n<li><p>地图 : <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(区域名称),<code class="codespan">{c}</code>(合并数值), <code class="codespan">{d}</code>(无)</p>\n</li>\n<li><p>饼图、仪表盘、漏斗图: <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(数据项名称),<code class="codespan">{c}</code>(数值), <code class="codespan">{d}</code>(百分比)</p>\n</li>\n</ul>\n<p>更多其它图表模板变量的含义可以见相应的图表的 label.formatter 配置项。</p>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b0}: {c0}<br />{b1}: {c1}'\n</code></pre>\n<p><strong>2, 回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array, ticket: string, callback: (ticket: string, html: string)) => string\n</code></pre>\n<p>第一个参数 <code class="codespan">params</code> 是 formatter 需要的数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n // 饼图的百分比\n percent: number,\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n<p>在 <a href="#tooltip.trigger">trigger</a> 为 <code class="codespan">'axis'</code> 的时候,或者 tooltip 被 <a href="#xAxis.axisPointer">axisPointer</a> 触发的时候,<code class="codespan">params</code> 是多个系列的数据数组。其中每项内容格式同上,并且,</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n<p><strong>注:</strong> ECharts 2.x 使用数组表示各参数的方式不再支持。</p>\n<p>第二个参数 <code class="codespan">ticket</code> 是异步回调标识,配合第三个参数 <code class="codespan">callback</code> 使用。\n第三个参数 <code class="codespan">callback</code> 是异步回调,在提示框浮层内容是异步获取的时候,可以通过 callback 传入上述的 <code class="codespan">ticket</code> 和 <code class="codespan">html</code> 更新提示框浮层内容。</p>\n<p>示例:</p>\n<pre><code class="lang-js">formatter: function (params, ticket, callback) {\n $.get('detail?name=' + params.name, function (content) {\n callback(ticket, toHTML(content));\n });\n return 'Loading';\n}\n</code></pre>\n'},"tooltip.backgroundColor":{desc:"<p>提示框浮层的背景颜色。</p>\n"},"tooltip.borderColor":{desc:"\n\n\n\n\n\n\n\n\n\n<p>提示框浮层的边框颜色。</p>\n",uiControl:{type:"color",default:"#333"}},"tooltip.borderWidth":{desc:"\n\n\n\n\n\n\n\n\n\n<p>提示框浮层的边框宽。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"tooltip.padding":{desc:'\n\n\n\n\n\n\n\n\n\n\n\n\n\n<p>提示框浮层内边距,单位px,默认各方向内边距为5,接受数组分别设定上右下左边距。</p>\n<p>使用示例:</p>\n<pre><code class="lang-js">// 设置内边距为 5\npadding: 5\n// 设置上下的内边距为 5,左右的内边距为 10\npadding: [5, 10]\n// 分别设置四个方向的内边距\npadding: [\n 5, // 上\n 10, // 右\n 5, // 下\n 10, // 左\n]\n</code></pre>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"tooltip.textStyle":{desc:"<p>提示框浮层的文本样式。</p>\n"},"tooltip.textStyle.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"'#fff'"}},"tooltip.textStyle.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"tooltip.textStyle.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"tooltip.textStyle.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"tooltip.textStyle.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"14",min:"1",step:"1"}},"tooltip.textStyle.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"tooltip.textStyle.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"tooltip.textStyle.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"tooltip.textStyle.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"tooltip.textStyle.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"tooltip.textStyle.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"tooltip.textStyle.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"tooltip.textStyle.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"tooltip.textStyle.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"tooltip.textStyle.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"tooltip.textStyle.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"tooltip.textStyle.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"tooltip.extraCssText":{desc:'<p>额外附加到浮层的 css 样式。如下为浮层添加阴影的示例:</p>\n<pre><code class="lang-js">extraCssText: 'box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);'\n</code></pre>\n'}})},{title:"径向轴",body:(0,a.buildOptions)("radiusAxis.",{id:{desc:"<p>组件 ID。默认不指定。指定则可用于在 option 或者 API 中引用组件。</p>\n"},polarIndex:{desc:"<p>径向轴所在的极坐标系的索引,默认使用第一个极坐标系。</p>\n"},type:{desc:'<p>坐标轴类型。</p>\n<p>可选:</p>\n<ul>\n<li><p><code class="codespan">'value'</code>\n 数值轴,适用于连续数据。</p>\n</li>\n<li><p><code class="codespan">'category'</code>\n 类目轴,适用于离散的类目数据。为该类型时类目数据可自动从 <a href="#series.data">series.data</a> 或 <a href="#dataset.source">dataset.source</a> 中取,或者可通过 <a href="#radiusAxis.data">radiusAxis.data</a> 设置类目数据。</p>\n</li>\n<li><p><code class="codespan">'time'</code>\n 时间轴,适用于连续的时序数据,与数值轴相比时间轴带有时间的格式化,在刻度计算上也有所不同,例如会根据跨度的范围来决定使用月,星期,日还是小时范围的刻度。</p>\n</li>\n<li><p><code class="codespan">'log'</code>\n 对数轴。适用于对数数据。</p>\n</li>\n</ul>\n'},name:{desc:"\n\n<p>坐标轴名称。</p>\n",uiControl:{type:"text"}},nameLocation:{desc:'\n\n<p>坐标轴名称显示位置。</p>\n<p><strong>可选:</strong></p>\n<ul>\n<li><code class="codespan">'start'</code></li>\n<li><code class="codespan">'middle'</code> 或者 <code class="codespan">'center'</code></li>\n<li><code class="codespan">'end'</code></li>\n</ul>\n',uiControl:{type:"enum",options:"start,middle,end",default:"end"}},nameTextStyle:{desc:"<p>坐标轴名称的文字样式。</p>\n"},"nameTextStyle.color":{desc:'\n\n<p>坐标轴名称的颜色,默认取 <a href="#radiusAxis.axisLine.lineStyle.color">axisLine.lineStyle.color</a>。</p>\n',uiControl:{type:"color"}},"nameTextStyle.fontStyle":{desc:'\n\n<p>坐标轴名称文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"nameTextStyle.fontWeight":{desc:'\n\n<p>坐标轴名称文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"nameTextStyle.fontFamily":{desc:"\n\n<p>坐标轴名称文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"nameTextStyle.fontSize":{desc:"\n\n<p>坐标轴名称文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"nameTextStyle.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"nameTextStyle.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"nameTextStyle.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"nameTextStyle.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"nameTextStyle.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"nameTextStyle.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"nameTextStyle.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"nameTextStyle.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"nameTextStyle.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"nameTextStyle.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"nameTextStyle.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"nameTextStyle.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"nameTextStyle.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"nameTextStyle.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"nameTextStyle.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"nameTextStyle.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"nameTextStyle.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"nameTextStyle.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"nameTextStyle.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"nameTextStyle.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"nameTextStyle.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"nameTextStyle.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"nameTextStyle.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"nameTextStyle.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"nameTextStyle.rich.<style_name>.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"nameTextStyle.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"nameTextStyle.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"nameTextStyle.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"nameTextStyle.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"nameTextStyle.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"nameTextStyle.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"nameTextStyle.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"nameTextStyle.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"nameTextStyle.rich.<style_name>.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"nameTextStyle.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"nameTextStyle.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"nameTextStyle.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"nameTextStyle.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"nameTextStyle.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"nameTextStyle.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"nameTextStyle.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"nameTextStyle.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"nameTextStyle.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"nameTextStyle.rich.<style_name>.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"nameTextStyle.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"nameTextStyle.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"nameTextStyle.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"nameTextStyle.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"nameTextStyle.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n\n",uiControl:{type:"number",step:"0.5"}},nameGap:{desc:"\n\n<p>坐标轴名称与轴线之间的距离。</p>\n",uiControl:{type:"number",step:"0.5",default:"15"}},nameRotate:{desc:"\n\n<p>坐标轴名字旋转,角度值。</p>\n",uiControl:{type:"angle",min:"-360",max:"360",step:"1"}},inverse:{desc:"\n\n<p>是否是反向坐标轴。</p>\n",uiControl:{type:"boolean"}},boundaryGap:{desc:'\n\n<p>坐标轴两边留白策略,类目轴和非类目轴的设置和表现不一样。</p>\n<p>类目轴中 <code class="codespan">boundaryGap</code> 可以配置为 <code class="codespan">true</code> 和 <code class="codespan">false</code>。默认为 <code class="codespan">true</code>,这时候<a href="#radiusAxis.axisTick">刻度</a>只是作为分隔线,标签和数据点都会在两个<a href="#radiusAxis.axisTick">刻度</a>之间的带(band)中间。</p>\n<p>非类目轴,包括时间,数值,对数轴,<code class="codespan">boundaryGap</code>是一个两个值的数组,分别表示数据最小值和最大值的延伸范围,可以直接设置数值或者相对的百分比,在设置 <a href="#radiusAxis.min">min</a> 和 <a href="#radiusAxis.max">max</a> 后无效。\n<strong>示例:</strong></p>\n<pre><code class="lang-js">boundaryGap: ['20%', '20%']\n</code></pre>\n',uiControl:{type:"boolean"}},min:{desc:'\n\n<p>坐标轴刻度最小值。</p>\n<p>可以设置成特殊值 <code class="codespan">'dataMin'</code>,此时取数据在该轴上的最小值作为最小刻度。</p>\n<p>不设置时会自动计算最小值保证坐标轴刻度的均匀分布。</p>\n<p>在类目轴中,也可以设置为类目的序数(如类目轴 <code class="codespan">data: ['类A', '类B', '类C']</code> 中,序数 <code class="codespan">2</code> 表示 <code class="codespan">'类C'</code>。也可以设置为负数,如 <code class="codespan">-3</code>)。</p>\n<p>当设置成 <code class="codespan">function</code> 形式时,可以根据计算得出的数据最大最小值设定坐标轴的最小值。如:</p>\n<pre><code class="lang-js">min: function (value) {\n return value.min - 20;\n}\n</code></pre>\n<p>其中 <code class="codespan">value</code> 是一个包含 <code class="codespan">min</code> 和 <code class="codespan">max</code> 的对象,分别表示数据的最大最小值,这个函数可返回坐标轴的最小值,也可返回 <code class="codespan">null</code>/<code class="codespan">undefined</code> 来表示“自动计算最小值”(返回 <code class="codespan">null</code>/<code class="codespan">undefined</code> 从 <code class="codespan">v4.8.0</code> 开始支持)。</p>\n',uiControl:{type:"number"}},max:{desc:'\n\n<p>坐标轴刻度最大值。</p>\n<p>可以设置成特殊值 <code class="codespan">'dataMax'</code>,此时取数据在该轴上的最大值作为最大刻度。</p>\n<p>不设置时会自动计算最大值保证坐标轴刻度的均匀分布。</p>\n<p>在类目轴中,也可以设置为类目的序数(如类目轴 <code class="codespan">data: ['类A', '类B', '类C']</code> 中,序数 <code class="codespan">2</code> 表示 <code class="codespan">'类C'</code>。也可以设置为负数,如 <code class="codespan">-3</code>)。</p>\n<p>当设置成 <code class="codespan">function</code> 形式时,可以根据计算得出的数据最大最小值设定坐标轴的最小值。如:</p>\n<pre><code class="lang-js">max: function (value) {\n return value.max - 20;\n}\n</code></pre>\n<p>其中 <code class="codespan">value</code> 是一个包含 <code class="codespan">min</code> 和 <code class="codespan">max</code> 的对象,分别表示数据的最大最小值,这个函数可返回坐标轴的最大值,也可返回 <code class="codespan">null</code>/<code class="codespan">undefined</code> 来表示“自动计算最大值”(返回 <code class="codespan">null</code>/<code class="codespan">undefined</code> 从 <code class="codespan">v4.8.0</code> 开始支持)。</p>\n',uiControl:{type:"number"}},scale:{desc:'\n\n<p>只在数值轴中(<a href="#radiusAxis.type">type</a>: 'value')有效。</p>\n<p>是否是脱离 0 值比例。设置成 <code class="codespan">true</code> 后坐标刻度不会强制包含零刻度。在双数值轴的散点图中比较有用。</p>\n<p>在设置 <a href="#radiusAxis.min">min</a> 和 <a href="#radiusAxis.max">max</a> 之后该配置项无效。</p>\n',uiControl:{type:"boolean"}},splitNumber:{desc:"\n\n<p>坐标轴的分割段数,需要注意的是这个分割段数只是个预估值,最后实际显示的段数会在这个基础上根据分割后坐标轴刻度显示的易读程度作调整。</p>\n<p>在类目轴中无效。</p>\n",uiControl:{type:"number",min:"1",step:"1",default:"5"}},minInterval:{desc:'\n\n<p>自动计算的坐标轴最小间隔大小。</p>\n<p>例如可以设置成<code class="codespan">1</code>保证坐标轴分割刻度显示成整数。</p>\n<pre><code class="lang-js">{\n minInterval: 1\n}\n</code></pre>\n<p>只在数值轴或时间轴中(<a href="#radiusAxis.type">type</a>: 'value' 或 'time')有效。</p>\n',uiControl:{type:"number"}},maxInterval:{desc:'\n\n<p>自动计算的坐标轴最大间隔大小。</p>\n<p>例如,在时间轴((<a href="#radiusAxis.type">type</a>: 'time'))可以设置成 <code class="codespan">3600 * 24 * 1000</code> 保证坐标轴分割刻度最大为一天。</p>\n<pre><code class="lang-js">{\n maxInterval: 3600 * 24 * 1000\n}\n</code></pre>\n<p>只在数值轴或时间轴中(<a href="#radiusAxis.type">type</a>: 'value' 或 'time')有效。</p>\n',uiControl:{type:"number"}},interval:{desc:'\n\n<p>强制设置坐标轴分割间隔。</p>\n<p>因为 <a href="#radiusAxis.splitNumber">splitNumber</a> 是预估的值,实际根据策略计算出来的刻度可能无法达到想要的效果,这时候可以使用 interval 配合 <a href="#radiusAxis.min">min</a>、<a href="#radiusAxis.max">max</a> 强制设定刻度划分,一般不建议使用。</p>\n<p>无法在类目轴中使用。在时间轴(<a href="#radiusAxis.type">type</a>: 'time')中需要传时间戳,在对数轴(<a href="#radiusAxis.type">type</a>: 'log')中需要传指数值。</p>\n',uiControl:{type:"number"}},logBase:{desc:'\n\n<p>对数轴的底数,只在对数轴中(<a href="#radiusAxis.type">type</a>: 'log')有效。</p>\n',uiControl:{type:"number",default:"10"}},silent:{desc:"<p>坐标轴是否是静态无法交互。</p>\n"},triggerEvent:{desc:'<p>坐标轴的标签是否响应和触发鼠标事件,默认不响应。</p>\n<p>事件参数如下:</p>\n<pre><code class="lang-js">{\n // 组件类型,xAxis, yAxis, radiusAxis, angleAxis\n // 对应组件类型都会有一个属性表示组件的 index,例如 xAxis 就是 xAxisIndex\n componentType: string,\n // 未格式化过的刻度值, 点击刻度标签有效\n value: '',\n // 坐标轴名称, 点击坐标轴名称有效\n name: ''\n}\n</code></pre>\n'},axisLine:{desc:"<p>坐标轴轴线相关设置。</p>\n"},"axisLine.show":{desc:"\n\n<p>是否显示坐标轴轴线。</p>\n",uiControl:{type:"boolean",default:"true"}},"axisLine.symbol":{desc:'\n\n<p>轴线两边的箭头。可以是字符串,表示两端使用同样的箭头;或者长度为 2 的字符串数组,分别表示两端的箭头。默认不显示箭头,即 <code class="codespan">'none'</code>。两端都显示箭头可以设置为 <code class="codespan">'arrow'</code>,只在末端显示箭头可以设置为 <code class="codespan">['none', 'arrow']</code>。</p>\n',uiControl:{type:"icon",default:"none"}},"axisLine.symbolSize":{desc:"\n\n<p>轴线两边的箭头的大小,第一个数字表示宽度(垂直坐标轴方向),第二个数字表示高度(平行坐标轴方向)。</p>\n",uiControl:{type:"vector",default:"10,15"}},"axisLine.symbolOffset":{desc:"\n\n<p>轴线两边的箭头的偏移,如果是数组,第一个数字表示起始箭头的偏移,第二个数字表示末端箭头的偏移;如果是数字,表示这两个箭头使用同样的偏移。</p>\n",uiControl:{type:"vector",default:"0,0"}},"axisLine.lineStyle.color":{desc:'\n\n<p>坐标轴线线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"axisLine.lineStyle.width":{desc:"\n\n<p>坐标轴线线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"axisLine.lineStyle.type":{desc:'\n\n<p>坐标轴线线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"axisLine.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"axisLine.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"axisLine.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisLine.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisLine.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},axisTick:{desc:"<p>坐标轴刻度相关设置。</p>\n"},"axisTick.show":{desc:"\n\n<p>是否显示坐标轴刻度。</p>\n",uiControl:{type:"boolean",default:"true"}},"axisTick.alignWithLabel":{desc:'\n\n<p>类目轴中在 <code class="codespan">boundaryGap</code> 为 <code class="codespan">true</code> 的时候有效,可以保证刻度线和标签对齐。如下图:</p>\n<p><img width="600" height="auto" src="documents/asset/img/axis-align-with-label.png"></p>\n',uiControl:{type:"boolean",default:"false"}},"axisTick.interval":{desc:'\n\n\n\n<p>坐标轴刻度的显示间隔,在类目轴中有效。默认同 <a href="#radiusAxis.axisLabel.interval">axisLabel.interval</a> 一样。</p>\n<p>默认会采用标签不重叠的策略间隔显示标签。</p>\n<p>可以设置成 0 强制显示所有标签。</p>\n<p>如果设置为 <code class="codespan">1</code>,表示『隔一个标签显示一个标签』,如果值为 <code class="codespan">2</code>,表示隔两个标签显示一个标签,以此类推。</p>\n<p>可以用数值表示间隔的数据,也可以通过回调函数控制。回调函数格式如下:</p>\n<pre><code class="lang-js">(index:number, value: string) => boolean\n</code></pre>\n<p>第一个参数是类目的 index,第二个值是类目名称,如果跳过则返回 <code class="codespan">false</code>。</p>\n',uiControl:{type:"number",min:"0",step:"1"}},"axisTick.inside":{desc:"\n\n<p>坐标轴刻度是否朝内,默认朝外。</p>\n",uiControl:{type:"boolean"}},"axisTick.length":{desc:"\n\n<p>坐标轴刻度的长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5",default:"5"}},"axisTick.lineStyle":{desc:"<p>刻度线的样式设置。</p>\n"},"axisTick.lineStyle.color":{desc:'<p>刻度线的颜色,默认取 <a href="#radiusAxis.axisTick.lineStyle.color">axisTick.lineStyle.color</a>。</p>\n'},"axisTick.lineStyle.width":{desc:"\n\n<p>坐标轴刻度线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"axisTick.lineStyle.type":{desc:'\n\n<p>坐标轴刻度线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"axisTick.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"axisTick.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"axisTick.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisTick.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisTick.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},minorTick:{desc:'<blockquote>\n<p>从 <code class="codespan">v4.6.0</code> 开始支持</p>\n</blockquote>\n<p>坐标轴次刻度线相关设置。</p>\n<p>注意:次刻度线无法在类目轴(<a href="#radiusAxis.type">type</a>: <code class="codespan">'category'</code>)中使用。</p>\n<p>示例:</p>\n<p>1) 函数绘图中使用次刻度线</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=line-function&edit=1&reset=1" width="600" height="350"><iframe />\n\n\n<p>2) 在对数轴中使用次刻度线</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=line-log&edit=1&reset=1" width="600" height="350"><iframe />\n\n'},"minorTick.show":{desc:"\n\n<p>是否显示次刻度线。</p>\n",uiControl:{type:"boolean",default:"true"}},"minorTick.splitNumber":{desc:"\n\n<p>次刻度线分割数,默认会分割成 5 段</p>\n",uiControl:{type:"number",min:"1",step:"1",default:"5"}},"minorTick.length":{desc:"\n\n<p>次刻度线的长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5",default:"3"}},"minorTick.lineStyle.color":{desc:'\n\n<p>刻度线的颜色,默认取 <a href="#radiusAxis.axisLine.lineStyle.color">axisLine.lineStyle.color</a>。</p>\n',uiControl:{type:"color"}},"minorTick.lineStyle.width":{desc:"\n\n<p>次刻度线线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"minorTick.lineStyle.type":{desc:'\n\n<p>次刻度线线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"minorTick.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"minorTick.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"minorTick.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"minorTick.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"minorTick.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},axisLabel:{desc:"<p>坐标轴刻度标签的相关设置。</p>\n"},"axisLabel.show":{desc:"\n\n<p>是否显示刻度标签。</p>\n",uiControl:{type:"boolean",default:"true"}},"axisLabel.interval":{desc:'\n\n\n\n<p>坐标轴刻度标签的显示间隔,在类目轴中有效。</p>\n<p>默认会采用标签不重叠的策略间隔显示标签。</p>\n<p>可以设置成 0 强制显示所有标签。</p>\n<p>如果设置为 <code class="codespan">1</code>,表示『隔一个标签显示一个标签』,如果值为 <code class="codespan">2</code>,表示隔两个标签显示一个标签,以此类推。</p>\n<p>可以用数值表示间隔的数据,也可以通过回调函数控制。回调函数格式如下:</p>\n<pre><code class="lang-js">(index:number, value: string) => boolean\n</code></pre>\n<p>第一个参数是类目的 index,第二个值是类目名称,如果跳过则返回 <code class="codespan">false</code>。</p>\n',uiControl:{type:"number",min:"0",step:"1"}},"axisLabel.inside":{desc:"\n\n<p>刻度标签是否朝内,默认朝外。</p>\n",uiControl:{type:"boolean"}},"axisLabel.rotate":{desc:"\n\n<p>刻度标签旋转的角度,在类目轴的类目标签显示不下的时候可以通过旋转防止标签之间重叠。</p>\n<p>旋转的角度从 -90 度到 90 度。</p>\n",uiControl:{type:"angle",min:"-90",max:"90",step:"1"}},"axisLabel.margin":{desc:"\n\n<p>刻度标签与轴线之间的距离。</p>\n",uiControl:{type:"number",default:"8",step:"0.5"}},"axisLabel.formatter":{desc:'<p>刻度标签的内容格式器,支持字符串模板和回调函数两种形式。</p>\n<p>示例:</p>\n<pre><code class="lang-js">// 使用字符串模板,模板变量为刻度默认标签 {value}\nformatter: '{value} kg'\n</code></pre>\n<p>对于时间轴(<a href="#.type">type</a>: <code class="codespan">'time'</code>),<code class="codespan">formatter</code> 的字符串模板支持多种形式:</p>\n<ul>\n<li><strong>字符串模板</strong>:简单快速实现常用日期时间模板,<code class="codespan">string</code> 类型</li>\n<li><strong>回调函数</strong>:自定义 formatter,可以用来实现复杂高级的格式,<code class="codespan">Function</code> 类型</li>\n<li><strong>分级模板</strong>:为不同时间粒度的标签使用不同的 formatter,<code class="codespan">object</code> 类型</li>\n</ul>\n<p>下面我们分别介绍这三种形式。</p>\n<p><strong> 字符串模板 </strong></p>\n<p>使用字符串模板是一种方便实现常用日期时间格式化方式的形式。如果字符串模板可以实现你的效果,那我们优先推荐使用此方式;如果无法实现,再考虑其他两种更复杂的方式。支持的模板如下:</p>\n<table>\n<thead>\n<tr>\n<th>分类</th>\n<th>模板</th>\n<th>取值(英文)</th>\n<th>取值(中文)</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>Year</td>\n<td>{yyyy}</td>\n<td>e.g., 2020, 2021, ...</td>\n<td>例:2020, 2021, ...</td>\n</tr>\n<tr>\n<td></td>\n<td>{yy}</td>\n<td>00-99</td>\n<td>00-99</td>\n</tr>\n<tr>\n<td>Quarter</td>\n<td>{Q}</td>\n<td>1, 2, 3, 4</td>\n<td>1, 2, 3, 4</td>\n</tr>\n<tr>\n<td>Month</td>\n<td>{MMMM}</td>\n<td>e.g., January, February, ...</td>\n<td>一月、二月、……</td>\n</tr>\n<tr>\n<td></td>\n<td>{MMM}</td>\n<td>e.g., Jan, Feb, ...</td>\n<td>1月、2月、……</td>\n</tr>\n<tr>\n<td></td>\n<td>{MM}</td>\n<td>01-12</td>\n<td>01-12</td>\n</tr>\n<tr>\n<td></td>\n<td>{M}</td>\n<td>1-12</td>\n<td>1-12</td>\n</tr>\n<tr>\n<td>Day of Month</td>\n<td>{dd}</td>\n<td>01-31</td>\n<td>01-31</td>\n</tr>\n<tr>\n<td></td>\n<td>{d}</td>\n<td>1-31</td>\n<td>1-31</td>\n</tr>\n<tr>\n<td>Day of Week</td>\n<td>{eeee}</td>\n<td>Sunday, Monday, Tuesday, Wednesday, Thursday, Friday, Saturday</td>\n<td>星期日、星期一、星期二、星期三、星期四、星期五、星期六</td>\n</tr>\n<tr>\n<td></td>\n<td>{ee}</td>\n<td>Sun, Mon, Tues, Wed, Thu, Fri, Sat</td>\n<td>日、一、二、三、四、五、六</td>\n</tr>\n<tr>\n<td></td>\n<td>{e}</td>\n<td>1-54</td>\n<td>1-54</td>\n</tr>\n<tr>\n<td>Hour</td>\n<td>{HH}</td>\n<td>00-23</td>\n<td>00-23</td>\n</tr>\n<tr>\n<td></td>\n<td>{H}</td>\n<td>0-23</td>\n<td>0-23</td>\n</tr>\n<tr>\n<td></td>\n<td>{hh}</td>\n<td>01-12</td>\n<td>01-12</td>\n</tr>\n<tr>\n<td></td>\n<td>{h}</td>\n<td>1-12</td>\n<td>1-12</td>\n</tr>\n<tr>\n<td>Minute</td>\n<td>{mm}</td>\n<td>00-59</td>\n<td>00-59</td>\n</tr>\n<tr>\n<td></td>\n<td>{m}</td>\n<td>0-59</td>\n<td>0-59</td>\n</tr>\n<tr>\n<td>Second</td>\n<td>{ss}</td>\n<td>00-59</td>\n<td>00-59</td>\n</tr>\n<tr>\n<td></td>\n<td>{s}</td>\n<td>0-59</td>\n<td>0-59</td>\n</tr>\n<tr>\n<td>Millisecond</td>\n<td>{SSS}</td>\n<td>000-999</td>\n<td>000-999</td>\n</tr>\n<tr>\n<td></td>\n<td>{S}</td>\n<td>0-999</td>\n<td>0-999</td>\n</tr>\n</tbody>\n</table>\n<blockquote>\n<p>其他语言请参考相应<a href="https://github.com/apache/incubator-echarts/tree/master/src/i18n" target="_blank">语言包</a>中的定义,语言包可以通过 <a href="api.html#echarts.registerLocale" target="_blank">echarts.registerLocale</a> 注册。</p>\n</blockquote>\n<p>示例:</p>\n<pre><code class="lang-js">formatter: '{yyyy}-{MM}-{dd}' // 得到的 label 形如:'2020-12-02'\nformatter: '{d}日' // 得到的 label 形如:'2日'\n</code></pre>\n<p><strong> 回调函数 </strong></p>\n<p>回调函数可以根据刻度值返回不同的格式,如果有复杂的时间格式化需求,也可以引用第三方的日期时间相关的库(如 <a href="https://momentjs.com/" target="_blank">Moment.js</a>、<a href="https://date-fns.org/" target="_blank">date-fns</a> 等),返回显示的文本。</p>\n<p>示例:</p>\n<pre><code class="lang-js">// 使用函数模板,函数参数分别为刻度数值(类目),刻度的索引\nformatter: function (value, index) {\n // 格式化成月/日,只在第一个刻度显示年份\n var date = new Date(value);\n var texts = [(date.getMonth() + 1), date.getDate()];\n if (index === 0) {\n texts.unshift(date.getYear());\n }\n return texts.join('/');\n}\n</code></pre>\n<p><strong> 分级模板 </strong></p>\n<p>有时候,我们希望对不同的时间粒度采用不同的格式化策略。例如,在季度图表中,我们可能希望对每个月的第一天显示月份,而其他日期显示日期。我们可以使用以下方式实现该效果:</p>\n<p>示例:</p>\n<pre><code class="lang-js">formatter: {\n month: '{MMMM}', // 一月、二月、……\n day: '{d}日' // 1日、2日、……\n}\n</code></pre>\n<p>支持的分级以及各自默认的取值为:</p>\n<pre><code class="lang-js">{\n year: '{yyyy}',\n month: '{MMM}',\n day: '{d}',\n hour: '{HH}:{mm}',\n minute: '{HH}:{mm}',\n second: '{HH}:{mm}:{ss}',\n millisecond: '{hh}:{mm}:{ss} {SSS}',\n none: '{yyyy}-{MM}-{dd} {hh}:{mm}:{ss} {SSS}'\n}\n</code></pre>\n<p>以 <code class="codespan">day</code> 为例,当一个刻度点的值的小时、分钟、秒、毫秒都为 <code class="codespan">0</code> 时,将采用 <code class="codespan">day</code> 的分级值作为模板。<code class="codespan">none</code> 表示当其他规则都不适用时采用的模板,也就是带有毫秒值的刻度点的模板。</p>\n<p><strong> 富文本 </strong></p>\n<p>以上这三种形式的 formatter 都支持富文本,所以可以做成一些复杂的效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">xAxis: {\n type: 'time',\n axisLabel: {\n formatter: {\n // 一年的第一个月显示年度信息和月份信息\n year: '{yearStyle|{yyyy}}\\n{monthStyle|{MMM}}',\n month: '{monthStyle|{MMM}}'\n },\n rich: {\n yearStyle: {\n // 让年度信息更醒目\n color: '#000',\n fontWeight: 'bold'\n },\n monthStyle: {\n color: '#999'\n }\n }\n }\n},\n</code></pre>\n<p>使用回调函数形式实现上面例子同样的效果:</p>\n<p>示例:</p>\n<pre><code class="lang-js">xAxis: {\n type: 'time',\n axisLabel: {\n formatter: function (value) {\n const date = new Date(value);\n const yearStart = new Date(value);\n yearStart.setMonth(0);\n yearStart.setDate(1);\n yearStart.setHours(0);\n yearStart.setMinutes(0);\n yearStart.setSeconds(0);\n yearStart.setMilliseconds(0);\n // 判断一个刻度值知否为一年的开始\n if (date.getTime() === yearStart.getTime()) {\n return '{year|' + date.getFullYear() + '}\\n'\n + '{month|' + (date.getMonth() + 1) + '月}';\n }\n else {\n return '{month|' + (date.getMonth() + 1) + '月}'\n }\n },\n rich: {\n year: {\n color: '#000',\n fontWeight: 'bold'\n },\n month: {\n color: '#999'\n }\n }\n }\n},\n</code></pre>\n'},"axisLabel.showMinLabel":{desc:'\n\n<p>是否显示最小 tick 的 label。可取值 <code class="codespan">true</code>, <code class="codespan">false</code>, <code class="codespan">null</code>。默认自动判定(即如果标签重叠,不会显示最小 tick 的 label)。</p>\n',uiControl:{type:"boolean"}},"axisLabel.showMaxLabel":{desc:'\n\n<p>是否显示最大 tick 的 label。可取值 <code class="codespan">true</code>, <code class="codespan">false</code>, <code class="codespan">null</code>。默认自动判定(即如果标签重叠,不会显示最大 tick 的 label)。</p>\n',uiControl:{type:"boolean"}},"axisLabel.color":{desc:'\n\n<p>刻度标签文字的颜色,默认取 <a href="#radiusAxis.axisLine.lineStyle.color">axisLine.lineStyle.color</a>。支持回调函数,格式如下</p>\n<pre><code class="lang-js">(val: string) => Color\n</code></pre>\n<p>参数是标签的文本,返回颜色值,如下示例:</p>\n<pre><code class="lang-js">textStyle: {\n color: function (value, index) {\n return value >= 0 ? 'green' : 'red';\n }\n}\n</code></pre>\n',uiControl:{type:"color"}},"axisLabel.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"axisLabel.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"axisLabel.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"axisLabel.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"axisLabel.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"axisLabel.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"axisLabel.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"axisLabel.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"axisLabel.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"axisLabel.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisLabel.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"axisLabel.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"axisLabel.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"axisLabel.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisLabel.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisLabel.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisLabel.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"axisLabel.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"axisLabel.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"axisLabel.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisLabel.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"axisLabel.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisLabel.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisLabel.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisLabel.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"axisLabel.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"axisLabel.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"axisLabel.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"axisLabel.rich.<style_name>.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"axisLabel.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"axisLabel.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"axisLabel.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"axisLabel.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"axisLabel.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"axisLabel.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"axisLabel.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"axisLabel.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"axisLabel.rich.<style_name>.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"axisLabel.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisLabel.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"axisLabel.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"axisLabel.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"axisLabel.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisLabel.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisLabel.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisLabel.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"axisLabel.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"axisLabel.rich.<style_name>.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"axisLabel.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisLabel.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"axisLabel.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisLabel.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisLabel.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n\n",uiControl:{type:"number",step:"0.5"}},splitLine:{desc:'<p>坐标轴在 <a href="#grid">grid</a> 区域中的分隔线。</p>\n'},"splitLine.show":{desc:"\n\n<p>是否显示分隔线。默认数值轴显示,类目轴不显示。</p>\n",uiControl:{type:"boolean",default:"true"}},"splitLine.interval":{desc:'\n\n\n\n<p>坐标轴分隔线的显示间隔,在类目轴中有效。默认同 <a href="#radiusAxis.axisLabel.interval">axisLabel.interval</a> 一样。</p>\n<p>默认会采用标签不重叠的策略间隔显示标签。</p>\n<p>可以设置成 0 强制显示所有标签。</p>\n<p>如果设置为 <code class="codespan">1</code>,表示『隔一个标签显示一个标签』,如果值为 <code class="codespan">2</code>,表示隔两个标签显示一个标签,以此类推。</p>\n<p>可以用数值表示间隔的数据,也可以通过回调函数控制。回调函数格式如下:</p>\n<pre><code class="lang-js">(index:number, value: string) => boolean\n</code></pre>\n<p>第一个参数是类目的 index,第二个值是类目名称,如果跳过则返回 <code class="codespan">false</code>。</p>\n',uiControl:{type:"number",min:"0",step:"1"}},"splitLine.lineStyle.color":{desc:"\n\n<p>分隔线颜色,可以设置成单个颜色。</p>\n<p>也可以设置成颜色数组,分隔线会按数组中颜色的顺序依次循环设置颜色。</p>\n<p>示例</p>\n<pre><code>splitLine: {\n lineStyle: {\n // 使用深浅的间隔色\n color: ['#aaa', '#ddd']\n }\n}\n</code></pre>",uiControl:{type:"color"}},"splitLine.lineStyle.width":{desc:"\n\n<p>分隔线线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"splitLine.lineStyle.type":{desc:'\n\n<p>分隔线线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"splitLine.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"splitLine.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"splitLine.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"splitLine.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"splitLine.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},minorSplitLine:{desc:'<blockquote>\n<p>从 <code class="codespan">v4.6.0</code> 开始支持</p>\n</blockquote>\n<p>坐标轴在 <a href="#grid">grid</a> 区域中的次分隔线。次分割线会对齐次刻度线 <a href="#radiusAxis.minorTick">minorTick</a></p>\n'},"minorSplitLine.show":{desc:"\n\n<p>是否显示次分隔线。默认不显示。</p>\n",uiControl:{type:"boolean",default:"true"}},"minorSplitLine.lineStyle.color":{desc:'\n\n<p>次分隔线线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"minorSplitLine.lineStyle.width":{desc:"\n\n<p>次分隔线线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"minorSplitLine.lineStyle.type":{desc:'\n\n<p>次分隔线线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"minorSplitLine.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"minorSplitLine.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"minorSplitLine.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"minorSplitLine.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"minorSplitLine.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},splitArea:{desc:'<p>坐标轴在 <a href="#grid">grid</a> 区域中的分隔区域,默认不显示。</p>\n'},"splitArea.interval":{desc:'\n\n\n\n<p>坐标轴分隔区域的显示间隔,在类目轴中有效。默认同 <a href="#radiusAxis.axisLabel.interval">axisLabel.interval</a> 一样。</p>\n<p>默认会采用标签不重叠的策略间隔显示标签。</p>\n<p>可以设置成 0 强制显示所有标签。</p>\n<p>如果设置为 <code class="codespan">1</code>,表示『隔一个标签显示一个标签』,如果值为 <code class="codespan">2</code>,表示隔两个标签显示一个标签,以此类推。</p>\n<p>可以用数值表示间隔的数据,也可以通过回调函数控制。回调函数格式如下:</p>\n<pre><code class="lang-js">(index:number, value: string) => boolean\n</code></pre>\n<p>第一个参数是类目的 index,第二个值是类目名称,如果跳过则返回 <code class="codespan">false</code>。</p>\n',uiControl:{type:"number",min:"0",step:"1"}},"splitArea.show":{desc:"\n\n<p>是否显示分隔区域。</p>\n",uiControl:{type:"boolean",default:"true"}},"splitArea.areaStyle":{desc:"<p>分隔区域的样式设置。</p>\n"},"splitArea.areaStyle.color":{desc:"<p>分隔区域颜色。分隔区域会按数组中颜色的顺序依次循环设置颜色。默认是一个深浅的间隔色。</p>\n"},"splitArea.areaStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"splitArea.areaStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"splitArea.areaStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"splitArea.areaStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"splitArea.areaStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},data:{desc:'<p>类目数据,在类目轴(<a href="#radiusAxis.type">type</a>: <code class="codespan">'category'</code>)中有效。</p>\n<p>如果没有设置 <a href="#radiusAxis.type">type</a>,但是设置了 <code class="codespan">axis.data</code>,则认为 <code class="codespan">type</code> 是 <code class="codespan">'category'</code>。</p>\n<p>如果设置了 <a href="#radiusAxis.type">type</a> 是 <code class="codespan">'category'</code>,但没有设置 <code class="codespan">axis.data</code>,则 <code class="codespan">axis.data</code> 的内容会自动从 <a href="#series.data">series.data</a> 中获取,这会比较方便。不过注意,<code class="codespan">axis.data</code> 指明的是 <code class="codespan">'category'</code> 轴的取值范围。如果不指定而是从 <a href="#series.data">series.data</a> 中获取,那么只能获取到 <a href="#series.data">series.data</a> 中出现的值。比如说,假如 <a href="#series.data">series.data</a> 为空时,就什么也获取不到。</p>\n<p>示例:</p>\n<pre><code class="lang-js">// 所有类目名称列表\ndata: ['周一', '周二', '周三', '周四', '周五', '周六', '周日']\n// 每一项也可以是具体的配置项,此时取配置项中的 `value` 为类目名\ndata: [{\n value: '周一',\n // 突出周一\n textStyle: {\n fontSize: 20,\n color: 'red'\n }\n}, '周二', '周三', '周四', '周五', '周六', '周日']\n</code></pre>\n'},"data.value":{desc:"<p>单个类目名称。</p>\n"},"data.textStyle":{desc:"<p>类目标签的文字样式。</p>\n"},"data.textStyle.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"data.textStyle.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.textStyle.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.textStyle.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.textStyle.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.textStyle.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.textStyle.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.textStyle.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.textStyle.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.textStyle.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"data.textStyle.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.textStyle.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.textStyle.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.textStyle.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.textStyle.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.textStyle.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.textStyle.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.textStyle.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"data.textStyle.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"data.textStyle.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"data.textStyle.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.textStyle.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.textStyle.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.textStyle.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.textStyle.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.textStyle.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"data.textStyle.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"data.textStyle.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"data.textStyle.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"data.textStyle.rich.<style_name>.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"data.textStyle.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.textStyle.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.textStyle.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.textStyle.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.textStyle.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.textStyle.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.textStyle.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.textStyle.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.textStyle.rich.<style_name>.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"data.textStyle.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.textStyle.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.textStyle.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.textStyle.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.textStyle.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.textStyle.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.textStyle.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.textStyle.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.textStyle.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.textStyle.rich.<style_name>.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"data.textStyle.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.textStyle.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.textStyle.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.textStyle.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.textStyle.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},axisPointer:{desc:"<p>坐标轴指示器配置项。</p>\n"},"axisPointer.show":{desc:'\n\n<p>默认不显示。但是如果 <a href="#tooltip.trigger">tooltip.trigger</a> 设置为 <code class="codespan">'axis'</code> 或者 <a href="#tooltip.axisPointer.type">tooltip.axisPointer.type</a> 设置为 <code class="codespan">'cross'</code>,则自动显示 axisPointer。坐标系会自动选择显示显示哪个轴的 axisPointer,也可以使用 <a href="#tooltip.axisPointer.axis">tooltip.axisPointer.axis</a> 改变这种选择。</p>\n',uiControl:{type:"boolean"}},"axisPointer.type":{desc:'\n\n<p>指示器类型。</p>\n<p>可选</p>\n<ul>\n<li><p><code class="codespan">'line'</code> 直线指示器</p>\n</li>\n<li><p><code class="codespan">'shadow'</code> 阴影指示器</p>\n</li>\n<li><p><code class="codespan">'none'</code> 无指示器</p>\n</li>\n</ul>\n',uiControl:{type:"enum",options:"line,shadow,none"}},"axisPointer.snap":{desc:"<p>坐标轴指示器是否自动吸附到点上。默认自动判断。</p>\n<p>这个功能在数值轴和时间轴上比较有意义,可以自动寻找细小的数值点。</p>\n"},"axisPointer.z":{desc:'<p>坐标轴指示器的 z 值。控制图形的前后顺序。<code class="codespan">z</code>值小的图形会被<code class="codespan">z</code>值大的图形覆盖。</p>\n'},"axisPointer.label":{desc:"<p>坐标轴指示器的文本标签。</p>\n"},"axisPointer.label.show":{desc:'<p>是否显示文本标签。如果 <a href="#tooltip.axisPointer.type">tooltip.axisPointer.type</a> 设置为 <code class="codespan">'cross'</code> 则默认显示标签,否则默认不显示。</p>\n'},"axisPointer.label.precision":{desc:'<p>文本标签中数值的小数点精度。默认根据当前轴的值自动判断。也可以指定如 <code class="codespan">2</code> 表示保留两位小数。</p>\n'},"axisPointer.label.formatter":{desc:'<p>文本标签文字的格式化器。</p>\n<p>如果为 <code class="codespan">string</code>,可以是例如:<code class="codespan">formatter: 'some text {value} some text</code>,其中 <code class="codespan">{value}</code> 会被自动替换为轴的值。</p>\n<p>如果为 <code class="codespan">function</code>,可以是例如:</p>\n<p><strong>参数:</strong></p>\n<p><code class="codespan">{Object}</code> params: 含有:</p>\n<p><code class="codespan">{Object}</code> params.value: 轴当前值,如果 axis.type 为 'category' 时,其值为 axis.data 里的数值。如果 axis.type 为 <code class="codespan">'time'</code>,其值为时间戳。</p>\n<p><code class="codespan">{Array.<Object>}</code> params.seriesData: 一个数组,是当前 axisPointer 最近的点的信息,每项内容为</p>\n<p><code class="codespan">{string}</code> params.axisDimension: 轴的维度名,例如直角坐标系中是 <code class="codespan">'x'</code>、<code class="codespan">'y'</code>,极坐标系中是 <code class="codespan">'radius'</code>、<code class="codespan">'angle'</code>。</p>\n<p><code class="codespan">{number}</code> params.axisIndex: 轴的 index,<code class="codespan">0</code>、<code class="codespan">1</code>、<code class="codespan">2</code>、...</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n<p>每项内容还包括轴的信息:</p>\n<pre><code class="lang-js">{\n axisDim: 'x', // 'x', 'y', 'angle', 'radius', 'single'\n axisId: 'xxx',\n axisName: 'xxx',\n axisIndex: 3,\n axisValue: 121, // 当前 axisPointer 对应的 value。\n axisValueLabel: '文本'\n}\n</code></pre>\n<p><strong>返回值:</strong></p>\n<p>显示的 string。</p>\n<p>例如:</p>\n<pre><code class="lang-js">formatter: function (params) {\n // 假设此轴的 type 为 'time'。\n return 'some text' + echarts.format.formatTime(params.value);\n}\n</code></pre>\n'},"axisPointer.label.margin":{desc:"<p>label 距离轴的距离。</p>\n"},"axisPointer.label.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"'#fff'"}},"axisPointer.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"axisPointer.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"axisPointer.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"axisPointer.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"axisPointer.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"axisPointer.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"axisPointer.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"axisPointer.label.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"axisPointer.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisPointer.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"axisPointer.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisPointer.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisPointer.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisPointer.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"axisPointer.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"axisPointer.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"axisPointer.label.padding":{desc:'\n\n<p>axisPointer内边距,单位px,默认各方向内边距为5,接受数组分别设定上右下左边距。</p>\n<p>使用示例:</p>\n<pre><code class="lang-js">// 设置内边距为 5\npadding: 5\n// 设置上下的内边距为 5,左右的内边距为 10\npadding: [5, 10]\n// 分别设置四个方向的内边距\npadding: [\n 5, // 上\n 10, // 右\n 5, // 下\n 10, // 左\n]\n</code></pre>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"axisPointer.label.backgroundColor":{desc:'<p>文本标签的背景颜色,默认是和 <a href="#xAxis.axisLine.lineStyle.color">axis.axisLine.lineStyle.color</a> 相同。</p>\n'},"axisPointer.label.borderColor":{desc:"<p>文本标签的边框颜色。</p>\n"},"axisPointer.label.borderWidth":{desc:"<p>文本标签的边框宽度。</p>\n"},"axisPointer.label.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"3",min:"0",step:"0.5"}},"axisPointer.label.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:"#aaa"}},"axisPointer.label.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisPointer.label.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisPointer.lineStyle":{desc:'<p><a href="#tooltip.axisPointer.type">axisPointer.type</a> 为 <code class="codespan">'line'</code> 时有效。</p>\n'},"axisPointer.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"axisPointer.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"axisPointer.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"axisPointer.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"axisPointer.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"axisPointer.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisPointer.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisPointer.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"axisPointer.shadowStyle":{desc:'<p><a href="#tooltip.axisPointer.type">axisPointer.type</a> 为 <code class="codespan">'shadow'</code> 时有效。</p>\n'},"axisPointer.shadowStyle.color":{desc:'\n\n<p>填充的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"axisPointer.shadowStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"axisPointer.shadowStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"axisPointer.shadowStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisPointer.shadowStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisPointer.shadowStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"axisPointer.triggerTooltip":{desc:"\n\n<p>是否触发 tooltip。如果不想触发 tooltip 可以关掉。</p>\n",uiControl:{type:"boolean",default:"true"}},"axisPointer.value":{desc:'<p>当前的 value。在使用 <a href="xAxisPointer.handle" target="_blank">axisPointer.handle</a> 时,可以设置此值进行初始值设定,从而决定 axisPointer 的初始位置。</p>\n'},"axisPointer.status":{desc:'\n\n<p>当前的状态,可取值为 <code class="codespan">'show'</code> 和 <code class="codespan">'hide'</code>。</p>\n',uiControl:{type:"enum",options:"show,hide"}},"axisPointer.handle":{desc:'<p>拖拽手柄,适用于触屏的环境。参见 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=line-tooltip-touch&edit=1&reset=1" target="_blank">例子</a>。</p>\n'},"axisPointer.handle.show":{desc:'\n\n<p>当 show 设为 <code class="codespan">true</code> 时开启,这时显示手柄,并且 axisPointer 会一直显示。</p>\n',uiControl:{type:"boolean"}},"axisPointer.handle.icon":{desc:'\n\n<p>手柄的图标。</p>\n<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre><p>参见 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/axisPointer-handle-image&edit=1&reset=1" target="_blank">使用图片的例子</a></p>\n',uiControl:{type:"icon",clean:"true"}},"axisPointer.handle.size":{desc:'\n\n<p>手柄的尺寸,可以设置单值,如 <code class="codespan">45</code>,也可以设置为数组:<code class="codespan">[width, height]</code>。</p>\n',uiControl:{type:"vector",default:"45,45",min:"0",step:"0.5",dims:"width,height"}},"axisPointer.handle.margin":{desc:"\n\n<p>手柄与轴的距离。注意,这是手柄中心点和轴的距离。</p>\n",uiControl:{type:"number",default:"50",min:"0",step:"0.5"}},"axisPointer.handle.color":{desc:"\n\n<p>手柄颜色。</p>\n",uiControl:{type:"color"}},"axisPointer.handle.throttle":{desc:"\n\n<p>手柄拖拽时触发视图更新周期,单位毫秒,调大这个数值可以改善性能,但是降低体验。</p>\n",uiControl:{type:"number",default:"40",min:"0",step:"10"}},"axisPointer.handle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"3",min:"0",step:"0.5"}},"axisPointer.handle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:"#aaa"}},"axisPointer.handle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"2",step:"0.5"}},"axisPointer.handle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},zlevel:{desc:'<p>半径轴所有图形的 zlevel 值。</p>\n<p><code class="codespan">zlevel</code>用于 Canvas 分层,不同<code class="codespan">zlevel</code>值的图形会放置在不同的 Canvas 中,Canvas 分层是一种常见的优化手段。我们可以把一些图形变化频繁(例如有动画)的组件设置成一个单独的<code class="codespan">zlevel</code>。需要注意的是过多的 Canvas 会引起内存开销的增大,在手机端上需要谨慎使用以防崩溃。</p>\n<p><code class="codespan">zlevel</code> 大的 Canvas 会放在 <code class="codespan">zlevel</code> 小的 Canvas 的上面。</p>\n'},z:{desc:'<p>半径轴组件的所有图形的<code class="codespan">z</code>值。控制图形的前后顺序。<code class="codespan">z</code>值小的图形会被<code class="codespan">z</code>值大的图形覆盖。</p>\n<p><code class="codespan">z</code>相比<code class="codespan">zlevel</code>优先级更低,而且不会创建新的 Canvas。</p>\n'}})},{title:"角度轴",body:(0,a.buildOptions)("angleAxis.",{id:{desc:"<p>组件 ID。默认不指定。指定则可用于在 option 或者 API 中引用组件。</p>\n"},polarIndex:{desc:"<p>角度轴所在的极坐标系的索引,默认使用第一个极坐标系。</p>\n"},startAngle:{desc:'\n\n<p>起始刻度的角度,默认为 90 度,即圆心的正上方。0 度为圆心的正右方。</p>\n<p>如下示例是 startAngle 为 45 的效果:</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/polar-start-angle&edit=1&reset=1" width="400" height="400"><iframe />\n\n',uiControl:{type:"angle",default:"90",min:"-360",max:"360",step:"1"}},clockwise:{desc:'\n\n<p>刻度增长是否按顺时针,默认顺时针。</p>\n<p>如下示例是 clockwise 为 <code class="codespan">false</code> (逆时针)的效果:</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/polar-anticlockwise&edit=1&reset=1" width="400" height="400"><iframe />\n\n\n\n',uiControl:{type:"boolean",default:"true"}},type:{desc:'<p>坐标轴类型。</p>\n<p>可选:</p>\n<ul>\n<li><p><code class="codespan">'value'</code>\n 数值轴,适用于连续数据。</p>\n</li>\n<li><p><code class="codespan">'category'</code>\n 类目轴,适用于离散的类目数据。为该类型时类目数据可自动从 <a href="#series.data">series.data</a> 或 <a href="#dataset.source">dataset.source</a> 中取,或者可通过 <a href="#angleAxis.data">angleAxis.data</a> 设置类目数据。</p>\n</li>\n<li><p><code class="codespan">'time'</code>\n 时间轴,适用于连续的时序数据,与数值轴相比时间轴带有时间的格式化,在刻度计算上也有所不同,例如会根据跨度的范围来决定使用月,星期,日还是小时范围的刻度。</p>\n</li>\n<li><p><code class="codespan">'log'</code>\n 对数轴。适用于对数数据。</p>\n</li>\n</ul>\n'},boundaryGap:{desc:'\n\n<p>坐标轴两边留白策略,类目轴和非类目轴的设置和表现不一样。</p>\n<p>类目轴中 <code class="codespan">boundaryGap</code> 可以配置为 <code class="codespan">true</code> 和 <code class="codespan">false</code>。默认为 <code class="codespan">true</code>,这时候<a href="#angleAxis.axisTick">刻度</a>只是作为分隔线,标签和数据点都会在两个<a href="#angleAxis.axisTick">刻度</a>之间的带(band)中间。</p>\n<p>非类目轴,包括时间,数值,对数轴,<code class="codespan">boundaryGap</code>是一个两个值的数组,分别表示数据最小值和最大值的延伸范围,可以直接设置数值或者相对的百分比,在设置 <a href="#angleAxis.min">min</a> 和 <a href="#angleAxis.max">max</a> 后无效。\n<strong>示例:</strong></p>\n<pre><code class="lang-js">boundaryGap: ['20%', '20%']\n</code></pre>\n',uiControl:{type:"boolean"}},min:{desc:'\n\n<p>坐标轴刻度最小值。</p>\n<p>可以设置成特殊值 <code class="codespan">'dataMin'</code>,此时取数据在该轴上的最小值作为最小刻度。</p>\n<p>不设置时会自动计算最小值保证坐标轴刻度的均匀分布。</p>\n<p>在类目轴中,也可以设置为类目的序数(如类目轴 <code class="codespan">data: ['类A', '类B', '类C']</code> 中,序数 <code class="codespan">2</code> 表示 <code class="codespan">'类C'</code>。也可以设置为负数,如 <code class="codespan">-3</code>)。</p>\n<p>当设置成 <code class="codespan">function</code> 形式时,可以根据计算得出的数据最大最小值设定坐标轴的最小值。如:</p>\n<pre><code class="lang-js">min: function (value) {\n return value.min - 20;\n}\n</code></pre>\n<p>其中 <code class="codespan">value</code> 是一个包含 <code class="codespan">min</code> 和 <code class="codespan">max</code> 的对象,分别表示数据的最大最小值,这个函数可返回坐标轴的最小值,也可返回 <code class="codespan">null</code>/<code class="codespan">undefined</code> 来表示“自动计算最小值”(返回 <code class="codespan">null</code>/<code class="codespan">undefined</code> 从 <code class="codespan">v4.8.0</code> 开始支持)。</p>\n',uiControl:{type:"number"}},max:{desc:'\n\n<p>坐标轴刻度最大值。</p>\n<p>可以设置成特殊值 <code class="codespan">'dataMax'</code>,此时取数据在该轴上的最大值作为最大刻度。</p>\n<p>不设置时会自动计算最大值保证坐标轴刻度的均匀分布。</p>\n<p>在类目轴中,也可以设置为类目的序数(如类目轴 <code class="codespan">data: ['类A', '类B', '类C']</code> 中,序数 <code class="codespan">2</code> 表示 <code class="codespan">'类C'</code>。也可以设置为负数,如 <code class="codespan">-3</code>)。</p>\n<p>当设置成 <code class="codespan">function</code> 形式时,可以根据计算得出的数据最大最小值设定坐标轴的最小值。如:</p>\n<pre><code class="lang-js">max: function (value) {\n return value.max - 20;\n}\n</code></pre>\n<p>其中 <code class="codespan">value</code> 是一个包含 <code class="codespan">min</code> 和 <code class="codespan">max</code> 的对象,分别表示数据的最大最小值,这个函数可返回坐标轴的最大值,也可返回 <code class="codespan">null</code>/<code class="codespan">undefined</code> 来表示“自动计算最大值”(返回 <code class="codespan">null</code>/<code class="codespan">undefined</code> 从 <code class="codespan">v4.8.0</code> 开始支持)。</p>\n',uiControl:{type:"number"}},scale:{desc:'\n\n<p>只在数值轴中(<a href="#angleAxis.type">type</a>: 'value')有效。</p>\n<p>是否是脱离 0 值比例。设置成 <code class="codespan">true</code> 后坐标刻度不会强制包含零刻度。在双数值轴的散点图中比较有用。</p>\n<p>在设置 <a href="#angleAxis.min">min</a> 和 <a href="#angleAxis.max">max</a> 之后该配置项无效。</p>\n',uiControl:{type:"boolean"}},splitNumber:{desc:"\n\n<p>坐标轴的分割段数,需要注意的是这个分割段数只是个预估值,最后实际显示的段数会在这个基础上根据分割后坐标轴刻度显示的易读程度作调整。</p>\n<p>在类目轴中无效。</p>\n",uiControl:{type:"number",min:"1",step:"1",default:"5"}},minInterval:{desc:'\n\n<p>自动计算的坐标轴最小间隔大小。</p>\n<p>例如可以设置成<code class="codespan">1</code>保证坐标轴分割刻度显示成整数。</p>\n<pre><code class="lang-js">{\n minInterval: 1\n}\n</code></pre>\n<p>只在数值轴或时间轴中(<a href="#angleAxis.type">type</a>: 'value' 或 'time')有效。</p>\n',uiControl:{type:"number"}},maxInterval:{desc:'\n\n<p>自动计算的坐标轴最大间隔大小。</p>\n<p>例如,在时间轴((<a href="#angleAxis.type">type</a>: 'time'))可以设置成 <code class="codespan">3600 * 24 * 1000</code> 保证坐标轴分割刻度最大为一天。</p>\n<pre><code class="lang-js">{\n maxInterval: 3600 * 24 * 1000\n}\n</code></pre>\n<p>只在数值轴或时间轴中(<a href="#angleAxis.type">type</a>: 'value' 或 'time')有效。</p>\n',uiControl:{type:"number"}},interval:{desc:'\n\n<p>强制设置坐标轴分割间隔。</p>\n<p>因为 <a href="#angleAxis.splitNumber">splitNumber</a> 是预估的值,实际根据策略计算出来的刻度可能无法达到想要的效果,这时候可以使用 interval 配合 <a href="#angleAxis.min">min</a>、<a href="#angleAxis.max">max</a> 强制设定刻度划分,一般不建议使用。</p>\n<p>无法在类目轴中使用。在时间轴(<a href="#angleAxis.type">type</a>: 'time')中需要传时间戳,在对数轴(<a href="#angleAxis.type">type</a>: 'log')中需要传指数值。</p>\n',uiControl:{type:"number"}},logBase:{desc:'\n\n<p>对数轴的底数,只在对数轴中(<a href="#angleAxis.type">type</a>: 'log')有效。</p>\n',uiControl:{type:"number",default:"10"}},silent:{desc:"<p>坐标轴是否是静态无法交互。</p>\n"},triggerEvent:{desc:'<p>坐标轴的标签是否响应和触发鼠标事件,默认不响应。</p>\n<p>事件参数如下:</p>\n<pre><code class="lang-js">{\n // 组件类型,xAxis, yAxis, radiusAxis, angleAxis\n // 对应组件类型都会有一个属性表示组件的 index,例如 xAxis 就是 xAxisIndex\n componentType: string,\n // 未格式化过的刻度值, 点击刻度标签有效\n value: '',\n // 坐标轴名称, 点击坐标轴名称有效\n name: ''\n}\n</code></pre>\n'},axisLine:{desc:"<p>坐标轴轴线相关设置。</p>\n"},"axisLine.show":{desc:"\n\n<p>是否显示坐标轴轴线。</p>\n",uiControl:{type:"boolean",default:"true"}},"axisLine.symbol":{desc:'\n\n<p>轴线两边的箭头。可以是字符串,表示两端使用同样的箭头;或者长度为 2 的字符串数组,分别表示两端的箭头。默认不显示箭头,即 <code class="codespan">'none'</code>。两端都显示箭头可以设置为 <code class="codespan">'arrow'</code>,只在末端显示箭头可以设置为 <code class="codespan">['none', 'arrow']</code>。</p>\n',uiControl:{type:"icon",default:"none"}},"axisLine.symbolSize":{desc:"\n\n<p>轴线两边的箭头的大小,第一个数字表示宽度(垂直坐标轴方向),第二个数字表示高度(平行坐标轴方向)。</p>\n",uiControl:{type:"vector",default:"10,15"}},"axisLine.symbolOffset":{desc:"\n\n<p>轴线两边的箭头的偏移,如果是数组,第一个数字表示起始箭头的偏移,第二个数字表示末端箭头的偏移;如果是数字,表示这两个箭头使用同样的偏移。</p>\n",uiControl:{type:"vector",default:"0,0"}},"axisLine.lineStyle.color":{desc:'\n\n<p>坐标轴线线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"axisLine.lineStyle.width":{desc:"\n\n<p>坐标轴线线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"axisLine.lineStyle.type":{desc:'\n\n<p>坐标轴线线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"axisLine.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"axisLine.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"axisLine.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisLine.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisLine.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},axisTick:{desc:"<p>坐标轴刻度相关设置。</p>\n"},"axisTick.show":{desc:"\n\n<p>是否显示坐标轴刻度。</p>\n",uiControl:{type:"boolean",default:"true"}},"axisTick.alignWithLabel":{desc:'\n\n<p>类目轴中在 <code class="codespan">boundaryGap</code> 为 <code class="codespan">true</code> 的时候有效,可以保证刻度线和标签对齐。如下图:</p>\n<p><img width="600" height="auto" src="documents/asset/img/axis-align-with-label.png"></p>\n',uiControl:{type:"boolean",default:"false"}},"axisTick.interval":{desc:'\n\n\n\n<p>坐标轴刻度的显示间隔,在类目轴中有效。默认同 <a href="#angleAxis.axisLabel.interval">axisLabel.interval</a> 一样。</p>\n<p>默认会采用标签不重叠的策略间隔显示标签。</p>\n<p>可以设置成 0 强制显示所有标签。</p>\n<p>如果设置为 <code class="codespan">1</code>,表示『隔一个标签显示一个标签』,如果值为 <code class="codespan">2</code>,表示隔两个标签显示一个标签,以此类推。</p>\n<p>可以用数值表示间隔的数据,也可以通过回调函数控制。回调函数格式如下:</p>\n<pre><code class="lang-js">(index:number, value: string) => boolean\n</code></pre>\n<p>第一个参数是类目的 index,第二个值是类目名称,如果跳过则返回 <code class="codespan">false</code>。</p>\n',uiControl:{type:"number",min:"0",step:"1"}},"axisTick.inside":{desc:"\n\n<p>坐标轴刻度是否朝内,默认朝外。</p>\n",uiControl:{type:"boolean"}},"axisTick.length":{desc:"\n\n<p>坐标轴刻度的长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5",default:"5"}},"axisTick.lineStyle":{desc:"<p>刻度线的样式设置。</p>\n"},"axisTick.lineStyle.color":{desc:'<p>刻度线的颜色,默认取 <a href="#angleAxis.axisTick.lineStyle.color">axisTick.lineStyle.color</a>。</p>\n'},"axisTick.lineStyle.width":{desc:"\n\n<p>坐标轴刻度线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"axisTick.lineStyle.type":{desc:'\n\n<p>坐标轴刻度线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"axisTick.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"axisTick.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"axisTick.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisTick.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisTick.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},minorTick:{desc:'<blockquote>\n<p>从 <code class="codespan">v4.6.0</code> 开始支持</p>\n</blockquote>\n<p>坐标轴次刻度线相关设置。</p>\n<p>注意:次刻度线无法在类目轴(<a href="#angleAxis.type">type</a>: <code class="codespan">'category'</code>)中使用。</p>\n<p>示例:</p>\n<p>1) 函数绘图中使用次刻度线</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=line-function&edit=1&reset=1" width="600" height="350"><iframe />\n\n\n<p>2) 在对数轴中使用次刻度线</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=line-log&edit=1&reset=1" width="600" height="350"><iframe />\n\n'},"minorTick.show":{desc:"\n\n<p>是否显示次刻度线。</p>\n",uiControl:{type:"boolean",default:"true"}},"minorTick.splitNumber":{desc:"\n\n<p>次刻度线分割数,默认会分割成 5 段</p>\n",uiControl:{type:"number",min:"1",step:"1",default:"5"}},"minorTick.length":{desc:"\n\n<p>次刻度线的长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5",default:"3"}},"minorTick.lineStyle.color":{desc:'\n\n<p>刻度线的颜色,默认取 <a href="#angleAxis.axisLine.lineStyle.color">axisLine.lineStyle.color</a>。</p>\n',uiControl:{type:"color"}},"minorTick.lineStyle.width":{desc:"\n\n<p>次刻度线线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"minorTick.lineStyle.type":{desc:'\n\n<p>次刻度线线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"minorTick.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"minorTick.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"minorTick.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"minorTick.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"minorTick.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},axisLabel:{desc:"<p>坐标轴刻度标签的相关设置。</p>\n"},"axisLabel.show":{desc:"\n\n<p>是否显示刻度标签。</p>\n",uiControl:{type:"boolean",default:"true"}},"axisLabel.interval":{desc:'\n\n\n\n<p>坐标轴刻度标签的显示间隔,在类目轴中有效。</p>\n<p>默认会采用标签不重叠的策略间隔显示标签。</p>\n<p>可以设置成 0 强制显示所有标签。</p>\n<p>如果设置为 <code class="codespan">1</code>,表示『隔一个标签显示一个标签』,如果值为 <code class="codespan">2</code>,表示隔两个标签显示一个标签,以此类推。</p>\n<p>可以用数值表示间隔的数据,也可以通过回调函数控制。回调函数格式如下:</p>\n<pre><code class="lang-js">(index:number, value: string) => boolean\n</code></pre>\n<p>第一个参数是类目的 index,第二个值是类目名称,如果跳过则返回 <code class="codespan">false</code>。</p>\n',uiControl:{type:"number",min:"0",step:"1"}},"axisLabel.inside":{desc:"\n\n<p>刻度标签是否朝内,默认朝外。</p>\n",uiControl:{type:"boolean"}},"axisLabel.margin":{desc:"\n\n<p>刻度标签与轴线之间的距离。</p>\n",uiControl:{type:"number",default:"8",step:"0.5"}},"axisLabel.formatter":{desc:'<p>刻度标签的内容格式器,支持字符串模板和回调函数两种形式。</p>\n<p>示例:</p>\n<pre><code class="lang-js">// 使用字符串模板,模板变量为刻度默认标签 {value}\nformatter: '{value} kg'\n</code></pre>\n<p>对于时间轴(<a href="#.type">type</a>: <code class="codespan">'time'</code>),<code class="codespan">formatter</code> 的字符串模板支持多种形式:</p>\n<ul>\n<li><strong>字符串模板</strong>:简单快速实现常用日期时间模板,<code class="codespan">string</code> 类型</li>\n<li><strong>回调函数</strong>:自定义 formatter,可以用来实现复杂高级的格式,<code class="codespan">Function</code> 类型</li>\n<li><strong>分级模板</strong>:为不同时间粒度的标签使用不同的 formatter,<code class="codespan">object</code> 类型</li>\n</ul>\n<p>下面我们分别介绍这三种形式。</p>\n<p><strong> 字符串模板 </strong></p>\n<p>使用字符串模板是一种方便实现常用日期时间格式化方式的形式。如果字符串模板可以实现你的效果,那我们优先推荐使用此方式;如果无法实现,再考虑其他两种更复杂的方式。支持的模板如下:</p>\n<table>\n<thead>\n<tr>\n<th>分类</th>\n<th>模板</th>\n<th>取值(英文)</th>\n<th>取值(中文)</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>Year</td>\n<td>{yyyy}</td>\n<td>e.g., 2020, 2021, ...</td>\n<td>例:2020, 2021, ...</td>\n</tr>\n<tr>\n<td></td>\n<td>{yy}</td>\n<td>00-99</td>\n<td>00-99</td>\n</tr>\n<tr>\n<td>Quarter</td>\n<td>{Q}</td>\n<td>1, 2, 3, 4</td>\n<td>1, 2, 3, 4</td>\n</tr>\n<tr>\n<td>Month</td>\n<td>{MMMM}</td>\n<td>e.g., January, February, ...</td>\n<td>一月、二月、……</td>\n</tr>\n<tr>\n<td></td>\n<td>{MMM}</td>\n<td>e.g., Jan, Feb, ...</td>\n<td>1月、2月、……</td>\n</tr>\n<tr>\n<td></td>\n<td>{MM}</td>\n<td>01-12</td>\n<td>01-12</td>\n</tr>\n<tr>\n<td></td>\n<td>{M}</td>\n<td>1-12</td>\n<td>1-12</td>\n</tr>\n<tr>\n<td>Day of Month</td>\n<td>{dd}</td>\n<td>01-31</td>\n<td>01-31</td>\n</tr>\n<tr>\n<td></td>\n<td>{d}</td>\n<td>1-31</td>\n<td>1-31</td>\n</tr>\n<tr>\n<td>Day of Week</td>\n<td>{eeee}</td>\n<td>Sunday, Monday, Tuesday, Wednesday, Thursday, Friday, Saturday</td>\n<td>星期日、星期一、星期二、星期三、星期四、星期五、星期六</td>\n</tr>\n<tr>\n<td></td>\n<td>{ee}</td>\n<td>Sun, Mon, Tues, Wed, Thu, Fri, Sat</td>\n<td>日、一、二、三、四、五、六</td>\n</tr>\n<tr>\n<td></td>\n<td>{e}</td>\n<td>1-54</td>\n<td>1-54</td>\n</tr>\n<tr>\n<td>Hour</td>\n<td>{HH}</td>\n<td>00-23</td>\n<td>00-23</td>\n</tr>\n<tr>\n<td></td>\n<td>{H}</td>\n<td>0-23</td>\n<td>0-23</td>\n</tr>\n<tr>\n<td></td>\n<td>{hh}</td>\n<td>01-12</td>\n<td>01-12</td>\n</tr>\n<tr>\n<td></td>\n<td>{h}</td>\n<td>1-12</td>\n<td>1-12</td>\n</tr>\n<tr>\n<td>Minute</td>\n<td>{mm}</td>\n<td>00-59</td>\n<td>00-59</td>\n</tr>\n<tr>\n<td></td>\n<td>{m}</td>\n<td>0-59</td>\n<td>0-59</td>\n</tr>\n<tr>\n<td>Second</td>\n<td>{ss}</td>\n<td>00-59</td>\n<td>00-59</td>\n</tr>\n<tr>\n<td></td>\n<td>{s}</td>\n<td>0-59</td>\n<td>0-59</td>\n</tr>\n<tr>\n<td>Millisecond</td>\n<td>{SSS}</td>\n<td>000-999</td>\n<td>000-999</td>\n</tr>\n<tr>\n<td></td>\n<td>{S}</td>\n<td>0-999</td>\n<td>0-999</td>\n</tr>\n</tbody>\n</table>\n<blockquote>\n<p>其他语言请参考相应<a href="https://github.com/apache/incubator-echarts/tree/master/src/i18n" target="_blank">语言包</a>中的定义,语言包可以通过 <a href="api.html#echarts.registerLocale" target="_blank">echarts.registerLocale</a> 注册。</p>\n</blockquote>\n<p>示例:</p>\n<pre><code class="lang-js">formatter: '{yyyy}-{MM}-{dd}' // 得到的 label 形如:'2020-12-02'\nformatter: '{d}日' // 得到的 label 形如:'2日'\n</code></pre>\n<p><strong> 回调函数 </strong></p>\n<p>回调函数可以根据刻度值返回不同的格式,如果有复杂的时间格式化需求,也可以引用第三方的日期时间相关的库(如 <a href="https://momentjs.com/" target="_blank">Moment.js</a>、<a href="https://date-fns.org/" target="_blank">date-fns</a> 等),返回显示的文本。</p>\n<p>示例:</p>\n<pre><code class="lang-js">// 使用函数模板,函数参数分别为刻度数值(类目),刻度的索引\nformatter: function (value, index) {\n // 格式化成月/日,只在第一个刻度显示年份\n var date = new Date(value);\n var texts = [(date.getMonth() + 1), date.getDate()];\n if (index === 0) {\n texts.unshift(date.getYear());\n }\n return texts.join('/');\n}\n</code></pre>\n<p><strong> 分级模板 </strong></p>\n<p>有时候,我们希望对不同的时间粒度采用不同的格式化策略。例如,在季度图表中,我们可能希望对每个月的第一天显示月份,而其他日期显示日期。我们可以使用以下方式实现该效果:</p>\n<p>示例:</p>\n<pre><code class="lang-js">formatter: {\n month: '{MMMM}', // 一月、二月、……\n day: '{d}日' // 1日、2日、……\n}\n</code></pre>\n<p>支持的分级以及各自默认的取值为:</p>\n<pre><code class="lang-js">{\n year: '{yyyy}',\n month: '{MMM}',\n day: '{d}',\n hour: '{HH}:{mm}',\n minute: '{HH}:{mm}',\n second: '{HH}:{mm}:{ss}',\n millisecond: '{hh}:{mm}:{ss} {SSS}',\n none: '{yyyy}-{MM}-{dd} {hh}:{mm}:{ss} {SSS}'\n}\n</code></pre>\n<p>以 <code class="codespan">day</code> 为例,当一个刻度点的值的小时、分钟、秒、毫秒都为 <code class="codespan">0</code> 时,将采用 <code class="codespan">day</code> 的分级值作为模板。<code class="codespan">none</code> 表示当其他规则都不适用时采用的模板,也就是带有毫秒值的刻度点的模板。</p>\n<p><strong> 富文本 </strong></p>\n<p>以上这三种形式的 formatter 都支持富文本,所以可以做成一些复杂的效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">xAxis: {\n type: 'time',\n axisLabel: {\n formatter: {\n // 一年的第一个月显示年度信息和月份信息\n year: '{yearStyle|{yyyy}}\\n{monthStyle|{MMM}}',\n month: '{monthStyle|{MMM}}'\n },\n rich: {\n yearStyle: {\n // 让年度信息更醒目\n color: '#000',\n fontWeight: 'bold'\n },\n monthStyle: {\n color: '#999'\n }\n }\n }\n},\n</code></pre>\n<p>使用回调函数形式实现上面例子同样的效果:</p>\n<p>示例:</p>\n<pre><code class="lang-js">xAxis: {\n type: 'time',\n axisLabel: {\n formatter: function (value) {\n const date = new Date(value);\n const yearStart = new Date(value);\n yearStart.setMonth(0);\n yearStart.setDate(1);\n yearStart.setHours(0);\n yearStart.setMinutes(0);\n yearStart.setSeconds(0);\n yearStart.setMilliseconds(0);\n // 判断一个刻度值知否为一年的开始\n if (date.getTime() === yearStart.getTime()) {\n return '{year|' + date.getFullYear() + '}\\n'\n + '{month|' + (date.getMonth() + 1) + '月}';\n }\n else {\n return '{month|' + (date.getMonth() + 1) + '月}'\n }\n },\n rich: {\n year: {\n color: '#000',\n fontWeight: 'bold'\n },\n month: {\n color: '#999'\n }\n }\n }\n},\n</code></pre>\n'},"axisLabel.showMinLabel":{desc:'\n\n<p>是否显示最小 tick 的 label。可取值 <code class="codespan">true</code>, <code class="codespan">false</code>, <code class="codespan">null</code>。默认自动判定(即如果标签重叠,不会显示最小 tick 的 label)。</p>\n',uiControl:{type:"boolean"}},"axisLabel.showMaxLabel":{desc:'\n\n<p>是否显示最大 tick 的 label。可取值 <code class="codespan">true</code>, <code class="codespan">false</code>, <code class="codespan">null</code>。默认自动判定(即如果标签重叠,不会显示最大 tick 的 label)。</p>\n',uiControl:{type:"boolean"}},"axisLabel.color":{desc:'\n\n<p>刻度标签文字的颜色,默认取 <a href="#angleAxis.axisLine.lineStyle.color">axisLine.lineStyle.color</a>。支持回调函数,格式如下</p>\n<pre><code class="lang-js">(val: string) => Color\n</code></pre>\n<p>参数是标签的文本,返回颜色值,如下示例:</p>\n<pre><code class="lang-js">textStyle: {\n color: function (value, index) {\n return value >= 0 ? 'green' : 'red';\n }\n}\n</code></pre>\n',uiControl:{type:"color"}},"axisLabel.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"axisLabel.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"axisLabel.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"axisLabel.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"axisLabel.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"axisLabel.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"axisLabel.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"axisLabel.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"axisLabel.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"axisLabel.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisLabel.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"axisLabel.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"axisLabel.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"axisLabel.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisLabel.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisLabel.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisLabel.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"axisLabel.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"axisLabel.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"axisLabel.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisLabel.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"axisLabel.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisLabel.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisLabel.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisLabel.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"axisLabel.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"axisLabel.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"axisLabel.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"axisLabel.rich.<style_name>.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"axisLabel.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"axisLabel.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"axisLabel.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"axisLabel.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"axisLabel.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"axisLabel.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"axisLabel.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"axisLabel.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"axisLabel.rich.<style_name>.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"axisLabel.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisLabel.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"axisLabel.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"axisLabel.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"axisLabel.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisLabel.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisLabel.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisLabel.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"axisLabel.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"axisLabel.rich.<style_name>.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"axisLabel.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisLabel.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"axisLabel.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisLabel.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisLabel.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n\n",uiControl:{type:"number",step:"0.5"}},splitLine:{desc:'<p>坐标轴在 <a href="#grid">grid</a> 区域中的分隔线。</p>\n'},"splitLine.show":{desc:"\n\n<p>是否显示分隔线。默认数值轴显示,类目轴不显示。</p>\n",uiControl:{type:"boolean",default:"true"}},"splitLine.interval":{desc:'\n\n\n\n<p>坐标轴分隔线的显示间隔,在类目轴中有效。默认同 <a href="#angleAxis.axisLabel.interval">axisLabel.interval</a> 一样。</p>\n<p>默认会采用标签不重叠的策略间隔显示标签。</p>\n<p>可以设置成 0 强制显示所有标签。</p>\n<p>如果设置为 <code class="codespan">1</code>,表示『隔一个标签显示一个标签』,如果值为 <code class="codespan">2</code>,表示隔两个标签显示一个标签,以此类推。</p>\n<p>可以用数值表示间隔的数据,也可以通过回调函数控制。回调函数格式如下:</p>\n<pre><code class="lang-js">(index:number, value: string) => boolean\n</code></pre>\n<p>第一个参数是类目的 index,第二个值是类目名称,如果跳过则返回 <code class="codespan">false</code>。</p>\n',uiControl:{type:"number",min:"0",step:"1"}},"splitLine.lineStyle.color":{desc:"\n\n<p>分隔线颜色,可以设置成单个颜色。</p>\n<p>也可以设置成颜色数组,分隔线会按数组中颜色的顺序依次循环设置颜色。</p>\n<p>示例</p>\n<pre><code>splitLine: {\n lineStyle: {\n // 使用深浅的间隔色\n color: ['#aaa', '#ddd']\n }\n}\n</code></pre>",uiControl:{type:"color"}},"splitLine.lineStyle.width":{desc:"\n\n<p>分隔线线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"splitLine.lineStyle.type":{desc:'\n\n<p>分隔线线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"splitLine.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"splitLine.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"splitLine.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"splitLine.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"splitLine.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},minorSplitLine:{desc:'<blockquote>\n<p>从 <code class="codespan">v4.6.0</code> 开始支持</p>\n</blockquote>\n<p>坐标轴在 <a href="#grid">grid</a> 区域中的次分隔线。次分割线会对齐次刻度线 <a href="#angleAxis.minorTick">minorTick</a></p>\n'},"minorSplitLine.show":{desc:"\n\n<p>是否显示次分隔线。默认不显示。</p>\n",uiControl:{type:"boolean",default:"true"}},"minorSplitLine.lineStyle.color":{desc:'\n\n<p>次分隔线线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"minorSplitLine.lineStyle.width":{desc:"\n\n<p>次分隔线线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"minorSplitLine.lineStyle.type":{desc:'\n\n<p>次分隔线线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"minorSplitLine.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"minorSplitLine.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"minorSplitLine.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"minorSplitLine.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"minorSplitLine.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},splitArea:{desc:'<p>坐标轴在 <a href="#grid">grid</a> 区域中的分隔区域,默认不显示。</p>\n'},"splitArea.interval":{desc:'\n\n\n\n<p>坐标轴分隔区域的显示间隔,在类目轴中有效。默认同 <a href="#angleAxis.axisLabel.interval">axisLabel.interval</a> 一样。</p>\n<p>默认会采用标签不重叠的策略间隔显示标签。</p>\n<p>可以设置成 0 强制显示所有标签。</p>\n<p>如果设置为 <code class="codespan">1</code>,表示『隔一个标签显示一个标签』,如果值为 <code class="codespan">2</code>,表示隔两个标签显示一个标签,以此类推。</p>\n<p>可以用数值表示间隔的数据,也可以通过回调函数控制。回调函数格式如下:</p>\n<pre><code class="lang-js">(index:number, value: string) => boolean\n</code></pre>\n<p>第一个参数是类目的 index,第二个值是类目名称,如果跳过则返回 <code class="codespan">false</code>。</p>\n',uiControl:{type:"number",min:"0",step:"1"}},"splitArea.show":{desc:"\n\n<p>是否显示分隔区域。</p>\n",uiControl:{type:"boolean",default:"true"}},"splitArea.areaStyle":{desc:"<p>分隔区域的样式设置。</p>\n"},"splitArea.areaStyle.color":{desc:"<p>分隔区域颜色。分隔区域会按数组中颜色的顺序依次循环设置颜色。默认是一个深浅的间隔色。</p>\n"},"splitArea.areaStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"splitArea.areaStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"splitArea.areaStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"splitArea.areaStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"splitArea.areaStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},data:{desc:'<p>类目数据,在类目轴(<a href="#angleAxis.type">type</a>: <code class="codespan">'category'</code>)中有效。</p>\n<p>如果没有设置 <a href="#angleAxis.type">type</a>,但是设置了 <code class="codespan">axis.data</code>,则认为 <code class="codespan">type</code> 是 <code class="codespan">'category'</code>。</p>\n<p>如果设置了 <a href="#angleAxis.type">type</a> 是 <code class="codespan">'category'</code>,但没有设置 <code class="codespan">axis.data</code>,则 <code class="codespan">axis.data</code> 的内容会自动从 <a href="#series.data">series.data</a> 中获取,这会比较方便。不过注意,<code class="codespan">axis.data</code> 指明的是 <code class="codespan">'category'</code> 轴的取值范围。如果不指定而是从 <a href="#series.data">series.data</a> 中获取,那么只能获取到 <a href="#series.data">series.data</a> 中出现的值。比如说,假如 <a href="#series.data">series.data</a> 为空时,就什么也获取不到。</p>\n<p>示例:</p>\n<pre><code class="lang-js">// 所有类目名称列表\ndata: ['周一', '周二', '周三', '周四', '周五', '周六', '周日']\n// 每一项也可以是具体的配置项,此时取配置项中的 `value` 为类目名\ndata: [{\n value: '周一',\n // 突出周一\n textStyle: {\n fontSize: 20,\n color: 'red'\n }\n}, '周二', '周三', '周四', '周五', '周六', '周日']\n</code></pre>\n'},"data.value":{desc:"<p>单个类目名称。</p>\n"},"data.textStyle":{desc:"<p>类目标签的文字样式。</p>\n"},"data.textStyle.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"data.textStyle.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.textStyle.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.textStyle.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.textStyle.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.textStyle.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.textStyle.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.textStyle.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.textStyle.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.textStyle.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"data.textStyle.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.textStyle.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.textStyle.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.textStyle.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.textStyle.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.textStyle.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.textStyle.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.textStyle.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"data.textStyle.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"data.textStyle.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"data.textStyle.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.textStyle.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.textStyle.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.textStyle.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.textStyle.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.textStyle.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"data.textStyle.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"data.textStyle.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"data.textStyle.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"data.textStyle.rich.<style_name>.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"data.textStyle.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.textStyle.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.textStyle.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.textStyle.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.textStyle.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.textStyle.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.textStyle.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.textStyle.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.textStyle.rich.<style_name>.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"data.textStyle.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.textStyle.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.textStyle.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.textStyle.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.textStyle.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.textStyle.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.textStyle.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.textStyle.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.textStyle.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.textStyle.rich.<style_name>.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"data.textStyle.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.textStyle.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.textStyle.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.textStyle.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.textStyle.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},axisPointer:{desc:"<p>坐标轴指示器配置项。</p>\n"},"axisPointer.show":{desc:'\n\n<p>默认不显示。但是如果 <a href="#tooltip.trigger">tooltip.trigger</a> 设置为 <code class="codespan">'axis'</code> 或者 <a href="#tooltip.axisPointer.type">tooltip.axisPointer.type</a> 设置为 <code class="codespan">'cross'</code>,则自动显示 axisPointer。坐标系会自动选择显示显示哪个轴的 axisPointer,也可以使用 <a href="#tooltip.axisPointer.axis">tooltip.axisPointer.axis</a> 改变这种选择。</p>\n',uiControl:{type:"boolean"}},"axisPointer.type":{desc:'\n\n<p>指示器类型。</p>\n<p>可选</p>\n<ul>\n<li><p><code class="codespan">'line'</code> 直线指示器</p>\n</li>\n<li><p><code class="codespan">'shadow'</code> 阴影指示器</p>\n</li>\n<li><p><code class="codespan">'none'</code> 无指示器</p>\n</li>\n</ul>\n',uiControl:{type:"enum",options:"line,shadow,none"}},"axisPointer.snap":{desc:"<p>坐标轴指示器是否自动吸附到点上。默认自动判断。</p>\n<p>这个功能在数值轴和时间轴上比较有意义,可以自动寻找细小的数值点。</p>\n"},"axisPointer.z":{desc:'<p>坐标轴指示器的 z 值。控制图形的前后顺序。<code class="codespan">z</code>值小的图形会被<code class="codespan">z</code>值大的图形覆盖。</p>\n'},"axisPointer.label":{desc:"<p>坐标轴指示器的文本标签。</p>\n"},"axisPointer.label.show":{desc:'<p>是否显示文本标签。如果 <a href="#tooltip.axisPointer.type">tooltip.axisPointer.type</a> 设置为 <code class="codespan">'cross'</code> 则默认显示标签,否则默认不显示。</p>\n'},"axisPointer.label.precision":{desc:'<p>文本标签中数值的小数点精度。默认根据当前轴的值自动判断。也可以指定如 <code class="codespan">2</code> 表示保留两位小数。</p>\n'},"axisPointer.label.formatter":{desc:'<p>文本标签文字的格式化器。</p>\n<p>如果为 <code class="codespan">string</code>,可以是例如:<code class="codespan">formatter: 'some text {value} some text</code>,其中 <code class="codespan">{value}</code> 会被自动替换为轴的值。</p>\n<p>如果为 <code class="codespan">function</code>,可以是例如:</p>\n<p><strong>参数:</strong></p>\n<p><code class="codespan">{Object}</code> params: 含有:</p>\n<p><code class="codespan">{Object}</code> params.value: 轴当前值,如果 axis.type 为 'category' 时,其值为 axis.data 里的数值。如果 axis.type 为 <code class="codespan">'time'</code>,其值为时间戳。</p>\n<p><code class="codespan">{Array.<Object>}</code> params.seriesData: 一个数组,是当前 axisPointer 最近的点的信息,每项内容为</p>\n<p><code class="codespan">{string}</code> params.axisDimension: 轴的维度名,例如直角坐标系中是 <code class="codespan">'x'</code>、<code class="codespan">'y'</code>,极坐标系中是 <code class="codespan">'radius'</code>、<code class="codespan">'angle'</code>。</p>\n<p><code class="codespan">{number}</code> params.axisIndex: 轴的 index,<code class="codespan">0</code>、<code class="codespan">1</code>、<code class="codespan">2</code>、...</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n<p>每项内容还包括轴的信息:</p>\n<pre><code class="lang-js">{\n axisDim: 'x', // 'x', 'y', 'angle', 'radius', 'single'\n axisId: 'xxx',\n axisName: 'xxx',\n axisIndex: 3,\n axisValue: 121, // 当前 axisPointer 对应的 value。\n axisValueLabel: '文本'\n}\n</code></pre>\n<p><strong>返回值:</strong></p>\n<p>显示的 string。</p>\n<p>例如:</p>\n<pre><code class="lang-js">formatter: function (params) {\n // 假设此轴的 type 为 'time'。\n return 'some text' + echarts.format.formatTime(params.value);\n}\n</code></pre>\n'},"axisPointer.label.margin":{desc:"<p>label 距离轴的距离。</p>\n"},"axisPointer.label.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"'#fff'"}},"axisPointer.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"axisPointer.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"axisPointer.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"axisPointer.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"axisPointer.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"axisPointer.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"axisPointer.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"axisPointer.label.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"axisPointer.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisPointer.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"axisPointer.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisPointer.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisPointer.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisPointer.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"axisPointer.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"axisPointer.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"axisPointer.label.padding":{desc:'\n\n<p>axisPointer内边距,单位px,默认各方向内边距为5,接受数组分别设定上右下左边距。</p>\n<p>使用示例:</p>\n<pre><code class="lang-js">// 设置内边距为 5\npadding: 5\n// 设置上下的内边距为 5,左右的内边距为 10\npadding: [5, 10]\n// 分别设置四个方向的内边距\npadding: [\n 5, // 上\n 10, // 右\n 5, // 下\n 10, // 左\n]\n</code></pre>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"axisPointer.label.backgroundColor":{desc:'<p>文本标签的背景颜色,默认是和 <a href="#xAxis.axisLine.lineStyle.color">axis.axisLine.lineStyle.color</a> 相同。</p>\n'},"axisPointer.label.borderColor":{desc:"<p>文本标签的边框颜色。</p>\n"},"axisPointer.label.borderWidth":{desc:"<p>文本标签的边框宽度。</p>\n"},"axisPointer.label.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"3",min:"0",step:"0.5"}},"axisPointer.label.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:"#aaa"}},"axisPointer.label.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisPointer.label.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisPointer.lineStyle":{desc:'<p><a href="#tooltip.axisPointer.type">axisPointer.type</a> 为 <code class="codespan">'line'</code> 时有效。</p>\n'},"axisPointer.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"axisPointer.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"axisPointer.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"axisPointer.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"axisPointer.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"axisPointer.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisPointer.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisPointer.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"axisPointer.shadowStyle":{desc:'<p><a href="#tooltip.axisPointer.type">axisPointer.type</a> 为 <code class="codespan">'shadow'</code> 时有效。</p>\n'},"axisPointer.shadowStyle.color":{desc:'\n\n<p>填充的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"axisPointer.shadowStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"axisPointer.shadowStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"axisPointer.shadowStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisPointer.shadowStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisPointer.shadowStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"axisPointer.triggerTooltip":{desc:"\n\n<p>是否触发 tooltip。如果不想触发 tooltip 可以关掉。</p>\n",uiControl:{type:"boolean",default:"true"}},"axisPointer.value":{desc:'<p>当前的 value。在使用 <a href="xAxisPointer.handle" target="_blank">axisPointer.handle</a> 时,可以设置此值进行初始值设定,从而决定 axisPointer 的初始位置。</p>\n'},"axisPointer.status":{desc:'\n\n<p>当前的状态,可取值为 <code class="codespan">'show'</code> 和 <code class="codespan">'hide'</code>。</p>\n',uiControl:{type:"enum",options:"show,hide"}},"axisPointer.handle":{desc:'<p>拖拽手柄,适用于触屏的环境。参见 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=line-tooltip-touch&edit=1&reset=1" target="_blank">例子</a>。</p>\n'},"axisPointer.handle.show":{desc:'\n\n<p>当 show 设为 <code class="codespan">true</code> 时开启,这时显示手柄,并且 axisPointer 会一直显示。</p>\n',uiControl:{type:"boolean"}},"axisPointer.handle.icon":{desc:'\n\n<p>手柄的图标。</p>\n<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre><p>参见 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/axisPointer-handle-image&edit=1&reset=1" target="_blank">使用图片的例子</a></p>\n',uiControl:{type:"icon",clean:"true"}},"axisPointer.handle.size":{desc:'\n\n<p>手柄的尺寸,可以设置单值,如 <code class="codespan">45</code>,也可以设置为数组:<code class="codespan">[width, height]</code>。</p>\n',uiControl:{type:"vector",default:"45,45",min:"0",step:"0.5",dims:"width,height"}},"axisPointer.handle.margin":{desc:"\n\n<p>手柄与轴的距离。注意,这是手柄中心点和轴的距离。</p>\n",uiControl:{type:"number",default:"50",min:"0",step:"0.5"}},"axisPointer.handle.color":{desc:"\n\n<p>手柄颜色。</p>\n",uiControl:{type:"color"}},"axisPointer.handle.throttle":{desc:"\n\n<p>手柄拖拽时触发视图更新周期,单位毫秒,调大这个数值可以改善性能,但是降低体验。</p>\n",uiControl:{type:"number",default:"40",min:"0",step:"10"}},"axisPointer.handle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"3",min:"0",step:"0.5"}},"axisPointer.handle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:"#aaa"}},"axisPointer.handle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"2",step:"0.5"}},"axisPointer.handle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},zlevel:{desc:'<p>角度轴所有图形的 zlevel 值。</p>\n<p><code class="codespan">zlevel</code>用于 Canvas 分层,不同<code class="codespan">zlevel</code>值的图形会放置在不同的 Canvas 中,Canvas 分层是一种常见的优化手段。我们可以把一些图形变化频繁(例如有动画)的组件设置成一个单独的<code class="codespan">zlevel</code>。需要注意的是过多的 Canvas 会引起内存开销的增大,在手机端上需要谨慎使用以防崩溃。</p>\n<p><code class="codespan">zlevel</code> 大的 Canvas 会放在 <code class="codespan">zlevel</code> 小的 Canvas 的上面。</p>\n'},z:{desc:'<p>角度轴组件的所有图形的<code class="codespan">z</code>值。控制图形的前后顺序。<code class="codespan">z</code>值小的图形会被<code class="codespan">z</code>值大的图形覆盖。</p>\n<p><code class="codespan">z</code>相比<code class="codespan">zlevel</code>优先级更低,而且不会创建新的 Canvas。</p>\n'}})}]}}));
|
||
;/*!examples/components/EChartsEditor/Tooltip.tsx*/
|
||
amis.define("2d2b045",(function(e,n,o,s){"use strict";Object.defineProperty(n,"__esModule",{value:!0}),n.buildTooltip=void 0;var a=e("b666d70"),c={show:{desc:'\n\n<p>是否显示提示框组件,包括提示框浮层和 <a href="#tooltip.axisPointer">axisPointer</a>。</p>\n',uiControl:{type:"boolean",default:"true"}},trigger:{desc:'\n\n<p>触发类型。</p>\n<p>可选:</p>\n<ul>\n<li><p><code class="codespan">'item'</code></p>\n<p> 数据项图形触发,主要在散点图,饼图等无类目轴的图表中使用。</p>\n</li>\n<li><p><code class="codespan">'axis'</code></p>\n<p> 坐标轴触发,主要在柱状图,折线图等会使用类目轴的图表中使用。</p>\n<p> 在 ECharts 2.x 中只支持类目轴上使用 axis trigger,在 ECharts 3 中支持在<a href="#grid">直角坐标系</a>和<a href="#polar">极坐标系</a>上的所有类型的轴。并且可以通过 <a href="#tooltip.axisPointer.axis">axisPointer.axis</a> 指定坐标轴。</p>\n</li>\n<li><p><code class="codespan">'none'</code></p>\n<p> 什么都不触发。</p>\n</li>\n</ul>\n',uiControl:{type:"enum",options:"item,axis,none",default:"item"}},axisPointer:{desc:'<p>坐标轴指示器配置项。</p>\n<p><code class="codespan">tooltip.axisPointer</code> 是配置坐标轴指示器的快捷方式。实际上坐标轴指示器的全部功能,都可以通过轴上的 axisPointer 配置项完成(例如 <a href="#xAxis.axisPointer">xAxis.axisPointer</a> 或 <a href="#angleAxis.axisPointer">angleAxis.axisPointer</a>)。但是使用 <code class="codespan">tooltip.axisPointer</code> 在简单场景下会更方便一些。</p>\n<blockquote>\n<p><strong>注意:</strong> <code class="codespan">tooltip.axisPointer</code> 中诸配置项的优先级低于轴上的 axisPointer 的配置项。</p>\n</blockquote>\n<hr>\n<p>坐标轴指示器是指示坐标轴当前刻度的工具。</p>\n<p>如下例,鼠标悬浮到图上,可以出现标线和刻度文本。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/candlestick-axisPointer&edit=1&reset=1" width="600" height="450"><iframe />\n\n\n<p>上例中,使用了 <a href="#axisPointer.link">axisPointer.link</a> 来关联不同的坐标系中的 axisPointer。</p>\n<p>坐标轴指示器也有适合触屏的交互方式,如下:</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=line-tooltip-touch&edit=1&reset=1" width="600" height="400"><iframe />\n\n\n<p>坐标轴指示器在多轴的场景能起到辅助作用:</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=multiple-y-axis&edit=1&reset=1" width="600" height="300"><iframe />\n\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=multiple-x-axis&edit=1&reset=1" width="600" height="300"><iframe />\n\n\n\n\n<hr>\n<blockquote>\n<p><strong>注意:</strong>\n一般来说,axisPointer 的具体配置项会配置在各个轴中(如 <a href="#xAxis.axisPointer">xAxis.axisPointer</a>)或者 <code class="codespan">tooltip</code> 中(如 <a href="#tooltip.axisPointer">tooltip.axisPointer</a>)。</p>\n</blockquote>\n<blockquote>\n<p>但是这几个选项只能配置在全局的 axisPointer 中:<a href="#axisPointer.triggerOn">axisPointer.triggerOn</a>、<a href="#axisPointer.link">axisPointer.link</a>。</p>\n</blockquote>\n<hr>\n<p><strong>如何显示 axisPointer:</strong></p>\n<p>直角坐标系 <a href="#grid">grid</a>、极坐标系 <a href="#polar">polar</a>、单轴坐标系 <a href="#single">single</a> 中的每个轴都自己的 axisPointer。</p>\n<p>他们的 axisPointer 默认不显示。有两种方法可以让他们显示:</p>\n<ul>\n<li><p>设置轴上的 <code class="codespan">axisPointer.show</code>(例如 <a href="#xAxis.axisPointer.show">xAxis.axisPointer.show</a>)为 <code class="codespan">true</code>,则显示此轴的 axisPointer。</p>\n</li>\n<li><p>设置 <a href="#tooltip.trigger">tooltip.trigger</a> 设置为 <code class="codespan">'axis'</code> 或者 <a href="#tooltip.axisPointer.type">tooltip.axisPointer.type</a> 设置为 <code class="codespan">'cross'</code>,则此时坐标系会自动选择显示哪个轴的 axisPointer,也可以使用 <a href="#tooltip.axisPointer.axis">tooltip.axisPointer.axis</a> 改变这种选择。注意,轴上如果设置了 axisPointer,会覆盖此设置。</p>\n</li>\n</ul>\n<hr>\n<p><strong>如何显示 axisPointer 的 label:</strong></p>\n<p>axisPointer 的 label 默认不显示(也就是默认只显示指示线),除非:</p>\n<ul>\n<li><p>设置轴上的 <code class="codespan">axisPointer.label.show</code>(例如 <a href="#xAxis.axisPointer.show">xAxis.axisPointer.label.show</a>)为 <code class="codespan">true</code>,则显示此轴的 axisPointer 的 label。</p>\n</li>\n<li><p>设置 <a href="#tooltip.axisPointer.type">tooltip.axisPointer.type</a> 为 <code class="codespan">'cross'</code> 时会自动显示 axisPointer 的 label。</p>\n</li>\n</ul>\n<hr>\n<p><strong>关于触屏的 axisPointer 的设置</strong></p>\n<p>设置轴上的 <code class="codespan">axisPointer.handle.show</code>(例如 <a href="#xAxis.axisPointer.handle.show">xAxis.axisPointer.handle.show</a> 为 <code class="codespan">true</code> 则会显示出此 axisPointer 的拖拽按钮。(polar 坐标系暂不支持此功能)。</p>\n<p><strong>注意:</strong>\n如果发现此时 tooltip 效果不良好,可设置 <a href="#tooltip.triggerOn">tooltip.triggerOn</a> 为 <code class="codespan">'none'</code>(于是效果为:手指按住按钮则显示 tooltip,松开按钮则隐藏 tooltip),或者 <a href="#tooltip.alwaysShowContent">tooltip.alwaysShowContent</a> 为 <code class="codespan">true</code>(效果为 tooltip 一直显示)。</p>\n<p>参见<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=line-tooltip-touch&edit=1&reset=1" target="_blank">例子</a>。</p>\n<hr>\n<p><strong>自动吸附到数据(snap)</strong></p>\n<p>对于数值轴、时间轴,如果开启了 <a href="#xAxis.axisPointer.snap">snap</a>,则 axisPointer 会自动吸附到最近的点上。</p>\n<hr>\n'},"axisPointer.type":{desc:'\n\n<p>指示器类型。</p>\n<p>可选</p>\n<ul>\n<li><p><code class="codespan">'line'</code> 直线指示器</p>\n</li>\n<li><p><code class="codespan">'shadow'</code> 阴影指示器</p>\n</li>\n<li><p><code class="codespan">'none'</code> 无指示器</p>\n</li>\n<li><p><code class="codespan">'cross'</code> 十字准星指示器。其实是种简写,表示启用两个正交的轴的 axisPointer。</p>\n</li>\n</ul>\n',uiControl:{type:"enum",options:"none,line,shadow,cross",default:"line"}},"axisPointer.axis":{desc:'<p>指示器的坐标轴。</p>\n<p>默认情况,坐标系会自动选择显示哪个轴的 axisPointer(默认取类目轴或者时间轴)。</p>\n<p>可以是 <code class="codespan">'x'</code>, <code class="codespan">'y'</code>, <code class="codespan">'radius'</code>, <code class="codespan">'angle'</code>。</p>\n'},"axisPointer.snap":{desc:"<p>坐标轴指示器是否自动吸附到点上。默认自动判断。</p>\n<p>这个功能在数值轴和时间轴上比较有意义,可以自动寻找细小的数值点。</p>\n"},"axisPointer.z":{desc:'<p>坐标轴指示器的 z 值。控制图形的前后顺序。<code class="codespan">z</code>值小的图形会被<code class="codespan">z</code>值大的图形覆盖。</p>\n'},"axisPointer.label":{desc:"<p>坐标轴指示器的文本标签。</p>\n"},"axisPointer.label.show":{desc:'<p>是否显示文本标签。如果 <a href="#tooltip.axisPointer.type">tooltip.axisPointer.type</a> 设置为 <code class="codespan">'cross'</code> 则默认显示标签,否则默认不显示。</p>\n'},"axisPointer.label.precision":{desc:'<p>文本标签中数值的小数点精度。默认根据当前轴的值自动判断。也可以指定如 <code class="codespan">2</code> 表示保留两位小数。</p>\n'},"axisPointer.label.formatter":{desc:'<p>文本标签文字的格式化器。</p>\n<p>如果为 <code class="codespan">string</code>,可以是例如:<code class="codespan">formatter: 'some text {value} some text</code>,其中 <code class="codespan">{value}</code> 会被自动替换为轴的值。</p>\n<p>如果为 <code class="codespan">function</code>,可以是例如:</p>\n<p><strong>参数:</strong></p>\n<p><code class="codespan">{Object}</code> params: 含有:</p>\n<p><code class="codespan">{Object}</code> params.value: 轴当前值,如果 axis.type 为 'category' 时,其值为 axis.data 里的数值。如果 axis.type 为 <code class="codespan">'time'</code>,其值为时间戳。</p>\n<p><code class="codespan">{Array.<Object>}</code> params.seriesData: 一个数组,是当前 axisPointer 最近的点的信息,每项内容为</p>\n<p><code class="codespan">{string}</code> params.axisDimension: 轴的维度名,例如直角坐标系中是 <code class="codespan">'x'</code>、<code class="codespan">'y'</code>,极坐标系中是 <code class="codespan">'radius'</code>、<code class="codespan">'angle'</code>。</p>\n<p><code class="codespan">{number}</code> params.axisIndex: 轴的 index,<code class="codespan">0</code>、<code class="codespan">1</code>、<code class="codespan">2</code>、...</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n<p>每项内容还包括轴的信息:</p>\n<pre><code class="lang-js">{\n axisDim: 'x', // 'x', 'y', 'angle', 'radius', 'single'\n axisId: 'xxx',\n axisName: 'xxx',\n axisIndex: 3,\n axisValue: 121, // 当前 axisPointer 对应的 value。\n axisValueLabel: '文本'\n}\n</code></pre>\n<p><strong>返回值:</strong></p>\n<p>显示的 string。</p>\n<p>例如:</p>\n<pre><code class="lang-js">formatter: function (params) {\n // 假设此轴的 type 为 'time'。\n return 'some text' + echarts.format.formatTime(params.value);\n}\n</code></pre>\n'},"axisPointer.label.margin":{desc:"<p>label 距离轴的距离。</p>\n"},"axisPointer.label.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"'#fff'"}},"axisPointer.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"axisPointer.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"axisPointer.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"axisPointer.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"axisPointer.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"axisPointer.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"axisPointer.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"axisPointer.label.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"axisPointer.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisPointer.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"axisPointer.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisPointer.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisPointer.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisPointer.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"axisPointer.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"axisPointer.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"axisPointer.label.padding":{desc:'\n\n<p>axisPointer内边距,单位px,默认各方向内边距为5,接受数组分别设定上右下左边距。</p>\n<p>使用示例:</p>\n<pre><code class="lang-js">// 设置内边距为 5\npadding: 5\n// 设置上下的内边距为 5,左右的内边距为 10\npadding: [5, 10]\n// 分别设置四个方向的内边距\npadding: [\n 5, // 上\n 10, // 右\n 5, // 下\n 10, // 左\n]\n</code></pre>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"axisPointer.label.backgroundColor":{desc:'<p>文本标签的背景颜色,默认是和 <a href="#xAxis.axisLine.lineStyle.color">axis.axisLine.lineStyle.color</a> 相同。</p>\n'},"axisPointer.label.borderColor":{desc:"<p>文本标签的边框颜色。</p>\n"},"axisPointer.label.borderWidth":{desc:"<p>文本标签的边框宽度。</p>\n"},"axisPointer.label.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"3",min:"0",step:"0.5"}},"axisPointer.label.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:"#aaa"}},"axisPointer.label.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisPointer.label.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisPointer.lineStyle":{desc:'<p><a href="#tooltip.axisPointer.type">axisPointer.type</a> 为 <code class="codespan">'line'</code> 时有效。</p>\n'},"axisPointer.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"axisPointer.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"axisPointer.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"axisPointer.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"axisPointer.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"axisPointer.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisPointer.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisPointer.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"axisPointer.shadowStyle":{desc:'<p><a href="#tooltip.axisPointer.type">axisPointer.type</a> 为 <code class="codespan">'shadow'</code> 时有效。</p>\n'},"axisPointer.shadowStyle.color":{desc:'\n\n<p>填充的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"axisPointer.shadowStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"axisPointer.shadowStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"axisPointer.shadowStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisPointer.shadowStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisPointer.shadowStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"axisPointer.crossStyle":{desc:'<p><a href="#tooltip.axisPointer.type">axisPointer.type</a> 为 <code class="codespan">'cross'</code> 时有效。</p>\n'},"axisPointer.crossStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"axisPointer.crossStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"axisPointer.crossStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"axisPointer.crossStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"axisPointer.crossStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"axisPointer.crossStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisPointer.crossStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisPointer.crossStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"axisPointer.animation":{desc:"\n\n<p>是否开启动画。</p>\n",uiControl:{type:"boolean",default:"true",clean:"true"}},"axisPointer.animationThreshold":{desc:"<p>是否开启动画的阈值,当单个系列显示的图形数量大于这个阈值时会关闭动画。</p>\n"},"axisPointer.animationDuration":{desc:'\n\n<p>初始动画的时长,支持回调函数,可以通过每个数据返回不同的时长实现更戏剧的初始动画效果:</p>\n<pre><code class="lang-js">animationDuration: function (idx) {\n // 越往后的数据时长越大\n return idx * 100;\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",default:"1000",step:"20",clean:"true"}},"axisPointer.animationEasing":{desc:'\n\n<p>初始动画的缓动效果。不同的缓动效果可以参考 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=line-easing" target="_blank">缓动示例</a>。</p>\n',uiControl:{type:"enum",options:"linear,quadraticIn,quadraticOut,quadraticInOut,cubicIn,cubicOut,cubicInOut,quarticIn,quarticOut,quarticInOut,quinticIn,quinticOut,quinticInOut,sinusoidalIn,sinusoidalOut,sinusoidalInOut,exponentialIn,exponentialOut,exponentialInOut,circularIn,circularOut,circularInOut,elasticIn,elasticOut,elasticInOut,backIn,backOut,backInOut,bounceIn,bounceOut,bounceInOut",clean:"true"}},"axisPointer.animationDelay":{desc:'<p>初始动画的延迟,支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的初始动画效果。</p>\n<p>如下示例:</p>\n<pre><code class="lang-js">animationDelay: function (idx) {\n // 越往后的数据延迟越大\n return idx * 100;\n}\n</code></pre>\n<p>也可以看<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-animation-delay" target="_blank">该示例</a></p>\n'},"axisPointer.animationDurationUpdate":{desc:'\n\n<p>数据更新动画的时长。</p>\n<p>支持回调函数,可以通过每个数据返回不同的时长实现更戏剧的更新动画效果:</p>\n<pre><code class="lang-js">animationDurationUpdate: function (idx) {\n // 越往后的数据时长越大\n return idx * 100;\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",default:"1000",step:"20"}},"axisPointer.animationEasingUpdate":{desc:"\n\n<p>数据更新动画的缓动效果。</p>\n",uiControl:{type:"enum",options:"linear,quadraticIn,quadraticOut,quadraticInOut,cubicIn,cubicOut,cubicInOut,quarticIn,quarticOut,quarticInOut,quinticIn,quinticOut,quinticInOut,sinusoidalIn,sinusoidalOut,sinusoidalInOut,exponentialIn,exponentialOut,exponentialInOut,circularIn,circularOut,circularInOut,elasticIn,elasticOut,elasticInOut,backIn,backOut,backInOut,bounceIn,bounceOut,bounceInOut"}},"axisPointer.animationDelayUpdate":{desc:'<p>数据更新动画的延迟,支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的更新动画效果。</p>\n<p>如下示例:</p>\n<pre><code class="lang-js">animationDelayUpdate: function (idx) {\n // 越往后的数据延迟越大\n return idx * 100;\n}\n</code></pre>\n<p>也可以看<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-animation-delay" target="_blank">该示例</a></p>\n'},showContent:{desc:'\n\n<p>是否显示提示框浮层,默认显示。只需tooltip触发事件或显示axisPointer而不需要显示内容时可配置该项为<code class="codespan">false</code>。</p>\n',uiControl:{type:"boolean",default:"true"}},alwaysShowContent:{desc:'\n\n<p>是否永远显示提示框内容,默认情况下在移出可触发提示框区域后 <a href="#tooltip.hideDelay">一定时间</a> 后隐藏,设置为 <code class="codespan">true</code> 可以保证一直显示提示框内容。</p>\n<p>该属性为 ECharts 3.0 中新加。</p>\n',uiControl:{type:"boolean",default:"false"}},triggerOn:{desc:'\n\n<p>提示框触发的条件,可选:</p>\n<ul>\n<li><p><code class="codespan">'mousemove'</code></p>\n<p> 鼠标移动时触发。</p>\n</li>\n<li><p><code class="codespan">'click'</code></p>\n<p> 鼠标点击时触发。</p>\n</li>\n<li><p><code class="codespan">'mousemove|click'</code></p>\n<p> 同时鼠标移动和点击时触发。</p>\n</li>\n<li><p><code class="codespan">'none'</code></p>\n<p> 不在 <code class="codespan">'mousemove'</code> 或 <code class="codespan">'click'</code> 时触发,用户可以通过 <a href="api.html#action.tooltip.showTip" target="_blank">action.tooltip.showTip</a> 和 <a href="api.html#action.tooltip.hideTip" target="_blank">action.tooltip.hideTip</a> 来手动触发和隐藏。也可以通过 <a href="#xAxis.axisPointer.handle">axisPointer.handle</a> 来触发或隐藏。</p>\n</li>\n</ul>\n<p>该属性为 ECharts 3.0 中新加。</p>\n',uiControl:{type:"enum",options:"mousemove,click"}},showDelay:{desc:'\n\n<p>浮层显示的延迟,单位为 ms,默认没有延迟,也不建议设置。在 <a href="#tooltip.triggerOn">triggerOn</a> 为 <code class="codespan">'mousemove'</code> 时有效。</p>\n',uiControl:{type:"number",min:"0",step:"20"}},hideDelay:{desc:'\n\n<p>浮层隐藏的延迟,单位为 ms,在 <a href="#tooltip.alwaysShowContent">alwaysShowContent</a> 为 <code class="codespan">true</code> 的时候无效。</p>\n',uiControl:{type:"number",min:"0",step:"20",default:"100"}},enterable:{desc:'\n\n<p>鼠标是否可进入提示框浮层中,默认为false,如需详情内交互,如添加链接,按钮,可设置为 <code class="codespan">true</code>。</p>\n',uiControl:{type:"boolean",default:"false"}},renderMode:{desc:'\n\n<p>浮层的渲染模式,默认以 <code class="codespan">'html</code> 即额外的 DOM 节点展示 tooltip;此外还可以设置为 <code class="codespan">'richText'</code> 表示以富文本的形式渲染,渲染的结果在图表对应的 Canvas 中(目前 SVG 尚未支持富文本),这对于一些没有 DOM 的环境(如微信小程序)有更好的支持。</p>\n',uiControl:{type:"enum",options:"html,richText",default:"html"}},confine:{desc:'\n\n<p>是否将 tooltip 框限制在图表的区域内。</p>\n<p>当图表外层的 dom 被设置为 <code class="codespan">'overflow: hidden'</code>,或者移动端窄屏,导致 tooltip 超出外界被截断时,此配置比较有用。</p>\n',uiControl:{type:"boolean",default:"false"}},appendToBody:{desc:'\n\n\n\n<blockquote>\n<p>从 <code class="codespan">v4.7.0</code> 开始支持</p>\n</blockquote>\n<p>是否将 tooltip 的 DOM 节点添加为 HTML 的 <code class="codespan"><body></code> 的子节点。只有当 <a href="#tooltip.renderMode">renderMode</a> 为 <code class="codespan">'html'</code> 是有意义的。</p>\n<p>默认值是 <code class="codespan">false</code>。<code class="codespan">false</code> 表示,tooltip 的 DOM 节点会被添加为本图表的 DOM container 的一个子孙节点。但是这种方式导致,如果本图表的 DOM container 的祖先节点有设置 <code class="codespan">overflow: hidden</code>,那么当 tooltip 超出 container 范围使可能被截断。这个问题一定程度上可以用 <a href="#tooltip.confine">tooltip.confine</a> 来解决,但是不一定能解决所有场景。</p>\n<p>所以这里我们提供了 <code class="codespan">appendToBody: true</code> 来解决这件事。这也是常见的解决此类问题的一种方式。但是 <code class="codespan">true</code> 并不定为默认值,因为要避免 break change,尤其是一些对于 tooltip 深入定制的使用。并且也避免一些未知的 bad case。</p>\n<p>注:CSS transform 的场景,这也可以使用。</p>\n',uiControl:{type:"boolean",default:"false"}},transitionDuration:{desc:"\n\n<p>提示框浮层的移动动画过渡时间,单位是 s,设置为 0 的时候会紧跟着鼠标移动。</p>\n",uiControl:{type:"number",min:"0",step:"0.1",default:"0.4"}},position:{desc:'<p>提示框浮层的位置,默认不设置时位置会跟随鼠标的位置。</p>\n<p>可选:</p>\n<ul>\n<li><p><code class="codespan">Array</code></p>\n<p> 通过数组表示提示框浮层的位置,支持数字设置绝对位置,百分比设置相对位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对位置,相对于容器左侧 10px, 上侧 10 px\n position: [10, 10]\n // 相对位置,放置在容器正中间\n position: ['50%', '50%']\n</code></pre>\n</li>\n<li><p><code class="codespan">Function</code></p>\n<p> 回调函数,格式如下:</p>\n<pre><code class="lang-js"> (point: Array, params: Object|Array.<Object>, dom: HTMLDomElement, rect: Object, size: Object) => Array\n</code></pre>\n<p> <strong>参数:</strong><br>\n point: 鼠标位置,如 [20, 40]。<br>\n params: 同 formatter 的参数相同。<br>\n dom: tooltip 的 dom 对象。<br>\n rect: 只有鼠标在图形上时有效,是一个用<code class="codespan">x</code>, <code class="codespan">y</code>, <code class="codespan">width</code>, <code class="codespan">height</code>四个属性表达的图形包围盒。<br>\n size: 包括 dom 的尺寸和 echarts 容器的当前尺寸,例如:<code class="codespan">{contentSize: [width, height], viewSize: [width, height]}</code>。<br></p>\n<p> <strong>返回值:</strong><br>\n 可以是一个表示 tooltip 位置的数组,数组值可以是绝对的像素值,也可以是相 百分比。<br>\n 也可以是一个对象,如:<code class="codespan">{left: 10, top: 30}</code>,或者 <code class="codespan">{right: '20%', bottom: 40}</code>。<br></p>\n<p> 如下示例:</p>\n<pre><code class="lang-js"> position: function (point, params, dom, rect, size) {\n // 固定在顶部\n return [point[0], '10%'];\n }\n</code></pre>\n<p> 或者:</p>\n<pre><code class="lang-js"> position: function (pos, params, dom, rect, size) {\n // 鼠标在左侧时 tooltip 显示到右侧,鼠标在右侧时 tooltip 显示到左侧。\n var obj = {top: 60};\n obj[['left', 'right'][+(pos[0] < size.viewSize[0] / 2)]] = 5;\n return obj;\n }\n</code></pre>\n</li>\n</ul>\n<ul>\n<li><p><code class="codespan">'inside'</code></p>\n<p> 鼠标所在图形的内部中心位置,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'top'</code></p>\n<p> 鼠标所在图形上侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'left'</code></p>\n<p> 鼠标所在图形左侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'right'</code></p>\n<p> 鼠标所在图形右侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'bottom'</code></p>\n<p> 鼠标所在图形底侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n</ul>\n'},formatter:{desc:'<p>提示框浮层内容格式器,支持字符串模板和回调函数两种形式。</p>\n<p><strong>1, 字符串模板</strong></p>\n<p>模板变量有 <code class="codespan">{a}</code>, <code class="codespan">{b}</code>,<code class="codespan">{c}</code>,<code class="codespan">{d}</code>,<code class="codespan">{e}</code>,分别表示系列名,数据名,数据值等。\n在 <a href="#tooltip.trigger">trigger</a> 为 <code class="codespan">'axis'</code> 的时候,会有多个系列的数据,此时可以通过 <code class="codespan">{a0}</code>, <code class="codespan">{a1}</code>, <code class="codespan">{a2}</code> 这种后面加索引的方式表示系列的索引。\n不同图表类型下的 <code class="codespan">{a}</code>,<code class="codespan">{b}</code>,<code class="codespan">{c}</code>,<code class="codespan">{d}</code> 含义不一样。\n其中变量<code class="codespan">{a}</code>, <code class="codespan">{b}</code>, <code class="codespan">{c}</code>, <code class="codespan">{d}</code>在不同图表类型下代表数据含义为:</p>\n<ul>\n<li><p>折线(区域)图、柱状(条形)图、K线图 : <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(类目值),<code class="codespan">{c}</code>(数值), <code class="codespan">{d}</code>(无)</p>\n</li>\n<li><p>散点图(气泡)图 : <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(数据名称),<code class="codespan">{c}</code>(数值数组), <code class="codespan">{d}</code>(无)</p>\n</li>\n<li><p>地图 : <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(区域名称),<code class="codespan">{c}</code>(合并数值), <code class="codespan">{d}</code>(无)</p>\n</li>\n<li><p>饼图、仪表盘、漏斗图: <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(数据项名称),<code class="codespan">{c}</code>(数值), <code class="codespan">{d}</code>(百分比)</p>\n</li>\n</ul>\n<p>更多其它图表模板变量的含义可以见相应的图表的 label.formatter 配置项。</p>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b0}: {c0}<br />{b1}: {c1}'\n</code></pre>\n<p><strong>2, 回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array, ticket: string, callback: (ticket: string, html: string)) => string\n</code></pre>\n<p>第一个参数 <code class="codespan">params</code> 是 formatter 需要的数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n // 饼图的百分比\n percent: number,\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n<p>在 <a href="#tooltip.trigger">trigger</a> 为 <code class="codespan">'axis'</code> 的时候,或者 tooltip 被 <a href="#xAxis.axisPointer">axisPointer</a> 触发的时候,<code class="codespan">params</code> 是多个系列的数据数组。其中每项内容格式同上,并且,</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n<p><strong>注:</strong> ECharts 2.x 使用数组表示各参数的方式不再支持。</p>\n<p>第二个参数 <code class="codespan">ticket</code> 是异步回调标识,配合第三个参数 <code class="codespan">callback</code> 使用。\n第三个参数 <code class="codespan">callback</code> 是异步回调,在提示框浮层内容是异步获取的时候,可以通过 callback 传入上述的 <code class="codespan">ticket</code> 和 <code class="codespan">html</code> 更新提示框浮层内容。</p>\n<p>示例:</p>\n<pre><code class="lang-js">formatter: function (params, ticket, callback) {\n $.get('detail?name=' + params.name, function (content) {\n callback(ticket, toHTML(content));\n });\n return 'Loading';\n}\n</code></pre>\n'},backgroundColor:{desc:"<p>提示框浮层的背景颜色。</p>\n"},borderColor:{desc:"\n\n\n\n\n\n\n\n\n\n<p>提示框浮层的边框颜色。</p>\n",uiControl:{type:"color",default:"#333"}},borderWidth:{desc:"\n\n\n\n\n\n\n\n\n\n<p>提示框浮层的边框宽。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},padding:{desc:'\n\n\n\n\n\n\n\n\n\n\n\n\n\n<p>提示框浮层内边距,单位px,默认各方向内边距为5,接受数组分别设定上右下左边距。</p>\n<p>使用示例:</p>\n<pre><code class="lang-js">// 设置内边距为 5\npadding: 5\n// 设置上下的内边距为 5,左右的内边距为 10\npadding: [5, 10]\n// 分别设置四个方向的内边距\npadding: [\n 5, // 上\n 10, // 右\n 5, // 下\n 10, // 左\n]\n</code></pre>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},textStyle:{desc:"<p>提示框浮层的文本样式。</p>\n"},"textStyle.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"'#fff'"}},"textStyle.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"textStyle.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"textStyle.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"textStyle.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"14",min:"1",step:"1"}},"textStyle.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"textStyle.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"textStyle.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"textStyle.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"textStyle.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"textStyle.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"textStyle.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"textStyle.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"textStyle.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"textStyle.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"textStyle.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"textStyle.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},extraCssText:{desc:'<p>额外附加到浮层的 css 样式。如下为浮层添加阴影的示例:</p>\n<pre><code class="lang-js">extraCssText: 'box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);'\n</code></pre>\n'}};n.buildTooltip=function(e){return(0,a.buildOptions)(e,c)},n.default={type:"tabs",tabs:[{title:"基础",body:(0,a.buildOptions)("tooltip.",c)}]}}));
|
||
;/*!examples/components/EChartsEditor/Toolbox.tsx*/
|
||
amis.define("3b4b163",(function(e,o,c,n){"use strict";Object.defineProperty(o,"__esModule",{value:!0});var a=e("b666d70");o.default={type:"tabs",tabs:[{title:"基础",body:(0,a.buildOptions)("toolbox.",{id:{desc:"<p>组件 ID。默认不指定。指定则可用于在 option 或者 API 中引用组件。</p>\n"},show:{desc:"\n\n<p>是否显示工具栏组件。</p>\n",uiControl:{type:"boolean"}},orient:{desc:"\n\n<p>工具栏 icon 的布局朝向。</p>\n<p>可选:</p>\n<ul>\n<li>'horizontal'</li>\n<li>'vertical'</li>\n</ul>\n",uiControl:{type:"enum",options:"vertical,horizontal"}},itemSize:{desc:"\n\n<p>工具栏 icon 的大小。</p>\n",uiControl:{type:"number",min:"0",default:"15"}},itemGap:{desc:"\n\n<p>工具栏 icon 每项之间的间隔。横向布局时为水平间隔,纵向布局时为纵向间隔。</p>\n",uiControl:{type:"number",min:"0",default:"10"}},showTitle:{desc:"\n\n<p>是否在鼠标 hover 的时候显示每个工具 icon 的标题。</p>\n",uiControl:{type:"boolean",default:"true"}},feature:{desc:'<p>各工具配置项。</p>\n<p>除了各个内置的工具按钮外,还可以自定义工具按钮。</p>\n<p>注意,自定义的工具名字,只能以 <code class="codespan">my</code> 开头,例如下例中的 <code class="codespan">myTool1</code>,<code class="codespan">myTool2</code>:</p>\n<pre><code class="lang-javascript">{\n toolbox: {\n feature: {\n myTool1: {\n show: true,\n title: '自定义扩展方法1',\n icon: 'path://M432.45,595.444c0,2.177-4.661,6.82-11.305,6.82c-6.475,0-11.306-4.567-11.306-6.82s4.852-6.812,11.306-6.812C427.841,588.632,432.452,593.191,432.45,595.444L432.45,595.444z M421.155,589.876c-3.009,0-5.448,2.495-5.448,5.572s2.439,5.572,5.448,5.572c3.01,0,5.449-2.495,5.449-5.572C426.604,592.371,424.165,589.876,421.155,589.876L421.155,589.876z M421.146,591.891c-1.916,0-3.47,1.589-3.47,3.549c0,1.959,1.554,3.548,3.47,3.548s3.469-1.589,3.469-3.548C424.614,593.479,423.062,591.891,421.146,591.891L421.146,591.891zM421.146,591.891',\n onclick: function (){\n alert('myToolHandler1')\n }\n },\n myTool2: {\n show: true,\n title: '自定义扩展方法',\n icon: 'image://http://echarts.baidu.com/images/favicon.png',\n onclick: function (){\n alert('myToolHandler2')\n }\n }\n }\n }\n}\n</code></pre>\n'},"feature.saveAsImage":{desc:"<p>保存为图片。</p>\n"},"feature.saveAsImage.type":{desc:'\n\n<p>保存的图片格式。</p>\n<ul>\n<li>如果 <code class="codespan">renderer</code> 的类型在 <a href="api.html#echarts.init" target="_blank">初始化图表</a> 时被设为 <code class="codespan">'canvas'</code>(默认),则支持 <code class="codespan">'png'</code>(默认)和 <code class="codespan">'jpg'</code>;</li>\n<li>如果 <code class="codespan">renderer</code> 的类型在 <a href="api.html#echarts.init" target="_blank">初始化图表</a> 时被设为 <code class="codespan">'svg'</code>,则 <code class="codespan">type</code> 只支持 <code class="codespan">'svg'</code>(<code class="codespan">'svg'</code> 格式的图片从 <code class="codespan">v4.8.0</code> 开始支持)。</li>\n</ul>\n',uiControl:{type:"enum",options:"png,jpg"}},"feature.saveAsImage.name":{desc:'\n\n<p>保存的文件名称,默认使用 <a href="#title.text">title.text</a> 作为名称。</p>\n',uiControl:{type:"text"}},"feature.saveAsImage.backgroundColor":{desc:'\n\n<p>保存的图片背景色,默认使用 <a href="#backgroundColor">backgroundColor</a>,如果<code class="codespan">backgroundColor</code>不存在的话会取白色。</p>\n',uiControl:{type:"color"}},"feature.saveAsImage.connectedBackgroundColor":{desc:'\n\n<p>如果图表使用了 <a href="api.html#echarts.connect" target="_blank">echarts.connect</a> 对多个图表进行联动,则在导出图片时会导出这些联动的图表。该配置项决定了图表与图表之间间隙处的填充色。</p>\n',uiControl:{type:"color"}},"feature.saveAsImage.excludeComponents":{desc:"<p>保存为图片时忽略的组件列表,默认忽略工具栏。</p>\n"},"feature.saveAsImage.show":{desc:"<p>是否显示该工具。</p>\n"},"feature.saveAsImage.icon":{desc:'<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>'},"feature.saveAsImage.iconStyle":{desc:'<p>保存为图片 icon 样式设置。由于 icon 的文本信息只在 icon hover 时候才显示,所以文字相关的配置项请在 <code class="codespan">emphasis</code> 下设置。</p>\n'},"feature.saveAsImage.iconStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"feature.saveAsImage.iconStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"feature.saveAsImage.iconStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"feature.saveAsImage.iconStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"feature.saveAsImage.iconStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"feature.saveAsImage.iconStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"feature.saveAsImage.iconStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"feature.saveAsImage.iconStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"feature.saveAsImage.iconStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"feature.saveAsImage.emphasis.iconStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"feature.saveAsImage.emphasis.iconStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"feature.saveAsImage.emphasis.iconStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"feature.saveAsImage.emphasis.iconStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"feature.saveAsImage.emphasis.iconStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"feature.saveAsImage.emphasis.iconStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"feature.saveAsImage.emphasis.iconStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"feature.saveAsImage.emphasis.iconStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"feature.saveAsImage.emphasis.iconStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"feature.saveAsImage.emphasis.iconStyle.textPosition":{desc:'<p>文本位置,<code class="codespan">'left'</code> / <code class="codespan">'right'</code> / <code class="codespan">'top'</code> / <code class="codespan">'bottom'</code>。</p>\n'},"feature.saveAsImage.emphasis.iconStyle.textFill":{desc:'\n\n<p>文本颜色,如果未设定,则依次取图标 emphasis 时候的填充色、描边色,如果都不存在,则为 <code class="codespan">'#000'</code>。</p>\n',uiControl:{type:"color"}},"feature.saveAsImage.emphasis.iconStyle.textAlign":{desc:'\n\n<p>文本对齐方式,<code class="codespan">'left'</code> / <code class="codespan">'center'</code> / <code class="codespan">'right'</code>。</p>\n',uiControl:{type:"enum",options:"left,center,right"}},"feature.saveAsImage.emphasis.iconStyle.textBackgroundColor":{desc:"\n\n<p>文本区域填充色。</p>\n",uiControl:{type:"color"}},"feature.saveAsImage.emphasis.iconStyle.textBorderRadius":{desc:"\n\n<p>文本区域圆角大小。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT,RB,LB"}},"feature.saveAsImage.emphasis.iconStyle.textPadding":{desc:"\n\n<p>文本区域内边距。</p>\n",uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"feature.saveAsImage.pixelRatio":{desc:"\n\n<p>保存图片的分辨率比例,默认跟容器相同大小,如果需要保存更高分辨率的,可以设置为大于 1 的值,例如 2。</p>\n",uiControl:{type:"number",min:"0.5",max:"5",step:"0.5"}},"feature.restore":{desc:"<p>配置项还原。</p>\n"},"feature.restore.show":{desc:"<p>是否显示该工具。</p>\n"},"feature.restore.icon":{desc:'<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>'},"feature.restore.iconStyle":{desc:'<p>还原 icon 样式设置。由于 icon 的文本信息只在 icon hover 时候才显示,所以文字相关的配置项请在 <code class="codespan">emphasis</code> 下设置。</p>\n'},"feature.restore.iconStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"feature.restore.iconStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"feature.restore.iconStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"feature.restore.iconStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"feature.restore.iconStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"feature.restore.iconStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"feature.restore.iconStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"feature.restore.iconStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"feature.restore.iconStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"feature.restore.emphasis.iconStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"feature.restore.emphasis.iconStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"feature.restore.emphasis.iconStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"feature.restore.emphasis.iconStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"feature.restore.emphasis.iconStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"feature.restore.emphasis.iconStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"feature.restore.emphasis.iconStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"feature.restore.emphasis.iconStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"feature.restore.emphasis.iconStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"feature.restore.emphasis.iconStyle.textPosition":{desc:'<p>文本位置,<code class="codespan">'left'</code> / <code class="codespan">'right'</code> / <code class="codespan">'top'</code> / <code class="codespan">'bottom'</code>。</p>\n'},"feature.restore.emphasis.iconStyle.textFill":{desc:'\n\n<p>文本颜色,如果未设定,则依次取图标 emphasis 时候的填充色、描边色,如果都不存在,则为 <code class="codespan">'#000'</code>。</p>\n',uiControl:{type:"color"}},"feature.restore.emphasis.iconStyle.textAlign":{desc:'\n\n<p>文本对齐方式,<code class="codespan">'left'</code> / <code class="codespan">'center'</code> / <code class="codespan">'right'</code>。</p>\n',uiControl:{type:"enum",options:"left,center,right"}},"feature.restore.emphasis.iconStyle.textBackgroundColor":{desc:"\n\n<p>文本区域填充色。</p>\n",uiControl:{type:"color"}},"feature.restore.emphasis.iconStyle.textBorderRadius":{desc:"\n\n<p>文本区域圆角大小。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT,RB,LB"}},"feature.restore.emphasis.iconStyle.textPadding":{desc:"\n\n<p>文本区域内边距。</p>\n",uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"feature.dataView":{desc:"<p>数据视图工具,可以展现当前图表所用的数据,编辑后可以动态更新。</p>\n"},"feature.dataView.show":{desc:"<p>是否显示该工具。</p>\n"},"feature.dataView.icon":{desc:'<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>'},"feature.dataView.iconStyle":{desc:'<p>数据视图 icon 样式设置。由于 icon 的文本信息只在 icon hover 时候才显示,所以文字相关的配置项请在 <code class="codespan">emphasis</code> 下设置。</p>\n'},"feature.dataView.iconStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"feature.dataView.iconStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"feature.dataView.iconStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"feature.dataView.iconStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"feature.dataView.iconStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"feature.dataView.iconStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"feature.dataView.iconStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"feature.dataView.iconStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"feature.dataView.iconStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"feature.dataView.emphasis.iconStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"feature.dataView.emphasis.iconStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"feature.dataView.emphasis.iconStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"feature.dataView.emphasis.iconStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"feature.dataView.emphasis.iconStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"feature.dataView.emphasis.iconStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"feature.dataView.emphasis.iconStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"feature.dataView.emphasis.iconStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"feature.dataView.emphasis.iconStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"feature.dataView.emphasis.iconStyle.textPosition":{desc:'<p>文本位置,<code class="codespan">'left'</code> / <code class="codespan">'right'</code> / <code class="codespan">'top'</code> / <code class="codespan">'bottom'</code>。</p>\n'},"feature.dataView.emphasis.iconStyle.textFill":{desc:'\n\n<p>文本颜色,如果未设定,则依次取图标 emphasis 时候的填充色、描边色,如果都不存在,则为 <code class="codespan">'#000'</code>。</p>\n',uiControl:{type:"color"}},"feature.dataView.emphasis.iconStyle.textAlign":{desc:'\n\n<p>文本对齐方式,<code class="codespan">'left'</code> / <code class="codespan">'center'</code> / <code class="codespan">'right'</code>。</p>\n',uiControl:{type:"enum",options:"left,center,right"}},"feature.dataView.emphasis.iconStyle.textBackgroundColor":{desc:"\n\n<p>文本区域填充色。</p>\n",uiControl:{type:"color"}},"feature.dataView.emphasis.iconStyle.textBorderRadius":{desc:"\n\n<p>文本区域圆角大小。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT,RB,LB"}},"feature.dataView.emphasis.iconStyle.textPadding":{desc:"\n\n<p>文本区域内边距。</p>\n",uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"feature.dataView.readOnly":{desc:"\n\n<p>是否不可编辑(只读)。</p>\n",uiControl:{type:"boolean"}},"feature.dataView.optionToContent":{desc:'<pre><code class="lang-js">(option:Object) => HTMLDomElement|string\n</code></pre>\n<p>自定义 dataView 展现函数,用以取代默认的 textarea 使用更丰富的数据编辑。可以返回 dom 对象或者 html 字符串。</p>\n<p>如下示例使用表格展现数据值:</p>\n<pre><code class="lang-js">optionToContent: function(opt) {\n var axisData = opt.xAxis[0].data;\n var series = opt.series;\n var table = '<table style="width:100%;text-align:center"><tbody><tr>'\n + '<td>时间</td>'\n + '<td>' + series[0].name + '</td>'\n + '<td>' + series[1].name + '</td>'\n + '</tr>';\n for (var i = 0, l = axisData.length; i < l; i++) {\n table += '<tr>'\n + '<td>' + axisData[i] + '</td>'\n + '<td>' + series[0].data[i] + '</td>'\n + '<td>' + series[1].data[i] + '</td>'\n + '</tr>';\n }\n table += '</tbody></table>';\n return table;\n}\n</code></pre>\n'},"feature.dataView.contentToOption":{desc:'<pre><code class="lang-js">(container:HTMLDomElement, option:Object) => Object\n</code></pre>\n<p>在使用 optionToContent 的情况下,如果支持数据编辑后的刷新,需要自行通过该函数实现组装 option 的逻辑。</p>\n'},"feature.dataView.lang":{desc:'<p>数据视图上有三个话术,默认是<code class="codespan">['数据视图', '关闭', '刷新']</code>。</p>\n'},"feature.dataView.backgroundColor":{desc:"\n\n<p>数据视图浮层背景色。</p>\n",uiControl:{type:"color",default:"#fff"}},"feature.dataView.textareaColor":{desc:"\n\n<p>数据视图浮层文本输入区背景色。</p>\n",uiControl:{type:"color",default:"#fff"}},"feature.dataView.textareaBorderColor":{desc:"\n\n<p>数据视图浮层文本输入区边框颜色。</p>\n",uiControl:{type:"color",default:"#333"}},"feature.dataView.textColor":{desc:"\n\n<p>文本颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"feature.dataView.buttonColor":{desc:"\n\n<p>按钮颜色。</p>\n",uiControl:{type:"color",default:"#c23531"}},"feature.dataView.buttonTextColor":{desc:"\n\n<p>按钮文本颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"feature.dataZoom":{desc:"<p>数据区域缩放。目前只支持直角坐标系的缩放。</p>\n"},"feature.dataZoom.show":{desc:"<p>是否显示该工具。</p>\n"},"feature.dataZoom.title":{desc:"<p>缩放和还原的标题文本。</p>\n"},"feature.dataZoom.icon":{desc:"<p>缩放和还原的 icon path。</p>\n"},"feature.dataZoom.icon.zoom":{desc:'<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>'},"feature.dataZoom.icon.back":{desc:'<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>'},"feature.dataZoom.iconStyle":{desc:'<p>数据区域缩放 icon 样式设置。由于 icon 的文本信息只在 icon hover 时候才显示,所以文字相关的配置项请在 <code class="codespan">emphasis</code> 下设置。</p>\n'},"feature.dataZoom.iconStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"feature.dataZoom.iconStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"feature.dataZoom.iconStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"feature.dataZoom.iconStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"feature.dataZoom.iconStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"feature.dataZoom.iconStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"feature.dataZoom.iconStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"feature.dataZoom.iconStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"feature.dataZoom.iconStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"feature.dataZoom.emphasis.iconStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"feature.dataZoom.emphasis.iconStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"feature.dataZoom.emphasis.iconStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"feature.dataZoom.emphasis.iconStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"feature.dataZoom.emphasis.iconStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"feature.dataZoom.emphasis.iconStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"feature.dataZoom.emphasis.iconStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"feature.dataZoom.emphasis.iconStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"feature.dataZoom.emphasis.iconStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"feature.dataZoom.emphasis.iconStyle.textPosition":{desc:'<p>文本位置,<code class="codespan">'left'</code> / <code class="codespan">'right'</code> / <code class="codespan">'top'</code> / <code class="codespan">'bottom'</code>。</p>\n'},"feature.dataZoom.emphasis.iconStyle.textFill":{desc:'\n\n<p>文本颜色,如果未设定,则依次取图标 emphasis 时候的填充色、描边色,如果都不存在,则为 <code class="codespan">'#000'</code>。</p>\n',uiControl:{type:"color"}},"feature.dataZoom.emphasis.iconStyle.textAlign":{desc:'\n\n<p>文本对齐方式,<code class="codespan">'left'</code> / <code class="codespan">'center'</code> / <code class="codespan">'right'</code>。</p>\n',uiControl:{type:"enum",options:"left,center,right"}},"feature.dataZoom.emphasis.iconStyle.textBackgroundColor":{desc:"\n\n<p>文本区域填充色。</p>\n",uiControl:{type:"color"}},"feature.dataZoom.emphasis.iconStyle.textBorderRadius":{desc:"\n\n<p>文本区域圆角大小。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT,RB,LB"}},"feature.dataZoom.emphasis.iconStyle.textPadding":{desc:"\n\n<p>文本区域内边距。</p>\n",uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"feature.dataZoom.filterMode":{desc:'<p>与 <a href="#dataZoom.filterMode">dataZoom.filterMode</a> 含义和取值相同。</p>\n'},"feature.dataZoom.xAxisIndex":{desc:'<p>指定哪些 <a href="#xAxis">xAxis</a> 被控制。如果缺省则控制所有的x轴。如果设置为 <code class="codespan">false</code> 则不控制任何x轴。如果设置成 <code class="codespan">3</code> 则控制 axisIndex 为 <code class="codespan">3</code> 的x轴。如果设置为 <code class="codespan">[0, 3]</code> 则控制 axisIndex 为 <code class="codespan">0</code> 和 <code class="codespan">3</code> 的x轴。</p>\n'},"feature.dataZoom.yAxisIndex":{desc:'<p>指定哪些 <a href="#yAxis">yAxis</a> 被控制。如果缺省则控制所有的y轴。如果设置为 <code class="codespan">false</code> 则不控制任何y轴。如果设置成 <code class="codespan">3</code> 则控制 axisIndex 为 <code class="codespan">3</code> 的y轴。如果设置为 <code class="codespan">[0, 3]</code> 则控制 axisIndex 为 <code class="codespan">0</code> 和 <code class="codespan">3</code> 的y轴。</p>\n'},"feature.dataZoom.brushStyle":{desc:"<p>刷选框样式</p>\n"},"feature.dataZoom.brushStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"feature.dataZoom.brushStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"feature.dataZoom.brushStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"feature.dataZoom.brushStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"feature.dataZoom.brushStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"feature.dataZoom.brushStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"feature.dataZoom.brushStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"feature.dataZoom.brushStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"feature.dataZoom.brushStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"feature.magicType":{desc:'<p>动态类型切换\n<strong>示例:</strong></p>\n<pre><code class="lang-js">feature: {\n magicType: {\n type: ['line', 'bar', 'stack', 'tiled']\n }\n}\n</code></pre>\n'},"feature.magicType.show":{desc:"<p>是否显示该工具。</p>\n"},"feature.magicType.type":{desc:'<p>启用的动态类型,包括<code class="codespan">'line'</code>(切换为折线图), <code class="codespan">'bar'</code>(切换为柱状图), <code class="codespan">'stack'</code>(切换为堆叠模式), <code class="codespan">'tiled'</code>(切换为平铺模式)。</p>\n'},"feature.magicType.title":{desc:"<p>各个类型的标题文本,可以分别配置。</p>\n"},"feature.magicType.icon":{desc:"<p>各个类型的 icon path,可以分别配置。</p>\n"},"feature.magicType.icon.line":{desc:'<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>'},"feature.magicType.icon.bar":{desc:'<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>'},"feature.magicType.icon.stack":{desc:'<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>'},"feature.magicType.icon.tiled":{desc:'<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>'},"feature.magicType.iconStyle":{desc:'<p>动态类型切换 icon 样式设置。由于 icon 的文本信息只在 icon hover 时候才显示,所以文字相关的配置项请在 <code class="codespan">emphasis</code> 下设置。</p>\n'},"feature.magicType.iconStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"feature.magicType.iconStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"feature.magicType.iconStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"feature.magicType.iconStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"feature.magicType.iconStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"feature.magicType.iconStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"feature.magicType.iconStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"feature.magicType.iconStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"feature.magicType.iconStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"feature.magicType.emphasis.iconStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"feature.magicType.emphasis.iconStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"feature.magicType.emphasis.iconStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"feature.magicType.emphasis.iconStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"feature.magicType.emphasis.iconStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"feature.magicType.emphasis.iconStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"feature.magicType.emphasis.iconStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"feature.magicType.emphasis.iconStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"feature.magicType.emphasis.iconStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"feature.magicType.emphasis.iconStyle.textPosition":{desc:'<p>文本位置,<code class="codespan">'left'</code> / <code class="codespan">'right'</code> / <code class="codespan">'top'</code> / <code class="codespan">'bottom'</code>。</p>\n'},"feature.magicType.emphasis.iconStyle.textFill":{desc:'\n\n<p>文本颜色,如果未设定,则依次取图标 emphasis 时候的填充色、描边色,如果都不存在,则为 <code class="codespan">'#000'</code>。</p>\n',uiControl:{type:"color"}},"feature.magicType.emphasis.iconStyle.textAlign":{desc:'\n\n<p>文本对齐方式,<code class="codespan">'left'</code> / <code class="codespan">'center'</code> / <code class="codespan">'right'</code>。</p>\n',uiControl:{type:"enum",options:"left,center,right"}},"feature.magicType.emphasis.iconStyle.textBackgroundColor":{desc:"\n\n<p>文本区域填充色。</p>\n",uiControl:{type:"color"}},"feature.magicType.emphasis.iconStyle.textBorderRadius":{desc:"\n\n<p>文本区域圆角大小。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT,RB,LB"}},"feature.magicType.emphasis.iconStyle.textPadding":{desc:"\n\n<p>文本区域内边距。</p>\n",uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"feature.magicType.option":{desc:"<p>各个类型的专有配置项。在切换到某类型的时候会合并相应的配置项。</p>\n"},"feature.magicType.seriesIndex":{desc:"<p>各个类型对应的系列的列表。</p>\n"},"feature.brush":{desc:'<p>选框组件的控制按钮。</p>\n<p>也可以不在这里指定,而是在 <a href="#brush.toolbox">brush.toolbox</a> 中指定。</p>\n'},"feature.brush.type":{desc:'<p>使用的按钮,取值:</p>\n<ul>\n<li><code class="codespan">'rect'</code>:开启矩形选框选择功能。</li>\n<li><code class="codespan">'polygon'</code>:开启任意形状选框选择功能。</li>\n<li><code class="codespan">'lineX'</code>:开启横向选择功能。</li>\n<li><code class="codespan">'lineY'</code>:开启纵向选择功能。</li>\n<li><code class="codespan">'keep'</code>:切换『单选』和『多选』模式。后者可支持同时画多个选框。前者支持单击清除所有选框。</li>\n<li><code class="codespan">'clear'</code>:清空所有选框。</li>\n</ul>\n'},"feature.brush.icon":{desc:"<p>每个按钮的 icon path。</p>\n"},"feature.brush.icon.rect":{desc:'<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>'},"feature.brush.icon.polygon":{desc:'<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>'},"feature.brush.icon.lineX":{desc:'<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>'},"feature.brush.icon.lineY":{desc:'<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>'},"feature.brush.icon.keep":{desc:'<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>'},"feature.brush.icon.clear":{desc:'<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>'},"feature.brush.title":{desc:"<p>标题文本。</p>\n"},iconStyle:{desc:'<p>公用的 icon 样式设置。由于 icon 的文本信息只在 icon hover 时候才显示,所以文字相关的配置项请在 <code class="codespan">emphasis</code> 下设置。</p>\n'},"iconStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"iconStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"iconStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"iconStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"iconStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"iconStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"iconStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"iconStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"iconStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"emphasis.iconStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"emphasis.iconStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"emphasis.iconStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"emphasis.iconStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"emphasis.iconStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"emphasis.iconStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"emphasis.iconStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"emphasis.iconStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"emphasis.iconStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"emphasis.iconStyle.textPosition":{desc:'<p>文本位置,<code class="codespan">'left'</code> / <code class="codespan">'right'</code> / <code class="codespan">'top'</code> / <code class="codespan">'bottom'</code>。</p>\n'},"emphasis.iconStyle.textFill":{desc:'\n\n<p>文本颜色,如果未设定,则依次取图标 emphasis 时候的填充色、描边色,如果都不存在,则为 <code class="codespan">'#000'</code>。</p>\n',uiControl:{type:"color"}},"emphasis.iconStyle.textAlign":{desc:'\n\n<p>文本对齐方式,<code class="codespan">'left'</code> / <code class="codespan">'center'</code> / <code class="codespan">'right'</code>。</p>\n',uiControl:{type:"enum",options:"left,center,right"}},"emphasis.iconStyle.textBackgroundColor":{desc:"\n\n<p>文本区域填充色。</p>\n",uiControl:{type:"color"}},"emphasis.iconStyle.textBorderRadius":{desc:"\n\n<p>文本区域圆角大小。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT,RB,LB"}},"emphasis.iconStyle.textPadding":{desc:"\n\n<p>文本区域内边距。</p>\n",uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},zlevel:{desc:'<p>所有图形的 zlevel 值。</p>\n<p><code class="codespan">zlevel</code>用于 Canvas 分层,不同<code class="codespan">zlevel</code>值的图形会放置在不同的 Canvas 中,Canvas 分层是一种常见的优化手段。我们可以把一些图形变化频繁(例如有动画)的组件设置成一个单独的<code class="codespan">zlevel</code>。需要注意的是过多的 Canvas 会引起内存开销的增大,在手机端上需要谨慎使用以防崩溃。</p>\n<p><code class="codespan">zlevel</code> 大的 Canvas 会放在 <code class="codespan">zlevel</code> 小的 Canvas 的上面。</p>\n'},z:{desc:'<p>组件的所有图形的<code class="codespan">z</code>值。控制图形的前后顺序。<code class="codespan">z</code>值小的图形会被<code class="codespan">z</code>值大的图形覆盖。</p>\n<p><code class="codespan">z</code>相比<code class="codespan">zlevel</code>优先级更低,而且不会创建新的 Canvas。</p>\n'},left:{desc:'\n\n<p>工具栏组件离容器左侧的距离。</p>\n<p><code class="codespan">left</code> 的值可以是像 <code class="codespan">20</code> 这样的具体像素值,可以是像 <code class="codespan">'20%'</code> 这样相对于容器高宽的百分比,也可以是 <code class="codespan">'left'</code>, <code class="codespan">'center'</code>, <code class="codespan">'right'</code>。</p>\n<p>如果 <code class="codespan">left</code> 的值为<code class="codespan">'left'</code>, <code class="codespan">'center'</code>, <code class="codespan">'right'</code>,组件会根据相应的位置自动对齐。</p>\n',uiControl:{type:"percent",default:"0%"}},top:{desc:'\n\n<p>工具栏组件离容器上侧的距离。</p>\n<p><code class="codespan">top</code> 的值可以是像 <code class="codespan">20</code> 这样的具体像素值,可以是像 <code class="codespan">'20%'</code> 这样相对于容器高宽的百分比,也可以是 <code class="codespan">'top'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'bottom'</code>。</p>\n<p>如果 <code class="codespan">top</code> 的值为<code class="codespan">'top'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'bottom'</code>,组件会根据相应的位置自动对齐。</p>\n',uiControl:{type:"percent",default:"0%"}},right:{desc:'\n\n<p>工具栏组件离容器右侧的距离。</p>\n<p><code class="codespan">right</code> 的值可以是像 <code class="codespan">20</code> 这样的具体像素值,可以是像 <code class="codespan">'20%'</code> 这样相对于容器高宽的百分比。</p>\n<p>默认自适应。</p>\n',uiControl:{type:"percent",default:"0%"}},bottom:{desc:'\n\n<p>工具栏组件离容器下侧的距离。</p>\n<p>bottom 的值可以是像 <code class="codespan">20</code> 这样的具体像素值,可以是像 <code class="codespan">'20%'</code> 这样相对于容器高宽的百分比。</p>\n<p>默认自适应。</p>\n',uiControl:{type:"percent",default:"0%"}},width:{desc:"\n\n<p>工具栏组件的宽度。默认自适应。</p>\n",uiControl:{type:"percent",default:"50%"}},height:{desc:"\n\n<p>工具栏组件的高度。默认自适应。</p>\n",uiControl:{type:"percent",default:"50%"}},tooltip:{desc:'<p>工具箱的 tooltip 配置,配置项同 <a href="#tooltip">tooltip</a>。默认不显示,可以在需要特殊定制文字样式(尤其是想用自定义 CSS 控制文字样式)的时候开启 tooltip,如下示例:</p>\n<pre><code class="lang-js">option = {\n tooltip: {\n show: true // 必须引入 tooltip 组件\n },\n toolbox: {\n show: true,\n showTitle: false, // 隐藏默认文字,否则两者位置会重叠\n feature: {\n saveAsImage: {\n show: true,\n title: 'Save As Image'\n },\n dataView: {\n show: true,\n title: 'Data View'\n },\n },\n tooltip: { // 和 option.tooltip 的配置项相同\n show: true,\n formatter: function (param) {\n return return '<div>' + param.title + '</div>'; // 自定义的 DOM 结构\n },\n backgroundColor: '#222',\n textStyle: {\n fontSize: 12,\n },\n extraCssText: 'box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);' // 自定义的 CSS 样式\n }\n },\n ...\n}\n</code></pre>\n'}})},{title:"位置",body:[(0,a.viewport)("toolbox.","标题")]}]}}));
|
||
;/*!examples/components/EChartsEditor/Series.tsx*/
|
||
amis.define("321a637",(function(e,n,o,c){"use strict";Object.defineProperty(n,"__esModule",{value:!0});var a=e("b666d70"),s=function(e,n){return{type:"container",visibleOn:'this.type == "'.concat(e,'"'),body:(0,a.buildOptions)("",n)}};n.default={type:"combo",name:"series",tabsMode:!0,tabsLabelTpl:"系列${index|plus}",lazyLoad:!0,label:"",multiLine:!0,multiple:!0,addButtonText:"新增系列",items:[(0,a.select)("type","图表类型",["line","bar","pie","radar","funnel","gauge"]),{type:"input-array",name:"data",label:"数据",items:{type:"input-number"}},s("line",{id:{desc:"<p>组件 ID。默认不指定。指定则可用于在 option 或者 API 中引用组件。</p>\n"},name:{desc:'<p>系列名称,用于<a href="#tooltip">tooltip</a>的显示,<a href="#legend">legend</a> 的图例筛选,在 <code class="codespan">setOption</code> 更新数据和配置项时用于指定对应的系列。</p>\n'},coordinateSystem:{desc:'<p>该系列使用的坐标系,可选:</p>\n<ul>\n<li><p><code class="codespan">'cartesian2d'</code></p>\n<p> 使用二维的直角坐标系(也称笛卡尔坐标系),通过 <a href="#series-bar.xAxisIndex">xAxisIndex</a>, <a href="#series-bar.yAxisIndex">yAxisIndex</a>指定相应的坐标轴组件。</p>\n</li>\n</ul>\n<ul>\n<li><p><code class="codespan">'polar'</code></p>\n<p> 使用极坐标系,通过 <a href="#series-bar.polarIndex">polarIndex</a> 指定相应的极坐标组件</p>\n</li>\n</ul>\n'},xAxisIndex:{desc:'<p>使用的 <a href="#xAxis">x 轴</a>的 index,在单个图表实例中存在多个 x 轴的时候有用。</p>\n'},yAxisIndex:{desc:'<p>使用的 <a href="#yAxis">y 轴</a>的 index,在单个图表实例中存在多个 y轴的时候有用。</p>\n'},polarIndex:{desc:'<p>使用的<a href="#polar">极坐标系</a>的 index,在单个图表实例中存在多个极坐标系的时候有用。</p>\n'},symbol:{desc:'\n\n<p>标记的图形。</p>\n<p>ECharts 提供的标记类型包括</p>\n<p><code class="codespan">'circle'</code>, <code class="codespan">'rect'</code>, <code class="codespan">'roundRect'</code>, <code class="codespan">'triangle'</code>, <code class="codespan">'diamond'</code>, <code class="codespan">'pin'</code>, <code class="codespan">'arrow'</code>, <code class="codespan">'none'</code></p>\n<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre><p>如果需要每个数据的图形不一样,可以设置为如下格式的回调函数:</p>\n<pre><code class="lang-js">(value: Array|number, params: Object) => string\n</code></pre>\n<p>其中第一个参数 <code class="codespan">value</code> 为 <a href="#series-line.data">data</a> 中的数据值。第二个参数<code class="codespan">params</code> 是其它的数据项参数。</p>\n',uiControl:{type:"icon",default:"circle"}},symbolSize:{desc:'\n\n<p>标记的大小,可以设置成诸如 <code class="codespan">10</code> 这样单一的数字,也可以用数组分开表示宽和高,例如 <code class="codespan">[20, 10]</code> 表示标记宽为<code class="codespan">20</code>,高为<code class="codespan">10</code>。</p>\n<p>如果需要每个数据的图形大小不一样,可以设置为如下格式的回调函数:</p>\n<pre><code class="lang-js">(value: Array|number, params: Object) => number|Array\n</code></pre>\n<p>其中第一个参数 <code class="codespan">value</code> 为 <a href="#series-line.data">data</a> 中的数据值。第二个参数<code class="codespan">params</code> 是其它的数据项参数。</p>\n',uiControl:{type:"number",min:"0"}},symbolRotate:{desc:'\n\n<p>标记的旋转角度(而非弧度)。正值表示逆时针旋转。注意在 <code class="codespan">markLine</code> 中当 <code class="codespan">symbol</code> 为 <code class="codespan">'arrow'</code> 时会忽略 <code class="codespan">symbolRotate</code> 强制设置为切线的角度。</p>\n<p>如果需要每个数据的旋转角度不一样,可以设置为如下格式的回调函数:</p>\n<pre><code class="lang-js">(value: Array|number, params: Object) => number\n</code></pre>\n<p>其中第一个参数 <code class="codespan">value</code> 为 <a href="#series-line.data">data</a> 中的数据值。第二个参数<code class="codespan">params</code> 是其它的数据项参数。</p>\n<blockquote>\n<p>从 4.8.0 开始支持回调函数。</p>\n</blockquote>\n',uiControl:{type:"angle",min:"-180",max:"180",step:"1"}},symbolKeepAspect:{desc:'\n\n<p>如果 <code class="codespan">symbol</code> 是 <code class="codespan">path://</code> 的形式,是否在缩放时保持该图形的长宽比。</p>\n',uiControl:{type:"boolean",clean:"true"}},symbolOffset:{desc:'\n\n<p>标记相对于原本位置的偏移。默认情况下,标记会居中置放在数据对应的位置,但是如果 symbol 是自定义的矢量路径或者图片,就有可能不希望 symbol 居中。这时候可以使用该配置项配置 symbol 相对于原本居中的偏移,可以是绝对的像素值,也可以是相对的百分比。</p>\n<p>例如 <code class="codespan">[0, '50%']</code> 就是把自己向上移动了一半的位置,在 symbol 图形是气泡的时候可以让图形下端的箭头对准数据点。</p>\n',uiControl:{type:"vector",separate:"true",dims:"x,y"}},showSymbol:{desc:'\n\n<p>是否显示 symbol, 如果 <code class="codespan">false</code> 则只有在 tooltip hover 的时候显示。</p>\n',uiControl:{type:"boolean",default:"true"}},showAllSymbol:{desc:'\n\n<p>只在主轴为类目轴(<code class="codespan">axis.type</code> 为 <code class="codespan">'category'</code>)时有效。\n可选值:</p>\n<ul>\n<li><code class="codespan">'auto'</code>:默认,如果有足够空间则显示标志图形,否则随主轴标签间隔隐藏策略。</li>\n<li><code class="codespan">true</code>:显示所有图形。</li>\n<li><code class="codespan">false</code>:随主轴标签间隔隐藏策略。</li>\n</ul>\n',uiControl:{type:"boolean"}},legendHoverLink:{desc:'\n\n<p>是否启用<a href="#legend">图例</a> hover 时的联动高亮。</p>\n',uiControl:{type:"boolean",default:"true"}},stack:{desc:'<p>数据堆叠,同个类目轴上系列配置相同的<code class="codespan">stack</code>值后,后一个系列的值会在前一个系列的值上相加。</p>\n<p>下面示例可以通过右上角 <a href="#toolbox">toolbox</a> 中的堆叠切换看效果:</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/line-stack-tiled&edit=1&reset=1" width="600" height="400"><iframe />\n\n\n\n'},cursor:{desc:'\n\n<p>鼠标悬浮时在图形元素上时鼠标的样式是什么。同 CSS 的 <code class="codespan">cursor</code>。</p>\n',uiControl:{type:"enum",options:"auto,pointer,move",default:"pointer"}},connectNulls:{desc:"\n\n<p>是否连接空数据。</p>\n",uiControl:{type:"boolean"}},clip:{desc:'\n\n\n\n<blockquote>\n<p>从 <code class="codespan">v4.4.0</code> 开始支持</p>\n</blockquote>\n<p>是否裁剪超出坐标系部分的图形,具体裁剪效果根据系列决定:</p>\n<ul>\n<li>散点图:忽略中心点超出坐标系的图形,但是不裁剪单个图形</li>\n<li>柱状图:裁掉完全超出的柱子,但是不会裁剪只超出部分的柱子</li>\n<li>折线图:裁掉所有超出坐标系的折线部分,拐点图形的逻辑按照散点图处理</li>\n<li>路径图:裁掉所有超出坐标系的部分</li>\n<li>K 线图:忽略整体都超出坐标系的图形,但是不裁剪单个图形</li>\n<li>自定义系列:裁掉所有超出坐标系的部分</li>\n</ul>\n<p>除了自定义系列,其它系列的默认值都为 true,及开启裁剪,如果你觉得不想要裁剪的话,可以设置成 false 关闭。</p>\n',uiControl:{type:"boolean",default:"true"}},step:{desc:'\n\n<p>是否是阶梯线图。可以设置为 <code class="codespan">true</code> 显示成阶梯线图,也支持设置成 <code class="codespan">'start'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'end'</code> 分别配置在当前点,当前点与下个点的中间点,下个点拐弯。</p>\n<p>不同的配置效果如下:</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=line-step&edit=1&reset=1" width="600" height="400"><iframe />\n\n',uiControl:{type:"enum",options:"start,middle,end"}},label:{desc:"<p>图形上的文本标签,可用于说明图形的一些数据信息,比如值,名称等。</p>\n"},"label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {@score}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},endLabel:{desc:"<p>折线端点的标签。</p>\n"},"endLabel.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"endLabel.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"endLabel.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"endLabel.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"endLabel.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"endLabel.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {@score}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"endLabel.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"endLabel.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"endLabel.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"endLabel.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"endLabel.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"endLabel.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"endLabel.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"endLabel.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"endLabel.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"endLabel.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"endLabel.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"endLabel.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"endLabel.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"endLabel.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"endLabel.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"endLabel.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"endLabel.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"endLabel.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"endLabel.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"endLabel.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"endLabel.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"endLabel.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"endLabel.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"endLabel.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"endLabel.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"endLabel.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"endLabel.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"endLabel.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"endLabel.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"endLabel.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"endLabel.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"endLabel.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"endLabel.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"endLabel.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"endLabel.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"endLabel.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"endLabel.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"endLabel.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"endLabel.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"endLabel.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"endLabel.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"endLabel.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"endLabel.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"endLabel.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"endLabel.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"endLabel.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"endLabel.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"endLabel.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"endLabel.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"endLabel.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"endLabel.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"endLabel.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"endLabel.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"endLabel.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"endLabel.valueAnimation":{desc:"<p>是否开启标签的数字动画。</p>\n"},labelLine:{desc:"<p>标签的视觉引导线配置。</p>\n"},"labelLine.show":{desc:"\n\n<p>是否显示视觉引导线。</p>\n",uiControl:{type:"boolean"}},"labelLine.showAbove":{desc:"<p>是否显示在图形上方。</p>\n"},"labelLine.length2":{desc:"\n\n<p>视觉引导项第二段的长度。</p>\n",uiControl:{type:"number",default:"15",min:"0",step:"1"}},"labelLine.smooth":{desc:'\n\n<p>是否平滑视觉引导线,默认不平滑,可以设置成 <code class="codespan">true</code> 平滑显示,也可以设置为 0 到 1 的值,表示平滑程度。</p>\n',uiControl:{type:"boolean"}},"labelLine.minTurnAngle":{desc:"<p>通过调整第二段线的长度,限制引导线两端之间最小的夹角,以防止过小的夹角导致显示不美观。</p>\n<p>可以设置为 0 - 180 度。</p>\n"},"labelLine.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"labelLine.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"labelLine.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"labelLine.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"labelLine.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"labelLine.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"labelLine.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"labelLine.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},labelLayout:{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>标签的统一布局配置。</p>\n<p>该配置项是在每个系列默认的标签布局基础上,统一调整标签的<code class="codespan">(x, y)</code>位置,标签对齐等属性以实现想要的标签布局效果。</p>\n<p>该配置项也可以是一个有如下参数的回调函数</p>\n<pre><code class="lang-js">// 标签对应数据的 dataIndex\ndataIndex: number\n// 标签对应的数据类型,只在关系图中会有 node 和 edge 数据类型的区分\ndataType?: string\n// 标签对应的系列的 index\nseriesIndex: number\n// 标签显示的文本\ntext: string\n// 默认的标签的包围盒,由系列默认的标签布局决定\nlabelRect: {x: number, y: number, width: number, height: number}\n// 默认的标签水平对齐\nalign: 'left' | 'center' | 'right'\n// 默认的标签垂直对齐\nverticalAlign: 'top' | 'middle' | 'bottom'\n// 标签所对应的数据图形的包围盒,可用于定位标签位置\nrect: {x: number, y: number, width: number, height: number}\n// 默认引导线的位置,目前只有饼图(pie)和漏斗图(funnel)有默认标签位置\n// 如果没有该值则为 null\nlabelLinePoints?: number[][]\n</code></pre>\n<p><strong>示例:</strong></p>\n<p>将标签显示在图形右侧 10px 的位置,并且垂直居中:</p>\n<pre><code class="lang-js">labelLayout(params) {\n return {\n x: params.rect.x + 10,\n y: params.rect.y + params.rect.height / 2,\n verticalAlign: 'middle',\n align: 'left'\n }\n}\n</code></pre>\n<p>根据图形的包围盒尺寸决定文本尺寸</p>\n<pre><code class="lang-js">\nlabelLayout(params) {\n return {\n fontSize: Math.max(params.rect.width / 10, 5)\n };\n}\n</code></pre>\n'},"labelLayout.hideOverlap":{desc:'<p>是否隐藏重叠的标签。</p>\n<p>下面示例演示了在关系图中开启该配置后,在缩放时可以实现自动的标签隐藏。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=graph-label-overlap&edit=1&reset=1" width="600" height="400"><iframe />\n\n'},"labelLayout.moveOverlap":{desc:'<p>在标签重叠的时候是否挪动标签位置以防止重叠。</p>\n<p>目前支持配置为:</p>\n<ul>\n<li><code class="codespan">'shiftX'</code> 水平方向依次位移,在水平方向对齐时使用</li>\n<li><code class="codespan">'shiftY'</code> 垂直方向依次位移,在垂直方向对齐时使用</li>\n</ul>\n<p>下面是标签右对齐并配置垂直方向依次位移以防止重叠的示例。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=scatter-label-align-right&edit=1&reset=1" width="600" height="400"><iframe />\n\n'},"labelLayout.x":{desc:'<p>标签的 x 位置。支持绝对的像素值或者<code class="codespan">'20%'</code>这样的相对值。</p>\n'},"labelLayout.y":{desc:'<p>标签的 y 位置。支持绝对的像素值或者<code class="codespan">'20%'</code>这样的相对值。</p>\n'},"labelLayout.dx":{desc:'<p>标签在 x 方向上的像素偏移。可以和<code class="codespan">x</code>一起使用。</p>\n'},"labelLayout.dy":{desc:'<p>标签在 y 方向上的像素偏移。可以和<code class="codespan">y</code>一起使用</p>\n'},"labelLayout.rotate":{desc:"<p>标签旋转角度。</p>\n"},"labelLayout.width":{desc:'<p>标签显示的宽度。可以配合<code class="codespan">overflow</code>使用控制标签显示在固定宽度内</p>\n'},"labelLayout.height":{desc:'<p>标签显示的高度。可以配合<code class="codespan">lineOverflow</code>使用控制标签显示在固定高度内</p>\n'},"labelLayout.align":{desc:'<p>标签水平对齐方式。可以设置<code class="codespan">'left'</code>, <code class="codespan">'center'</code>, <code class="codespan">'right'</code>。</p>\n'},"labelLayout.verticalAlign":{desc:'<p>标签垂直对齐方式。可以设置<code class="codespan">'top'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'bottom'</code>。</p>\n'},"labelLayout.fontSize":{desc:"<p>The text size of the label.</p>\n"},"labelLayout.draggable":{desc:"<p>标签是否可以允许用户通过拖拽二次调整位置。</p>\n"},"labelLayout.labelLinePoints":{desc:'<p>标签引导线三个点的位置。格式为:</p>\n<pre><code class="lang-js">[[x, y], [x, y], [x, y]]\n</code></pre>\n<p>在饼图中常用来微调已经计算好的引导线,其它情况一般不建议设置。</p>\n'},itemStyle:{desc:"<p>折线拐点标志的样式。</p>\n"},"itemStyle.color":{desc:'\n\n<p>图形的颜色。 默认从全局调色盘 <a href="#color">option.color</a> 获取颜色 </p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n<p>支持使用回调函数。回调函数格式如下:</p>\n<pre><code class="lang-js">(params: Object) => Color\n</code></pre>\n<p>传入的是数据项 <code class="codespan">seriesIndex</code>, <code class="codespan">dataIndex</code>, <code class="codespan">data</code>, <code class="codespan">value</code> 等各个参数。</p>\n',uiControl:{type:"color"}},"itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"itemStyle.decal(Object | 'none')":{desc:'<p>图形的贴花图案,在 <a href="#aria.enabled">aria.enabled</a> 与 <a href="#aria.decal.show">aria.decal.show</a> 都是 <code class="codespan">true</code> 的情况下才生效。</p>\n<p>如果为 <code class="codespan">'none'</code> 表示不使用贴花图案。</p>\n<p>需要在设置了填充样式 <code class="codespan">areaStyle</code> 的情况下才生效。</p>\n'},"itemStyle.decal(Object | 'none').symbol(string|string[]) = 'rect'":{desc:'<p>贴花的图案,如果是 <code class="codespan">string[]</code> 表示循环使用数组中的图案。</p>\n<p>ECharts 提供的标记类型包括</p>\n<p><code class="codespan">'circle'</code>, <code class="codespan">'rect'</code>, <code class="codespan">'roundRect'</code>, <code class="codespan">'triangle'</code>, <code class="codespan">'diamond'</code>, <code class="codespan">'pin'</code>, <code class="codespan">'arrow'</code>, <code class="codespan">'none'</code></p>\n<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>'},"itemStyle.decal(Object | 'none').symbolSize":{desc:'<p>取值范围:<code class="codespan">0</code> 到 <code class="codespan">1</code>,表示占图案区域的百分比。</p>\n'},"itemStyle.decal(Object | 'none').symbolKeepAspect":{desc:"<p>是否保持图案的长宽比。</p>\n"},"itemStyle.decal(Object | 'none').color":{desc:"<p>贴花图案的颜色,建议使用半透明色,这样能叠加在系列本身的颜色上。</p>\n"},"itemStyle.decal(Object | 'none').backgroundColor":{desc:"<p>贴花的背景色,将会覆盖在系列本身颜色之上,贴花图案之下。</p>\n"},"itemStyle.decal(Object | 'none').dashArrayX(number | number[] | (number | number[])[]) = 5":{desc:'<p>贴花图案的基本模式是在横向和纵向上分别以<code class="codespan">图案 - 空白 - 图案 - 空白 - 图案 - 空白</code>的形式无限循环。通过设置每个图案和空白的长度,可以实现复杂的图案效果。</p>\n<p><code class="codespan">dashArrayX</code> 控制了横向的图案模式。当其值为 <code class="codespan">number</code> 或 <code class="codespan">number[]</code> 类型时,与 <a href="https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-dasharray" target="_blank">SVG stroke-dasharray</a> 类似。</p>\n<ul>\n<li><p>如果是 <code class="codespan">number</code> 类型,表示图案和空白分别是这个值。如 <code class="codespan">5</code> 表示先显示宽度为 5 的图案,然后空 5 像素,再然后显示宽度为 5 的图案……</p>\n</li>\n<li><p>如果是 <code class="codespan">number[]</code> 类型,则表示图案和空白依次为数组值的循环。如:<code class="codespan">[5, 10, 2, 6]</code> 表示图案宽 5 像素,然后空 10 像素,然后图案宽 2 像素,然后空 6 像素,然后图案宽 5 像素……</p>\n</li>\n<li><p>如果是 <code class="codespan">(number | number[])[]</code> 类型,表示每行的图案和空白依次为数组值的循环。如:<code class="codespan">[10, [2, 5]]</code> 表示第一行以图案 10 像素空 10 像素循环,第二行以图案 2 像素空 5 像素循环,第三行以图案 10 像素空 10 像素循环……</p>\n</li>\n</ul>\n<p>可以结合以下的例子理解本接口:</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/aria-decal&edit=1&reset=1" width="700" height="300"><iframe />\n\n'},"itemStyle.decal(Object | 'none').dashArrayY(number | number[]) = 5":{desc:'<p>贴花图案的基本模式是在横向和纵向上分别以<code class="codespan">图案 - 空白 - 图案 - 空白 - 图案 - 空白</code>的形式无限循环。通过设置每个图案和空白的长度,可以实现复杂的图案效果。</p>\n<p><code class="codespan">dashArrayY</code> 控制了横向的图案模式。与 <a href="https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-dasharray" target="_blank">SVG stroke-dasharray</a> 类似。</p>\n<ul>\n<li><p>如果是 <code class="codespan">number</code> 类型,表示图案和空白分别是这个值。如 <code class="codespan">5</code> 表示先显示高度为 5 的图案,然后空 5 像素,再然后显示高度为 5 的图案……</p>\n</li>\n<li><p>如果是 <code class="codespan">number[]</code> 类型,则表示图案和空白依次为数组值的循环。如:<code class="codespan">[5, 10, 2, 6]</code> 表示图案高 5 像素,然后空 10 像素,然后图案高 2 像素,然后空 6 像素,然后图案高 5 像素……</p>\n</li>\n</ul>\n<p>可以结合以下的例子理解本接口:</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/aria-decal&edit=1&reset=1" width="700" height="300"><iframe />\n\n'},"itemStyle.decal(Object | 'none').rotation":{desc:'<p>图案的整体旋转角度(弧度制),取值范围从 <code class="codespan">-Math.PI</code> 到 <code class="codespan">Math.PI</code>。</p>\n'},"itemStyle.decal(Object | 'none').maxTileWidth":{desc:"<p>生成的图案在未重复之前的宽度上限。通常不需要设置该值,当你发现图案在重复的时候出现不连续的接缝时,可以尝试提高该值。</p>\n"},"itemStyle.decal(Object | 'none').maxTileHeight":{desc:"<p>生成的图案在未重复之前的高度上限。通常不需要设置该值,当你发现图案在重复的时候出现不连续的接缝时,可以尝试提高该值。</p>\n"},lineStyle:{desc:'<p>线条样式。</p>\n<p><strong>注:</strong> 修改 <code class="codespan">lineStyle</code> 中的颜色不会影响图例颜色,如果需要图例颜色和折线图颜色一致,需修改 <a href="#series-line.itemStyle.color">itemStyle.color</a>,线条颜色默认也会取该颜色。</p>\n'},"lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"2",min:"0",step:"0.5"}},"lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},areaStyle:{desc:"<p>区域填充样式。设置后显示成区域面积图。</p>\n"},"areaStyle.color":{desc:'\n\n<p>填充的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"areaStyle.origin":{desc:'<p>图形区域的起始位置。</p>\n<p>默认情况下,图形会从坐标轴轴线到数据间进行填充。如果需要填充的区域是坐标轴最大值到数据间,或者坐标轴最小值到数据间,则可以通过这个配置项进行设置。</p>\n<p>可选值包括 <code class="codespan">'auto'</code>(默认值)、 <code class="codespan">'start'</code>、 <code class="codespan">'end'</code>。</p>\n<ul>\n<li><code class="codespan">'auto'</code> 填充坐标轴轴线到数据间的区域;</li>\n<li><code class="codespan">'start'</code> 填充坐标轴底部(非 <code class="codespan">inverse</code> 情况是最小值)到数据间的区域;</li>\n<li><code class="codespan">'end'</code> 填充坐标轴顶部(非 <code class="codespan">inverse</code> 情况是最大值)到数据间的区域。</li>\n</ul>\n'},"areaStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"areaStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"areaStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"areaStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"areaStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},emphasis:{desc:"<p>折线图的高亮状态。</p>\n"},"emphasis.scale":{desc:"<p>是否开启 hover 在拐点标志上的放大效果。</p>\n"},"emphasis.focus":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>在高亮图形时,是否淡出其它数据的图形已达到聚焦的效果。支持如下配置:</p>\n<ul>\n<li><code class="codespan">'none'</code> 不淡出其它图形,默认使用该配置。</li>\n<li><code class="codespan">'self'</code> 只聚焦(不淡出)当前高亮的数据的图形。</li>\n<li><code class="codespan">'series'</code> 聚焦当前高亮的数据所在的系列的所有图形。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<p>下面代码配置了柱状图在高亮一个图形的时候,淡出当前直角坐标系所有其它的系列。</p>\n<pre><code class="lang-js">emphasis: {\n focus: 'series',\n blurScope: 'coordinateSystem'\n}\n</code></pre>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-y-category-stack&reset=1&edit=1" width="600" height="400"><iframe />\n\n'},"emphasis.blurScope":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>在开启<code class="codespan">focus</code>的时候,可以通过<code class="codespan">blurScope</code>配置淡出的范围。支持如下配置</p>\n<ul>\n<li><code class="codespan">'coordinateSystem'</code> 淡出范围为坐标系,默认使用该配置。</li>\n<li><code class="codespan">'series'</code> 淡出范围为系列。</li>\n<li><code class="codespan">'global'</code> 淡出范围为全局。</li>\n</ul>\n'},"emphasis.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"emphasis.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"emphasis.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"emphasis.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"emphasis.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"emphasis.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {@score}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"emphasis.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"emphasis.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"emphasis.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"emphasis.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"emphasis.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"emphasis.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"emphasis.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"emphasis.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"emphasis.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"emphasis.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"emphasis.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"emphasis.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"emphasis.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"emphasis.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"emphasis.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"emphasis.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"emphasis.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"emphasis.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"emphasis.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"emphasis.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"emphasis.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"emphasis.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"emphasis.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"emphasis.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"emphasis.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"emphasis.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"emphasis.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"emphasis.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"emphasis.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"emphasis.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"emphasis.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"emphasis.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"emphasis.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"emphasis.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"emphasis.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"emphasis.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"emphasis.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"emphasis.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"emphasis.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.labelLine":{desc:"<p>标签的视觉引导线配置。</p>\n"},"emphasis.labelLine.show":{desc:"\n\n<p>是否显示视觉引导线。</p>\n",uiControl:{type:"boolean"}},"emphasis.labelLine.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"emphasis.labelLine.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"emphasis.labelLine.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"emphasis.labelLine.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"emphasis.labelLine.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"emphasis.labelLine.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"emphasis.labelLine.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"emphasis.labelLine.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"emphasis.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"emphasis.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"emphasis.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"emphasis.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"emphasis.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"emphasis.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"emphasis.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"emphasis.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"emphasis.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"emphasis.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"emphasis.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"2",min:"0",step:"0.5"}},"emphasis.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"emphasis.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"emphasis.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"emphasis.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"emphasis.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"emphasis.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"emphasis.areaStyle.color":{desc:'\n\n<p>填充的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"emphasis.areaStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"emphasis.areaStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"emphasis.areaStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"emphasis.areaStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"emphasis.areaStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"emphasis.endLabel":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n'},"emphasis.endLabel.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"emphasis.endLabel.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"emphasis.endLabel.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"emphasis.endLabel.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"emphasis.endLabel.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"emphasis.endLabel.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {@score}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"emphasis.endLabel.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"emphasis.endLabel.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"emphasis.endLabel.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"emphasis.endLabel.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"emphasis.endLabel.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"emphasis.endLabel.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"emphasis.endLabel.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"emphasis.endLabel.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"emphasis.endLabel.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"emphasis.endLabel.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"emphasis.endLabel.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.endLabel.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"emphasis.endLabel.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"emphasis.endLabel.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"emphasis.endLabel.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.endLabel.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.endLabel.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.endLabel.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"emphasis.endLabel.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"emphasis.endLabel.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"emphasis.endLabel.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.endLabel.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"emphasis.endLabel.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.endLabel.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.endLabel.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.endLabel.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"emphasis.endLabel.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"emphasis.endLabel.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"emphasis.endLabel.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"emphasis.endLabel.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"emphasis.endLabel.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"emphasis.endLabel.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"emphasis.endLabel.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"emphasis.endLabel.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"emphasis.endLabel.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"emphasis.endLabel.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"emphasis.endLabel.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"emphasis.endLabel.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"emphasis.endLabel.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"emphasis.endLabel.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.endLabel.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"emphasis.endLabel.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"emphasis.endLabel.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"emphasis.endLabel.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.endLabel.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.endLabel.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.endLabel.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"emphasis.endLabel.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"emphasis.endLabel.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"emphasis.endLabel.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.endLabel.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"emphasis.endLabel.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.endLabel.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.endLabel.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},blur:{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>折线图的淡出状态。开启 <a href="#series-line.emphasis.focus">emphasis.focus</a> 后有效。</p>\n'},"blur.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"blur.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"blur.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"blur.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"blur.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"blur.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {@score}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"blur.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"blur.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"blur.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"blur.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"blur.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"blur.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"blur.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"blur.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"blur.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"blur.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"blur.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"blur.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"blur.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"blur.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"blur.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"blur.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"blur.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"blur.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"blur.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"blur.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"blur.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"blur.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"blur.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"blur.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"blur.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"blur.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"blur.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"blur.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"blur.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"blur.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"blur.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"blur.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"blur.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"blur.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"blur.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"blur.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"blur.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"blur.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"blur.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.labelLine":{desc:"<p>标签的视觉引导线配置。</p>\n"},"blur.labelLine.show":{desc:"\n\n<p>是否显示视觉引导线。</p>\n",uiControl:{type:"boolean"}},"blur.labelLine.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"blur.labelLine.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"blur.labelLine.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"blur.labelLine.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"blur.labelLine.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"blur.labelLine.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"blur.labelLine.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"blur.labelLine.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"blur.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"blur.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"blur.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"blur.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"blur.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"blur.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"blur.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"blur.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"blur.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"blur.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"blur.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"2",min:"0",step:"0.5"}},"blur.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"blur.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"blur.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"blur.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"blur.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"blur.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"blur.areaStyle.color":{desc:'\n\n<p>填充的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"blur.areaStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"blur.areaStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"blur.areaStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"blur.areaStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"blur.areaStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"blur.endLabel.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"blur.endLabel.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"blur.endLabel.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"blur.endLabel.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"blur.endLabel.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"blur.endLabel.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {@score}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"blur.endLabel.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"blur.endLabel.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"blur.endLabel.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"blur.endLabel.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"blur.endLabel.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"blur.endLabel.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"blur.endLabel.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"blur.endLabel.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"blur.endLabel.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"blur.endLabel.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"blur.endLabel.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.endLabel.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"blur.endLabel.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"blur.endLabel.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"blur.endLabel.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.endLabel.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.endLabel.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.endLabel.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"blur.endLabel.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"blur.endLabel.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"blur.endLabel.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.endLabel.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"blur.endLabel.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.endLabel.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.endLabel.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.endLabel.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"blur.endLabel.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"blur.endLabel.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"blur.endLabel.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"blur.endLabel.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"blur.endLabel.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"blur.endLabel.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"blur.endLabel.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"blur.endLabel.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"blur.endLabel.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"blur.endLabel.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"blur.endLabel.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"blur.endLabel.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"blur.endLabel.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"blur.endLabel.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.endLabel.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"blur.endLabel.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"blur.endLabel.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"blur.endLabel.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.endLabel.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.endLabel.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.endLabel.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"blur.endLabel.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"blur.endLabel.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"blur.endLabel.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.endLabel.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"blur.endLabel.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.endLabel.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.endLabel.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},select:{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>折线图的选中状态。开启 <a href="#series-line.selectedMode">selectedMode</a> 后有效。</p>\n'},"select.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"select.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"select.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"select.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"select.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"select.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {@score}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"select.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"select.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"select.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"select.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"select.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"select.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"select.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"select.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"select.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"select.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"select.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"select.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"select.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"select.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"select.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"select.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"select.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"select.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"select.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"select.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"select.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"select.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"select.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"select.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"select.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"select.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"select.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"select.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"select.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"select.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"select.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"select.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"select.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"select.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"select.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"select.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"select.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"select.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"select.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.labelLine":{desc:"<p>标签的视觉引导线配置。</p>\n"},"select.labelLine.show":{desc:"\n\n<p>是否显示视觉引导线。</p>\n",uiControl:{type:"boolean"}},"select.labelLine.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"select.labelLine.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"select.labelLine.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"select.labelLine.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"select.labelLine.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"select.labelLine.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"select.labelLine.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"select.labelLine.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"select.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"select.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"select.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"select.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"select.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"select.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"select.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"select.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"select.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"select.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"select.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"2",min:"0",step:"0.5"}},"select.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"select.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"select.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"select.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"select.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"select.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"select.areaStyle.color":{desc:'\n\n<p>填充的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"select.areaStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"select.areaStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"select.areaStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"select.areaStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"select.areaStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"select.endLabel.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"select.endLabel.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"select.endLabel.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"select.endLabel.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"select.endLabel.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"select.endLabel.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {@score}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"select.endLabel.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"select.endLabel.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"select.endLabel.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"select.endLabel.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"select.endLabel.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"select.endLabel.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"select.endLabel.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"select.endLabel.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"select.endLabel.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"select.endLabel.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"select.endLabel.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.endLabel.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"select.endLabel.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"select.endLabel.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"select.endLabel.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.endLabel.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.endLabel.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.endLabel.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"select.endLabel.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"select.endLabel.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"select.endLabel.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.endLabel.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"select.endLabel.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.endLabel.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.endLabel.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.endLabel.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"select.endLabel.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"select.endLabel.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"select.endLabel.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"select.endLabel.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"select.endLabel.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"select.endLabel.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"select.endLabel.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"select.endLabel.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"select.endLabel.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"select.endLabel.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"select.endLabel.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"select.endLabel.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"select.endLabel.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"select.endLabel.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.endLabel.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"select.endLabel.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"select.endLabel.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"select.endLabel.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.endLabel.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.endLabel.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.endLabel.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"select.endLabel.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"select.endLabel.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"select.endLabel.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.endLabel.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"select.endLabel.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.endLabel.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.endLabel.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},selectedMode:{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n\n\n<p>选中模式的配置,表示是否支持多个选中,默认关闭,支持布尔值和字符串,字符串取值可选<code class="codespan">'single'</code>,<code class="codespan">'multiple'</code>,分别表示单选还是多选。</p>\n',uiControl:{type:"enum",options:"false,true,single,multiple"}},smooth:{desc:'<p>是否平滑曲线显示。</p>\n<p>如果是 <code class="codespan">boolean</code> 类型,则表示是否开启平滑处理。如果是 <code class="codespan">number</code> 类型(取值范围 0 到 1),表示平滑程度,越小表示越接近折线段,反之则反。设为 <code class="codespan">true</code> 时相当于设为 <code class="codespan">0.5</code>。</p>\n<p>如果需要修改平滑算法,请参考 <a href="#series-line.smoothMonotone">smoothMonotone</a>。</p>\n'},smoothMonotone:{desc:'<p>折线平滑后是否在一个维度上保持单调性,可以设置成<code class="codespan">'x'</code>, <code class="codespan">'y'</code>来指明是在 x 轴或者 y 轴上保持单调性。</p>\n<p>通常在双数值轴上使用。</p>\n<p>下面两张图分别是双数值轴中的折线图<code class="codespan">smoothMonotone</code>不设置以及设置为<code class="codespan">'x'</code>的区别。</p>\n<ul>\n<li>不设置<code class="codespan">smoothMonotone</code>:</li>\n</ul>\n<p><img width="300" height="auto" src="documents/asset/img/smooth-monotone-none.png"></p>\n<ul>\n<li>设置为 <code class="codespan">'x'</code>:</li>\n</ul>\n<p><img width="300" height="auto" src="documents/asset/img/smooth-monotone-x.png"></p>\n'},sampling:{desc:'<p>折线图在数据量远大于像素点时候的降采样策略,开启后可以有效的优化图表的绘制效率,默认关闭,也就是全部绘制不过滤数据点。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'lttb'</code> 采用 Largest-Triangle-Three-Bucket 算法,可以最大程度保证采样后线条的趋势,形状和极值。</li>\n<li><code class="codespan">'average'</code> 取过滤点的平均值</li>\n<li><code class="codespan">'max'</code> 取过滤点的最大值</li>\n<li><code class="codespan">'min'</code> 取过滤点的最小值</li>\n<li><code class="codespan">'sum'</code> 取过滤点的和</li>\n</ul>\n'},dimensions:{desc:'<p>使用 dimensions 定义 <code class="codespan">series.data</code> 或者 <code class="codespan">dataset.source</code> 的每个维度的信息。</p>\n<p>注意:如果使用了 <a href="#dataset">dataset</a>,那么可以在 <a href="#dataset.dimensions">dataset.dimensions</a> 中定义 dimension ,或者在 <a href="#dataset.source">dataset.source</a> 的第一行/列中给出 dimension 名称。于是就不用在这里指定 dimension。但如果在这里指定了 <code class="codespan">dimensions</code>,那么优先使用这里的。</p>\n<p>例如:</p>\n<pre><code class="lang-js">option = {\n dataset: {\n source: [\n // 有了上面 dimensions 定义后,下面这五个维度的名称分别为:\n // 'date', 'open', 'close', 'highest', 'lowest'\n [12, 44, 55, 66, 2],\n [23, 6, 16, 23, 1],\n ...\n ]\n },\n series: {\n type: 'xxx',\n // 定义了每个维度的名称。这个名称会被显示到默认的 tooltip 中。\n dimensions: ['date', 'open', 'close', 'highest', 'lowest']\n }\n}\n</code></pre>\n<pre><code class="lang-js">series: {\n type: 'xxx',\n dimensions: [\n null, // 如果此维度不想给出定义,则使用 null 即可\n {type: 'ordinal'}, // 只定义此维度的类型。\n // 'ordinal' 表示离散型,一般文本使用这种类型。\n // 如果类型没有被定义,会自动猜测类型。\n {name: 'good', type: 'number'},\n 'bad' // 等同于 {name: 'bad'}\n ]\n}\n</code></pre>\n<p><code class="codespan">dimensions</code> 数组中的每一项可以是:</p>\n<ul>\n<li><code class="codespan">string</code>,如 <code class="codespan">'someName'</code>,等同于 <code class="codespan">{name: 'someName'}</code></li>\n<li><code class="codespan">Object</code>,属性可以有:<ul>\n<li>name: <code class="codespan">string</code>。</li>\n<li>type: <code class="codespan">string</code>,支持<ul>\n<li><code class="codespan">number</code>,默认,表示普通数据。</li>\n<li><code class="codespan">ordinal</code>,对于类目、文本这些 string 类型的数据,如果需要能在数轴上使用,须是 'ordinal' 类型。ECharts 默认会自动判断这个类型。但是自动判断也是不可能很完备的,所以使用者也可以手动强制指定。</li>\n<li><code class="codespan">float</code>,即 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Float64Array" target="_blank">Float64Array</a>。</li>\n<li><code class="codespan">int</code>,即 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Int32Array" target="_blank">Int32Array</a>。</li>\n<li><code class="codespan">time</code>,表示时间类型。设置成 'time' 则能支持自动解析数据成时间戳(timestamp),比如该维度的数据是 '2017-05-10',会自动被解析。时间类型的支持参见 <a href="#series.data">data</a>。</li>\n</ul>\n</li>\n<li>displayName: 一般用于 tooltip 中维度名的展示。<code class="codespan">string</code> 如果没有指定,默认使用 name 来展示。</li>\n</ul>\n</li>\n</ul>\n<p>值得一提的是,当定义了 <code class="codespan">dimensions</code> 后,默认 <code class="codespan">tooltip</code> 中对个维度的显示,会变为『竖排』,从而方便显示每个维度的名称。如果没有定义 <code class="codespan">dimensions</code>,则默认 <code class="codespan">tooltip</code> 会横排显示,且只显示数值没有维度名称可显示。</p>\n'},encode:{desc:'<p>可以定义 <code class="codespan">data</code> 的哪个维度被编码成什么。比如:</p>\n<pre><code class="lang-js">option = {\n dataset: {\n source: [\n // 每一列称为一个『维度』。\n // 这里分别是维度 0、1、2、3、4。\n [12, 44, 55, 66, 2],\n [23, 6, 16, 23, 1],\n ...\n ]\n },\n series: {\n type: 'xxx',\n encode: {\n x: [3, 1, 5], // 表示维度 3、1、5 映射到 x 轴。\n y: 2, // 表示维度 2 映射到 y 轴。\n tooltip: [3, 2, 4] // 表示维度 3、2、4 会在 tooltip 中显示。\n }\n }\n}\n</code></pre>\n<p>当使用 <a href="#series.dimensions">dimensions</a> 给维度定义名称后,<code class="codespan">encode</code> 中可直接引用名称,例如:</p>\n<pre><code class="lang-js">series: {\n type: 'xxx',\n dimensions: ['date', 'open', 'close', 'highest', 'lowest'],\n encode: {\n x: 'date',\n y: ['open', 'close', 'highest', 'lowest']\n }\n}\n</code></pre>\n<p><code class="codespan">encode</code> 声明的基本结构如下,其中冒号左边是坐标系、标签等特定名称,如 <code class="codespan">'x'</code>, <code class="codespan">'y'</code>, <code class="codespan">'tooltip'</code> 等,冒号右边是数据中的维度名(string 格式)或者维度的序号(number 格式,从 0 开始计数),可以指定一个或多个维度(使用数组)。通常情况下,下面各种信息不需要所有的都写,按需写即可。</p>\n<p>下面是 encode 支持的属性:</p>\n<pre><code class="lang-js">// 在任何坐标系和系列中,都支持:\nencode: {\n // 使用 “名为 product 的维度” 和 “名为 score 的维度” 的值在 tooltip 中显示\n tooltip: ['product', 'score']\n // 使用 “维度 1” 和 “维度 3” 的维度名连起来作为系列名。(有时候名字比较长,这可以避免在 series.name 重复输入这些名字)\n seriesName: [1, 3],\n // 表示使用 “维度2” 中的值作为 id。这在使用 setOption 动态更新数据时有用处,可以使新老数据用 id 对应起来,从而能够产生合适的数据更新动画。\n itemId: 2,\n // 指定数据项的名称使用 “维度3” 在饼图等图表中有用,可以使这个名字显示在图例(legend)中。\n itemName: 3\n}\n\n// 直角坐标系(grid/cartesian)特有的属性:\nencode: {\n // 把 “维度1”、“维度5”、“名为 score 的维度” 映射到 X 轴:\n x: [1, 5, 'score'],\n // 把“维度0”映射到 Y 轴。\n y: 0\n}\n\n// 单轴(singleAxis)特有的属性:\nencode: {\n single: 3\n}\n\n// 极坐标系(polar)特有的属性:\nencode: {\n radius: 3,\n angle: 2\n}\n\n// 地理坐标系(geo)特有的属性:\nencode: {\n lng: 3,\n lat: 2\n}\n\n// 对于一些没有坐标系的图表,例如饼图、漏斗图等,可以是:\nencode: {\n value: 3\n}\n</code></pre>\n<p>这是个更丰富的 <code class="codespan">encode</code> 的<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=dataset-encode1&edit=1&reset=1" target="_blank">示例</a>:</p>\n<p>特殊地,在 <a href="#series-custom">自定义系列(custom series)</a> 中,<code class="codespan">encode</code> 中轴可以不指定或设置为 <code class="codespan">null/undefined</code>,从而使系列免于受这个轴控制,也就是说,轴的范围(extent)不会受此系列数值的影响,轴被 <a href="#dataZoom">dataZoom</a> 控制时也不会过滤掉这个系列:</p>\n<pre><code class="lang-js">var option = {\n xAxis: {},\n yAxis: {},\n dataZoom: [{\n xAxisIndex: 0\n }, {\n yAxisIndex: 0\n }],\n series: {\n type: 'custom',\n renderItem: function (params, api) {\n return {\n type: 'circle',\n shape: {\n cx: 100, // x 位置永远为 100\n cy: api.coord([0, api.value(0)])[1],\n r: 30\n },\n style: {\n fill: 'blue'\n }\n };\n },\n encode: {\n // 这样这个系列就不会被 x 轴以及 x\n // 轴上的 dataZoom 控制了。\n x: -1,\n y: 1\n },\n data: [ ... ]\n }\n};\n</code></pre>\n'},seriesLayoutBy:{desc:'<p>当使用 <a href="#dataset">dataset</a> 时,<code class="codespan">seriesLayoutBy</code> 指定了 <code class="codespan">dataset</code> 中用行还是列对应到系列上,也就是说,系列“排布”到 <code class="codespan">dataset</code> 的行还是列上。可取值:</p>\n<ul>\n<li>'column':默认,<code class="codespan">dataset</code> 的列对应于系列,从而 <code class="codespan">dataset</code> 中每一列是一个维度(dimension)。</li>\n<li>'row':<code class="codespan">dataset</code> 的行对应于系列,从而 <code class="codespan">dataset</code> 中每一行是一个维度(dimension)。</li>\n</ul>\n<p>参见这个 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=dataset-series-layout-by&theme=lite" target="_blank">示例</a></p>\n'},datasetIndex:{desc:'<p>如果 <a href="#series.data">series.data</a> 没有指定,并且 <a href="#dataset">dataset</a> 存在,那么就会使用 <a href="#dataset">dataset</a>。<code class="codespan">datasetIndex</code> 指定本系列使用那个 <a href="#dataset">dataset</a>。</p>\n'},data:{desc:'<p>系列中的数据内容数组。数组项通常为具体的数据项。</p>\n<p>注意,如果系列没有指定 <code class="codespan">data</code>,并且 option 有 <a href="#dataset">dataset</a>,那么默认使用第一个 <a href="#dataset">dataset</a>。如果指定了 <code class="codespan">data</code>,则不会再使用 <a href="#dataset">dataset</a>。</p>\n<p>可以使用 <code class="codespan">series.datasetIndex</code> 指定其他的 <a href="#dataset">dataset</a>。</p>\n<p>通常来说,数据用一个二维数组表示。如下,每一列被称为一个『维度』。</p>\n<pre><code class="lang-js">series: [{\n data: [\n // 维度X 维度Y 其他维度 ...\n [ 3.4, 4.5, 15, 43],\n [ 4.2, 2.3, 20, 91],\n [ 10.8, 9.5, 30, 18],\n [ 7.2, 8.8, 18, 57]\n ]\n}]\n</code></pre>\n<ul>\n<li>在 <a href="#grid">直角坐标系 (grid)</a> 中『维度X』和『维度Y』会默认对应于 <a href="#xAxis">xAxis</a> 和 <a href="#yAxis">yAxis</a>。</li>\n<li>在 <a href="#polar">极坐标系 (polar)</a> 中『维度X』和『维度Y』会默认对应于 <a href="#radiusAxis">radiusAxis</a> 和 <a href="#anbleAxis">angleAxis</a>。</li>\n<li>后面的其他维度是可选的,可以在别处被使用,例如:<ul>\n<li>在 <a href="#visualMap">visualMap</a> 中可以将一个或多个维度映射到颜色,大小等多个图形属性上。</li>\n<li>在 <a href="#series.symbolSize">series.symbolSize</a> 中可以使用回调函数,基于某个维度得到 symbolSize 值。</li>\n<li>使用 <a href="#tooltip.formatter">tooltip.formatter</a> 或 <a href="#series.label.formatter">series.label.formatter</a> 可以把其他维度的值展示出来。</li>\n</ul>\n</li>\n</ul>\n<p>特别地,当只有一个轴为类目轴(axis.type 为 <code class="codespan">'category'</code>)的时候,数据可以简化用一个一维数组表示。例如:</p>\n<pre><code class="lang-js">xAxis: {\n data: ['a', 'b', 'm', 'n']\n},\nseries: [{\n // 与 xAxis.data 一一对应。\n data: [23, 44, 55, 19]\n // 它其实是下面这种形式的简化:\n // data: [[0, 23], [1, 44], [2, 55], [3, 19]]\n}]\n</code></pre>\n<p><strong>『值』与 <a href="#xAxis.type">轴类型</a> 的关系:</strong></p>\n<ul>\n<li><p>当某维度对应于数值轴(axis.type 为 <code class="codespan">'value'</code> 或者 <code class="codespan">'log'</code>)的时候:</p>\n<p> 其值可以为 <code class="codespan">number</code>(例如 <code class="codespan">12</code>)。(也可以兼容 <code class="codespan">string</code> 形式的 number,例如 <code class="codespan">'12'</code>)</p>\n</li>\n<li><p>当某维度对应于类目轴(axis.type 为 <code class="codespan">'category'</code>)的时候:</p>\n<p> 其值须为类目的『序数』(从 <code class="codespan">0</code> 开始)或者类目的『字符串值』。例如:</p>\n<pre><code class="lang-js"> xAxis: {\n type: 'category',\n data: ['星期一', '星期二', '星期三', '星期四']\n },\n yAxis: {\n type: 'category',\n data: ['a', 'b', 'm', 'n', 'p', 'q']\n },\n series: [{\n data: [\n // xAxis yAxis\n [ 0, 0, 2 ], // 意思是此点位于 xAxis: '星期一', yAxis: 'a'。\n [ '星期四', 2, 1 ], // 意思是此点位于 xAxis: '星期四', yAxis: 'm'。\n [ 2, 'p', 2 ], // 意思是此点位于 xAxis: '星期三', yAxis: 'p'。\n [ 3, 3, 5 ]\n ]\n }]\n</code></pre>\n<p> 双类目轴的示例可以参考 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=scatter-punchCard" target="_blank">Github Punchcard</a> 示例。</p>\n</li>\n<li><p>当某维度对应于时间轴(type 为 <code class="codespan">'time'</code>)的时候,值可以为:</p>\n<ul>\n<li>一个时间戳,如 <code class="codespan">1484141700832</code>,表示 UTC 时间。</li>\n<li>或者字符串形式的时间描述:<ul>\n<li><a href="http://www.ecma-international.org/ecma-262/5.1/#sec-15.9.1.15" target="_blank">ISO 8601</a> 的子集,只包含这些形式(这几种格式,除非指明时区,否则均表示本地时间,与 <a href="https://momentjs.com/" target="_blank">moment</a> 一致):<ul>\n<li>部分年月日时间: <code class="codespan">'2012-03'</code>, <code class="codespan">'2012-03-01'</code>, <code class="codespan">'2012-03-01 05'</code>, <code class="codespan">'2012-03-01 05:06'</code>.</li>\n<li>使用 <code class="codespan">'T'</code> 或空格分割: <code class="codespan">'2012-03-01T12:22:33.123'</code>, <code class="codespan">'2012-03-01 12:22:33.123'</code>.</li>\n<li>时区设定: <code class="codespan">'2012-03-01T12:22:33Z'</code>, <code class="codespan">'2012-03-01T12:22:33+8000'</code>, <code class="codespan">'2012-03-01T12:22:33-05:00'</code>.</li>\n</ul>\n</li>\n<li>其他的时间字符串,包括(均表示本地时间):\n<code class="codespan">'2012'</code>, <code class="codespan">'2012-3-1'</code>, <code class="codespan">'2012/3/1'</code>, <code class="codespan">'2012/03/01'</code>,\n<code class="codespan">'2009/6/12 2:00'</code>, <code class="codespan">'2009/6/12 2:05:08'</code>, <code class="codespan">'2009/6/12 2:05:08.123'</code></li>\n</ul>\n</li>\n<li>或者用户自行初始化的 Date 实例:<ul>\n<li>注意,用户自行初始化 Date 实例的时候,<a href="http://dygraphs.com/date-formats.html" target="_blank">浏览器的行为有差异,不同字符串的表示也不同</a>。</li>\n<li>例如:在 chrome 中,<code class="codespan">new Date('2012-01-01')</code> 表示 UTC 时间的 2012 年 1 月 1 日,而 <code class="codespan">new Date('2012-1-1')</code> 和 <code class="codespan">new Date('2012/01/01')</code> 表示本地时间的 2012 年 1 月 1 日。在 safari 中,不支持 <code class="codespan">new Date('2012-1-1')</code> 这种表示方法。</li>\n<li>所以,使用 <code class="codespan">new Date(dataString)</code> 时,可使用第三方库解析(如 <a href="https://momentjs.com/" target="_blank">moment</a>),或者使用 <code class="codespan">echarts.number.parseDate</code>,或者参见 <a href="http://dygraphs.com/date-formats.html" target="_blank">这里</a>。</li>\n</ul>\n</li>\n</ul>\n</li>\n</ul>\n<p><strong>当需要对个别数据进行个性化定义时:</strong></p>\n<p>数组项可用对象,其中的 <code class="codespan">value</code> 像表示具体的数值,如:</p>\n<pre><code class="lang-js">[\n 12,\n 34,\n {\n value : 56,\n //自定义标签样式,仅对该数据项有效\n label: {},\n //自定义特殊 itemStyle,仅对该数据项有效\n itemStyle:{}\n },\n 10\n]\n// 或\n[\n [12, 33],\n [34, 313],\n {\n value: [56, 44],\n label: {},\n itemStyle:{}\n },\n [10, 33]\n]\n</code></pre>\n<p><strong>空值:</strong></p>\n<p>当某数据不存在时(ps:<em>不存在</em>不代表值为 0),可以用 <code class="codespan">'-'</code> 或者 <code class="codespan">null</code> 或者 <code class="codespan">undefined</code> 或者 <code class="codespan">NaN</code> 表示。</p>\n<p>例如,无数据在折线图中可表现为该点是断开的,在其它图中可表示为图形不存在。</p>\n'},"data.name":{desc:"<p>数据项名称。</p>\n"},"data.value":{desc:"<p>单个数据项的数值。</p>\n"},"data.symbol":{desc:'\n\n<p>单个数据标记的图形。</p>\n<p>ECharts 提供的标记类型包括</p>\n<p><code class="codespan">'circle'</code>, <code class="codespan">'rect'</code>, <code class="codespan">'roundRect'</code>, <code class="codespan">'triangle'</code>, <code class="codespan">'diamond'</code>, <code class="codespan">'pin'</code>, <code class="codespan">'arrow'</code>, <code class="codespan">'none'</code></p>\n<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>',uiControl:{type:"icon",default:"circle"}},"data.symbolSize":{desc:'\n\n<p>单个数据标记的大小,可以设置成诸如 <code class="codespan">10</code> 这样单一的数字,也可以用数组分开表示宽和高,例如 <code class="codespan">[20, 10]</code> 表示标记宽为<code class="codespan">20</code>,高为<code class="codespan">10</code>。</p>\n',uiControl:{type:"number",min:"0"}},"data.symbolRotate":{desc:'\n\n<p>单个数据标记的旋转角度(而非弧度)。正值表示逆时针旋转。注意在 <code class="codespan">markLine</code> 中当 <code class="codespan">symbol</code> 为 <code class="codespan">'arrow'</code> 时会忽略 <code class="codespan">symbolRotate</code> 强制设置为切线的角度。</p>\n',uiControl:{type:"angle",min:"-180",max:"180",step:"1"}},"data.symbolKeepAspect":{desc:'\n\n<p>如果 <code class="codespan">symbol</code> 是 <code class="codespan">path://</code> 的形式,是否在缩放时保持该图形的长宽比。</p>\n',uiControl:{type:"boolean",clean:"true"}},"data.symbolOffset":{desc:'\n\n<p>单个数据标记相对于原本位置的偏移。默认情况下,标记会居中置放在数据对应的位置,但是如果 symbol 是自定义的矢量路径或者图片,就有可能不希望 symbol 居中。这时候可以使用该配置项配置 symbol 相对于原本居中的偏移,可以是绝对的像素值,也可以是相对的百分比。</p>\n<p>例如 <code class="codespan">[0, '50%']</code> 就是把自己向上移动了一半的位置,在 symbol 图形是气泡的时候可以让图形下端的箭头对准数据点。</p>\n',uiControl:{type:"vector",separate:"true",dims:"x,y"}},"data.label":{desc:"<p>单个拐点文本的样式设置。</p>\n"},"data.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"data.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"data.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"data.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"data.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"data.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"data.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"data.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"data.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"data.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"data.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"data.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"data.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"data.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"data.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"data.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.labelLine":{desc:"<p>标签的视觉引导线配置。</p>\n"},"data.labelLine.show":{desc:"\n\n<p>是否显示视觉引导线。</p>\n",uiControl:{type:"boolean"}},"data.labelLine.showAbove":{desc:"<p>是否显示在图形上方。</p>\n"},"data.labelLine.length2":{desc:"\n\n<p>视觉引导项第二段的长度。</p>\n",uiControl:{type:"number",default:"15",min:"0",step:"1"}},"data.labelLine.smooth":{desc:'\n\n<p>是否平滑视觉引导线,默认不平滑,可以设置成 <code class="codespan">true</code> 平滑显示,也可以设置为 0 到 1 的值,表示平滑程度。</p>\n',uiControl:{type:"boolean"}},"data.labelLine.minTurnAngle":{desc:"<p>通过调整第二段线的长度,限制引导线两端之间最小的夹角,以防止过小的夹角导致显示不美观。</p>\n<p>可以设置为 0 - 180 度。</p>\n"},"data.labelLine.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"data.labelLine.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"data.labelLine.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"data.labelLine.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"data.labelLine.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"data.labelLine.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.labelLine.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.labelLine.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"data.itemStyle":{desc:"<p>单个拐点标志的样式设置。</p>\n"},"data.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"data.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"data.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"data.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"data.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"data.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"data.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"data.emphasis":{desc:"<p>单个拐点的高亮样式和标签设置。</p>\n"},"data.emphasis.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"data.emphasis.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"data.emphasis.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"data.emphasis.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"data.emphasis.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"data.emphasis.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"data.emphasis.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.emphasis.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.emphasis.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.emphasis.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.emphasis.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.emphasis.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.emphasis.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.emphasis.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.emphasis.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.emphasis.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.emphasis.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.emphasis.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.emphasis.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.emphasis.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.emphasis.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.emphasis.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.emphasis.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"data.emphasis.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"data.emphasis.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"data.emphasis.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.emphasis.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.emphasis.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.emphasis.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.emphasis.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.emphasis.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"data.emphasis.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"data.emphasis.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"data.emphasis.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"data.emphasis.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"data.emphasis.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.emphasis.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.emphasis.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.emphasis.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.emphasis.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.emphasis.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.emphasis.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.emphasis.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.emphasis.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.emphasis.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.emphasis.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.emphasis.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.emphasis.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.emphasis.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.emphasis.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.emphasis.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.emphasis.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.emphasis.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.emphasis.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"data.emphasis.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.emphasis.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.emphasis.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.emphasis.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.emphasis.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.emphasis.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"data.emphasis.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"data.emphasis.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"data.emphasis.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"data.emphasis.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"data.emphasis.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"data.emphasis.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.emphasis.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.emphasis.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"data.blur":{desc:"<p>单个拐点的淡出样式和标签设置。</p>\n"},"data.blur.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"data.blur.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"data.blur.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"data.blur.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"data.blur.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"data.blur.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"data.blur.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.blur.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.blur.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.blur.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.blur.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.blur.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.blur.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.blur.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.blur.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.blur.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.blur.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.blur.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.blur.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.blur.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.blur.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.blur.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.blur.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"data.blur.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"data.blur.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"data.blur.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.blur.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.blur.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.blur.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.blur.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.blur.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"data.blur.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"data.blur.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"data.blur.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"data.blur.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"data.blur.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.blur.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.blur.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.blur.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.blur.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.blur.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.blur.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.blur.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.blur.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.blur.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.blur.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.blur.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.blur.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.blur.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.blur.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.blur.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.blur.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.blur.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.blur.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"data.blur.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.blur.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.blur.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.blur.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.blur.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.blur.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"data.blur.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"data.blur.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"data.blur.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"data.blur.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"data.blur.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"data.blur.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.blur.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.blur.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"data.select":{desc:"<p>单个拐点的选中样式和标签设置。</p>\n"},"data.select.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"data.select.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"data.select.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"data.select.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"data.select.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"data.select.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"data.select.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.select.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.select.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.select.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.select.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.select.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.select.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.select.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.select.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.select.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.select.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.select.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.select.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.select.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.select.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.select.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.select.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"data.select.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"data.select.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"data.select.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.select.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.select.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.select.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.select.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.select.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"data.select.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"data.select.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"data.select.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"data.select.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"data.select.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.select.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.select.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.select.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.select.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.select.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.select.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.select.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.select.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.select.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.select.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.select.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.select.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.select.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.select.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.select.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.select.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.select.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.select.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"data.select.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.select.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.select.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.select.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.select.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.select.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"data.select.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"data.select.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"data.select.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"data.select.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"data.select.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"data.select.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.select.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.select.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"data.tooltip":{desc:"<p>本系列每个数据项中特定的 tooltip 设定。</p>\n"},"data.tooltip.position":{desc:'<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.data.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的位置,默认不设置时位置会跟随鼠标的位置。</p>\n<p>可选:</p>\n<ul>\n<li><p><code class="codespan">Array</code></p>\n<p> 通过数组表示提示框浮层的位置,支持数字设置绝对位置,百分比设置相对位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对位置,相对于容器左侧 10px, 上侧 10 px\n position: [10, 10]\n // 相对位置,放置在容器正中间\n position: ['50%', '50%']\n</code></pre>\n</li>\n<li><p><code class="codespan">Function</code></p>\n<p> 回调函数,格式如下:</p>\n<pre><code class="lang-js"> (point: Array, params: Object|Array.<Object>, dom: HTMLDomElement, rect: Object, size: Object) => Array\n</code></pre>\n<p> <strong>参数:</strong><br>\n point: 鼠标位置,如 [20, 40]。<br>\n params: 同 formatter 的参数相同。<br>\n dom: tooltip 的 dom 对象。<br>\n rect: 只有鼠标在图形上时有效,是一个用<code class="codespan">x</code>, <code class="codespan">y</code>, <code class="codespan">width</code>, <code class="codespan">height</code>四个属性表达的图形包围盒。<br>\n size: 包括 dom 的尺寸和 echarts 容器的当前尺寸,例如:<code class="codespan">{contentSize: [width, height], viewSize: [width, height]}</code>。<br></p>\n<p> <strong>返回值:</strong><br>\n 可以是一个表示 tooltip 位置的数组,数组值可以是绝对的像素值,也可以是相 百分比。<br>\n 也可以是一个对象,如:<code class="codespan">{left: 10, top: 30}</code>,或者 <code class="codespan">{right: '20%', bottom: 40}</code>。<br></p>\n<p> 如下示例:</p>\n<pre><code class="lang-js"> position: function (point, params, dom, rect, size) {\n // 固定在顶部\n return [point[0], '10%'];\n }\n</code></pre>\n<p> 或者:</p>\n<pre><code class="lang-js"> position: function (pos, params, dom, rect, size) {\n // 鼠标在左侧时 tooltip 显示到右侧,鼠标在右侧时 tooltip 显示到左侧。\n var obj = {top: 60};\n obj[['left', 'right'][+(pos[0] < size.viewSize[0] / 2)]] = 5;\n return obj;\n }\n</code></pre>\n</li>\n</ul>\n<ul>\n<li><p><code class="codespan">'inside'</code></p>\n<p> 鼠标所在图形的内部中心位置,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'top'</code></p>\n<p> 鼠标所在图形上侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'left'</code></p>\n<p> 鼠标所在图形左侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'right'</code></p>\n<p> 鼠标所在图形右侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'bottom'</code></p>\n<p> 鼠标所在图形底侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n</ul>\n'},"data.tooltip.formatter":{desc:'<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.data.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层内容格式器,支持字符串模板和回调函数两种形式。</p>\n<p><strong>1, 字符串模板</strong></p>\n<p>模板变量有 <code class="codespan">{a}</code>, <code class="codespan">{b}</code>,<code class="codespan">{c}</code>,<code class="codespan">{d}</code>,<code class="codespan">{e}</code>,分别表示系列名,数据名,数据值等。\n在 <a href="#tooltip.trigger">trigger</a> 为 <code class="codespan">'axis'</code> 的时候,会有多个系列的数据,此时可以通过 <code class="codespan">{a0}</code>, <code class="codespan">{a1}</code>, <code class="codespan">{a2}</code> 这种后面加索引的方式表示系列的索引。\n不同图表类型下的 <code class="codespan">{a}</code>,<code class="codespan">{b}</code>,<code class="codespan">{c}</code>,<code class="codespan">{d}</code> 含义不一样。\n其中变量<code class="codespan">{a}</code>, <code class="codespan">{b}</code>, <code class="codespan">{c}</code>, <code class="codespan">{d}</code>在不同图表类型下代表数据含义为:</p>\n<ul>\n<li><p>折线(区域)图、柱状(条形)图、K线图 : <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(类目值),<code class="codespan">{c}</code>(数值), <code class="codespan">{d}</code>(无)</p>\n</li>\n<li><p>散点图(气泡)图 : <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(数据名称),<code class="codespan">{c}</code>(数值数组), <code class="codespan">{d}</code>(无)</p>\n</li>\n<li><p>地图 : <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(区域名称),<code class="codespan">{c}</code>(合并数值), <code class="codespan">{d}</code>(无)</p>\n</li>\n<li><p>饼图、仪表盘、漏斗图: <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(数据项名称),<code class="codespan">{c}</code>(数值), <code class="codespan">{d}</code>(百分比)</p>\n</li>\n</ul>\n<p>更多其它图表模板变量的含义可以见相应的图表的 label.formatter 配置项。</p>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b0}: {c0}<br />{b1}: {c1}'\n</code></pre>\n<p><strong>2, 回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array, ticket: string, callback: (ticket: string, html: string)) => string\n</code></pre>\n<p>第一个参数 <code class="codespan">params</code> 是 formatter 需要的数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n // 饼图的百分比\n percent: number,\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n<p>在 <a href="#tooltip.trigger">trigger</a> 为 <code class="codespan">'axis'</code> 的时候,或者 tooltip 被 <a href="#xAxis.axisPointer">axisPointer</a> 触发的时候,<code class="codespan">params</code> 是多个系列的数据数组。其中每项内容格式同上,并且,</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n<p><strong>注:</strong> ECharts 2.x 使用数组表示各参数的方式不再支持。</p>\n<p>第二个参数 <code class="codespan">ticket</code> 是异步回调标识,配合第三个参数 <code class="codespan">callback</code> 使用。\n第三个参数 <code class="codespan">callback</code> 是异步回调,在提示框浮层内容是异步获取的时候,可以通过 callback 传入上述的 <code class="codespan">ticket</code> 和 <code class="codespan">html</code> 更新提示框浮层内容。</p>\n<p>示例:</p>\n<pre><code class="lang-js">formatter: function (params, ticket, callback) {\n $.get('detail?name=' + params.name, function (content) {\n callback(ticket, toHTML(content));\n });\n return 'Loading';\n}\n</code></pre>\n'},"data.tooltip.backgroundColor":{desc:'<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.data.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的背景颜色。</p>\n'},"data.tooltip.borderColor":{desc:'\n\n\n\n\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.data.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的边框颜色。</p>\n',uiControl:{type:"color",default:"#333"}},"data.tooltip.borderWidth":{desc:'\n\n\n\n\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.data.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的边框宽。</p>\n',uiControl:{type:"number",default:"0",step:"0.5"}},"data.tooltip.padding":{desc:'\n\n\n\n\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.data.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n\n\n<p>提示框浮层内边距,单位px,默认各方向内边距为5,接受数组分别设定上右下左边距。</p>\n<p>使用示例:</p>\n<pre><code class="lang-js">// 设置内边距为 5\npadding: 5\n// 设置上下的内边距为 5,左右的内边距为 10\npadding: [5, 10]\n// 分别设置四个方向的内边距\npadding: [\n 5, // 上\n 10, // 右\n 5, // 下\n 10, // 左\n]\n</code></pre>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.tooltip.textStyle":{desc:'<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.data.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的文本样式。</p>\n'},"data.tooltip.textStyle.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"'#fff'"}},"data.tooltip.textStyle.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.tooltip.textStyle.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.tooltip.textStyle.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.tooltip.textStyle.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"14",min:"1",step:"1"}},"data.tooltip.textStyle.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.tooltip.textStyle.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"data.tooltip.textStyle.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"data.tooltip.textStyle.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"data.tooltip.textStyle.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.tooltip.textStyle.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.tooltip.textStyle.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.tooltip.textStyle.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.tooltip.textStyle.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.tooltip.textStyle.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"data.tooltip.textStyle.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"data.tooltip.textStyle.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"data.tooltip.extraCssText":{desc:'<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.data.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>额外附加到浮层的 css 样式。如下为浮层添加阴影的示例:</p>\n<pre><code class="lang-js">extraCssText: 'box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);'\n</code></pre>\n'},markPoint:{desc:"<p>图表标注。</p>\n"},"markPoint.symbol":{desc:'\n\n<p>标记的图形。</p>\n<p>ECharts 提供的标记类型包括</p>\n<p><code class="codespan">'circle'</code>, <code class="codespan">'rect'</code>, <code class="codespan">'roundRect'</code>, <code class="codespan">'triangle'</code>, <code class="codespan">'diamond'</code>, <code class="codespan">'pin'</code>, <code class="codespan">'arrow'</code>, <code class="codespan">'none'</code></p>\n<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre><p>如果需要每个数据的图形不一样,可以设置为如下格式的回调函数:</p>\n<pre><code class="lang-js">(value: Array|number, params: Object) => string\n</code></pre>\n<p>其中第一个参数 <code class="codespan">value</code> 为 <a href="#series-line.data">data</a> 中的数据值。第二个参数<code class="codespan">params</code> 是其它的数据项参数。</p>\n',uiControl:{type:"icon",default:"circle"}},"markPoint.symbolSize":{desc:'\n\n<p>标记的大小,可以设置成诸如 <code class="codespan">10</code> 这样单一的数字,也可以用数组分开表示宽和高,例如 <code class="codespan">[20, 10]</code> 表示标记宽为<code class="codespan">20</code>,高为<code class="codespan">10</code>。</p>\n<p>如果需要每个数据的图形大小不一样,可以设置为如下格式的回调函数:</p>\n<pre><code class="lang-js">(value: Array|number, params: Object) => number|Array\n</code></pre>\n<p>其中第一个参数 <code class="codespan">value</code> 为 <a href="#series-line.data">data</a> 中的数据值。第二个参数<code class="codespan">params</code> 是其它的数据项参数。</p>\n',uiControl:{type:"number",min:"0"}},"markPoint.symbolRotate":{desc:'\n\n<p>标记的旋转角度(而非弧度)。正值表示逆时针旋转。注意在 <code class="codespan">markLine</code> 中当 <code class="codespan">symbol</code> 为 <code class="codespan">'arrow'</code> 时会忽略 <code class="codespan">symbolRotate</code> 强制设置为切线的角度。</p>\n<p>如果需要每个数据的旋转角度不一样,可以设置为如下格式的回调函数:</p>\n<pre><code class="lang-js">(value: Array|number, params: Object) => number\n</code></pre>\n<p>其中第一个参数 <code class="codespan">value</code> 为 <a href="#series-line.data">data</a> 中的数据值。第二个参数<code class="codespan">params</code> 是其它的数据项参数。</p>\n<blockquote>\n<p>从 4.8.0 开始支持回调函数。</p>\n</blockquote>\n',uiControl:{type:"angle",min:"-180",max:"180",step:"1"}},"markPoint.symbolKeepAspect":{desc:'\n\n<p>如果 <code class="codespan">symbol</code> 是 <code class="codespan">path://</code> 的形式,是否在缩放时保持该图形的长宽比。</p>\n',uiControl:{type:"boolean",clean:"true"}},"markPoint.symbolOffset":{desc:'\n\n<p>标记相对于原本位置的偏移。默认情况下,标记会居中置放在数据对应的位置,但是如果 symbol 是自定义的矢量路径或者图片,就有可能不希望 symbol 居中。这时候可以使用该配置项配置 symbol 相对于原本居中的偏移,可以是绝对的像素值,也可以是相对的百分比。</p>\n<p>例如 <code class="codespan">[0, '50%']</code> 就是把自己向上移动了一半的位置,在 symbol 图形是气泡的时候可以让图形下端的箭头对准数据点。</p>\n',uiControl:{type:"vector",separate:"true",dims:"x,y"}},"markPoint.silent":{desc:"\n\n<p>图形是否不响应和触发鼠标事件,默认为 false,即响应和触发鼠标事件。</p>\n",uiControl:{type:"boolean"}},"markPoint.label":{desc:"<p>标注的文本。</p>\n"},"markPoint.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"true"}},"markPoint.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markPoint.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markPoint.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markPoint.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markPoint.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {@score}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markPoint.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markPoint.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markPoint.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markPoint.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markPoint.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markPoint.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markPoint.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markPoint.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markPoint.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markPoint.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markPoint.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markPoint.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markPoint.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markPoint.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markPoint.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markPoint.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markPoint.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markPoint.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markPoint.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markPoint.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markPoint.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markPoint.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markPoint.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markPoint.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markPoint.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markPoint.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markPoint.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markPoint.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markPoint.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markPoint.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markPoint.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markPoint.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markPoint.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markPoint.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markPoint.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.itemStyle":{desc:"<p>标注的样式。</p>\n"},"markPoint.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markPoint.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markPoint.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markPoint.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markPoint.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markPoint.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markPoint.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markPoint.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markPoint.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markPoint.emphasis":{desc:"<p>标注的高亮样式。</p>\n"},"markPoint.emphasis.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markPoint.emphasis.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markPoint.emphasis.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markPoint.emphasis.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markPoint.emphasis.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markPoint.emphasis.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {@score}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markPoint.emphasis.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markPoint.emphasis.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markPoint.emphasis.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markPoint.emphasis.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markPoint.emphasis.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markPoint.emphasis.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markPoint.emphasis.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markPoint.emphasis.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markPoint.emphasis.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.emphasis.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.emphasis.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.emphasis.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markPoint.emphasis.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markPoint.emphasis.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markPoint.emphasis.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.emphasis.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.emphasis.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.emphasis.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markPoint.emphasis.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markPoint.emphasis.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markPoint.emphasis.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.emphasis.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markPoint.emphasis.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.emphasis.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.emphasis.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.emphasis.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markPoint.emphasis.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markPoint.emphasis.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markPoint.emphasis.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markPoint.emphasis.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markPoint.emphasis.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markPoint.emphasis.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markPoint.emphasis.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markPoint.emphasis.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markPoint.emphasis.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markPoint.emphasis.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markPoint.emphasis.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markPoint.emphasis.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.emphasis.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.emphasis.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.emphasis.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markPoint.emphasis.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markPoint.emphasis.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markPoint.emphasis.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.emphasis.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.emphasis.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.emphasis.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markPoint.emphasis.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markPoint.emphasis.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markPoint.emphasis.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.emphasis.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markPoint.emphasis.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.emphasis.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.emphasis.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.emphasis.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markPoint.emphasis.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markPoint.emphasis.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markPoint.emphasis.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markPoint.emphasis.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markPoint.emphasis.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markPoint.emphasis.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markPoint.emphasis.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markPoint.emphasis.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markPoint.blur":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>标注的淡出样式。淡出的规则跟随所在系列。</p>\n'},"markPoint.blur.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markPoint.blur.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markPoint.blur.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markPoint.blur.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markPoint.blur.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markPoint.blur.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {@score}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markPoint.blur.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markPoint.blur.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markPoint.blur.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markPoint.blur.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markPoint.blur.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markPoint.blur.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markPoint.blur.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markPoint.blur.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markPoint.blur.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.blur.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.blur.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.blur.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markPoint.blur.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markPoint.blur.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markPoint.blur.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.blur.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.blur.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.blur.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markPoint.blur.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markPoint.blur.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markPoint.blur.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.blur.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markPoint.blur.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.blur.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.blur.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.blur.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markPoint.blur.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markPoint.blur.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markPoint.blur.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markPoint.blur.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markPoint.blur.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markPoint.blur.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markPoint.blur.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markPoint.blur.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markPoint.blur.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markPoint.blur.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markPoint.blur.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markPoint.blur.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.blur.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.blur.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.blur.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markPoint.blur.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markPoint.blur.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markPoint.blur.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.blur.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.blur.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.blur.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markPoint.blur.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markPoint.blur.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markPoint.blur.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.blur.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markPoint.blur.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.blur.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.blur.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.blur.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markPoint.blur.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markPoint.blur.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markPoint.blur.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markPoint.blur.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markPoint.blur.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markPoint.blur.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markPoint.blur.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markPoint.blur.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markPoint.data":{desc:'<p>标注的数据数组。每个数组项是一个对象,有下面几种方式指定标注的位置。</p>\n<ol>\n<li>通过 <a href="#series-line.markPoint.data.x">x</a>, <a href="#series-line.markPoint.data.y">y</a> 属性指定相对容器的屏幕坐标,单位像素,支持百分比。</li>\n</ol>\n<ol start="2">\n<li><p>用 <a href="#series-line.markPoint.data.coord">coord</a> 属性指定数据在相应坐标系上的坐标位置,单个维度支持设置 <code class="codespan">'min'</code>, <code class="codespan">'max'</code>, <code class="codespan">'average'</code>。</p>\n</li>\n<li><p>直接用 <a href="#series-line.markPoint.data.type">type</a> 属性标注系列中的最大值,最小值。这时候可以使用 <a href="#series-line.markPoint.data.valueIndex">valueIndex</a> 或者 <a href="#series-line.markPoint.data.valueDim">valueDim</a> 指定是在哪个维度上的最大值、最小值、平均值。</p>\n</li>\n</ol>\n<p>当多个属性同时存在时,优先级按上述的顺序。</p>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">data: [\n {\n name: '最大值',\n type: 'max'\n }, \n {\n name: '某个坐标',\n coord: [10, 20]\n }, {\n name: '固定 x 像素位置',\n yAxis: 10,\n x: '90%'\n }, \n\n {\n name: '某个屏幕坐标',\n x: 100,\n y: 100\n }\n]\n</code></pre>\n'},"markPoint.data.name":{desc:"<p>标注名称。</p>\n"},"markPoint.data.type":{desc:'\n\n<p>特殊的标注类型,用于标注最大值最小值等。</p>\n<p><strong>可选:</strong></p>\n<ul>\n<li><code class="codespan">'min'</code> 最大值。</li>\n<li><code class="codespan">'max'</code> 最大值。</li>\n<li><code class="codespan">'average'</code> 平均值。</li>\n</ul>\n',uiControl:{type:"enum",options:"min,max,average"}},"markPoint.data.valueIndex":{desc:'\n\n<p>在使用 <a href="#series-line.markPoint.data.type">type</a> 时有效,用于指定在哪个维度上指定最大值最小值,可以是 <code class="codespan">0</code>(xAxis, radiusAxis),<code class="codespan">1</code>(yAxis, angleAxis),默认使用第一个数值轴所在的维度。</p>\n',uiControl:{type:"number",min:"0",max:"1",step:"1"}},"markPoint.data.valueDim":{desc:'<p>在使用 <a href="#series-line.markPoint.data.type">type</a> 时有效,用于指定在哪个维度上指定最大值最小值。这可以是维度的直接名称,例如折线图时可以是<code class="codespan">x</code>、<code class="codespan">angle</code>等、candlestick 图时可以是<code class="codespan">open</code>、<code class="codespan">close</code>等维度名称。</p>\n'},"markPoint.data.coord":{desc:'<p>标注的坐标。坐标格式视系列的坐标系而定,可以是<a href="#grid">直角坐标系</a>上的 <code class="codespan">x</code>, <code class="codespan">y</code>,也可以是<a href="#polar">极坐标系</a>上的 <code class="codespan">radius</code>, <code class="codespan">angle</code>。例如 [121, 2323]、['aa', 998]。</p>\n<p><strong>注:</strong>对于 <a href="#xAixs.type">axis.type</a> 为 <code class="codespan">'category'</code> 类型的轴</p>\n<ul>\n<li>如果 coord 值为 <code class="codespan">number</code>,则表示 <a href="#xAxis.data">axis.data</a> 的 index。</li>\n<li>如果 coord 值为 <code class="codespan">string</code>,则表示 <a href="#xAxis.data">axis.data</a> 中具体的值。注意使用这种方式时,xAxis.data 不能写成 [number, number, ...],而只能写成 [string, string, ...],否则不能被 markPoint / markLine 用『具体值』索引到。</li>\n</ul>\n<p>例如:</p>\n<pre><code class="lang-javascript">{\n xAxis: {\n type: 'category',\n data: ['5', '6', '9', '13', '19', '33']\n // 注意这里不建议写成 [5, 6, 9, 13, 19, 33],否则不能被 markPoint / markLine 用『具体值』索引到。\n },\n series: {\n type: 'line',\n data: [11, 22, 33, 44, 55, 66],\n markPoint: { // markLine 也是同理\n data: [{\n coord: [5, 33.4], // 其中 5 表示 xAxis.data[5],即 '33' 这个元素。\n // coord: ['5', 33.4] // 其中 '5' 表示 xAxis.data中的 '5' 这个元素。\n // 注意,使用这种方式时,xAxis.data 不能写成 [number, number, ...]\n // 而只能写成 [string, string, ...]\n }]\n }\n }\n}\n</code></pre>\n'},"markPoint.data.x":{desc:"\n\n<p>相对容器的屏幕 x 坐标,单位像素。</p>\n",uiControl:{type:"percent",default:"0"}},"markPoint.data.y":{desc:"\n\n<p>相对容器的屏幕 y 坐标,单位像素。</p>\n",uiControl:{type:"percent",default:"0"}},"markPoint.data.value":{desc:"<p>标注值,可以不设。</p>\n"},"markPoint.data.symbol":{desc:'\n\n<p>标记的图形。</p>\n<p>ECharts 提供的标记类型包括</p>\n<p><code class="codespan">'circle'</code>, <code class="codespan">'rect'</code>, <code class="codespan">'roundRect'</code>, <code class="codespan">'triangle'</code>, <code class="codespan">'diamond'</code>, <code class="codespan">'pin'</code>, <code class="codespan">'arrow'</code>, <code class="codespan">'none'</code></p>\n<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>',uiControl:{type:"icon",default:"circle"}},"markPoint.data.symbolSize":{desc:'\n\n<p>标记的大小,可以设置成诸如 <code class="codespan">10</code> 这样单一的数字,也可以用数组分开表示宽和高,例如 <code class="codespan">[20, 10]</code> 表示标记宽为<code class="codespan">20</code>,高为<code class="codespan">10</code>。</p>\n',uiControl:{type:"number",min:"0"}},"markPoint.data.symbolRotate":{desc:'\n\n<p>标记的旋转角度(而非弧度)。正值表示逆时针旋转。注意在 <code class="codespan">markLine</code> 中当 <code class="codespan">symbol</code> 为 <code class="codespan">'arrow'</code> 时会忽略 <code class="codespan">symbolRotate</code> 强制设置为切线的角度。</p>\n',uiControl:{type:"angle",min:"-180",max:"180",step:"1"}},"markPoint.data.symbolKeepAspect":{desc:'\n\n<p>如果 <code class="codespan">symbol</code> 是 <code class="codespan">path://</code> 的形式,是否在缩放时保持该图形的长宽比。</p>\n',uiControl:{type:"boolean",clean:"true"}},"markPoint.data.symbolOffset":{desc:'\n\n<p>标记相对于原本位置的偏移。默认情况下,标记会居中置放在数据对应的位置,但是如果 symbol 是自定义的矢量路径或者图片,就有可能不希望 symbol 居中。这时候可以使用该配置项配置 symbol 相对于原本居中的偏移,可以是绝对的像素值,也可以是相对的百分比。</p>\n<p>例如 <code class="codespan">[0, '50%']</code> 就是把自己向上移动了一半的位置,在 symbol 图形是气泡的时候可以让图形下端的箭头对准数据点。</p>\n',uiControl:{type:"vector",separate:"true",dims:"x,y"}},"markPoint.data.itemStyle":{desc:"<p>该标注的样式。</p>\n"},"markPoint.data.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markPoint.data.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markPoint.data.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markPoint.data.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markPoint.data.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markPoint.data.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markPoint.data.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markPoint.data.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markPoint.data.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markPoint.data.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markPoint.data.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markPoint.data.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markPoint.data.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markPoint.data.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markPoint.data.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markPoint.data.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markPoint.data.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markPoint.data.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markPoint.data.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markPoint.data.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markPoint.data.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markPoint.data.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markPoint.data.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.data.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.data.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markPoint.data.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markPoint.data.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markPoint.data.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markPoint.data.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markPoint.data.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markPoint.data.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markPoint.data.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markPoint.data.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markPoint.data.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markPoint.data.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markPoint.data.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markPoint.data.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markPoint.data.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markPoint.data.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markPoint.data.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markPoint.data.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markPoint.data.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markPoint.data.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markPoint.data.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.data.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.data.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markPoint.data.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markPoint.data.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markPoint.data.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markPoint.data.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markPoint.data.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markPoint.data.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markPoint.data.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.emphasis.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markPoint.data.emphasis.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markPoint.data.emphasis.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markPoint.data.emphasis.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markPoint.data.emphasis.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markPoint.data.emphasis.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markPoint.data.emphasis.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markPoint.data.emphasis.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markPoint.data.emphasis.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markPoint.data.emphasis.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markPoint.data.emphasis.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markPoint.data.emphasis.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markPoint.data.emphasis.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markPoint.data.emphasis.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.data.emphasis.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.data.emphasis.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.emphasis.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markPoint.data.emphasis.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markPoint.data.emphasis.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markPoint.data.emphasis.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.emphasis.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.emphasis.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.emphasis.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markPoint.data.emphasis.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markPoint.data.emphasis.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markPoint.data.emphasis.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.emphasis.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markPoint.data.emphasis.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.emphasis.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.emphasis.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.emphasis.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markPoint.data.emphasis.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markPoint.data.emphasis.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markPoint.data.emphasis.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markPoint.data.emphasis.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markPoint.data.emphasis.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markPoint.data.emphasis.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markPoint.data.emphasis.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markPoint.data.emphasis.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markPoint.data.emphasis.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markPoint.data.emphasis.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markPoint.data.emphasis.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markPoint.data.emphasis.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.data.emphasis.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.data.emphasis.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.emphasis.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markPoint.data.emphasis.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markPoint.data.emphasis.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markPoint.data.emphasis.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.emphasis.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.emphasis.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.emphasis.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markPoint.data.emphasis.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markPoint.data.emphasis.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markPoint.data.emphasis.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.emphasis.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markPoint.data.emphasis.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.emphasis.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.emphasis.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.emphasis.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markPoint.data.emphasis.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markPoint.data.emphasis.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markPoint.data.emphasis.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markPoint.data.emphasis.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markPoint.data.emphasis.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markPoint.data.emphasis.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markPoint.data.emphasis.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markPoint.data.emphasis.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markPoint.animation":{desc:"\n\n<p>是否开启动画。</p>\n",uiControl:{type:"boolean",default:"true",clean:"true"}},"markPoint.animationThreshold":{desc:"<p>是否开启动画的阈值,当单个系列显示的图形数量大于这个阈值时会关闭动画。</p>\n"},"markPoint.animationDuration":{desc:'\n\n<p>初始动画的时长,支持回调函数,可以通过每个数据返回不同的时长实现更戏剧的初始动画效果:</p>\n<pre><code class="lang-js">animationDuration: function (idx) {\n // 越往后的数据时长越大\n return idx * 100;\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",default:"1000",step:"20",clean:"true"}},"markPoint.animationEasing":{desc:'\n\n<p>初始动画的缓动效果。不同的缓动效果可以参考 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=line-easing" target="_blank">缓动示例</a>。</p>\n',uiControl:{type:"enum",options:"linear,quadraticIn,quadraticOut,quadraticInOut,cubicIn,cubicOut,cubicInOut,quarticIn,quarticOut,quarticInOut,quinticIn,quinticOut,quinticInOut,sinusoidalIn,sinusoidalOut,sinusoidalInOut,exponentialIn,exponentialOut,exponentialInOut,circularIn,circularOut,circularInOut,elasticIn,elasticOut,elasticInOut,backIn,backOut,backInOut,bounceIn,bounceOut,bounceInOut",clean:"true"}},"markPoint.animationDelay":{desc:'<p>初始动画的延迟,支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的初始动画效果。</p>\n<p>如下示例:</p>\n<pre><code class="lang-js">animationDelay: function (idx) {\n // 越往后的数据延迟越大\n return idx * 100;\n}\n</code></pre>\n<p>也可以看<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-animation-delay" target="_blank">该示例</a></p>\n'},"markPoint.animationDurationUpdate":{desc:'\n\n<p>数据更新动画的时长。</p>\n<p>支持回调函数,可以通过每个数据返回不同的时长实现更戏剧的更新动画效果:</p>\n<pre><code class="lang-js">animationDurationUpdate: function (idx) {\n // 越往后的数据时长越大\n return idx * 100;\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",default:"1000",step:"20"}},"markPoint.animationEasingUpdate":{desc:"\n\n<p>数据更新动画的缓动效果。</p>\n",uiControl:{type:"enum",options:"linear,quadraticIn,quadraticOut,quadraticInOut,cubicIn,cubicOut,cubicInOut,quarticIn,quarticOut,quarticInOut,quinticIn,quinticOut,quinticInOut,sinusoidalIn,sinusoidalOut,sinusoidalInOut,exponentialIn,exponentialOut,exponentialInOut,circularIn,circularOut,circularInOut,elasticIn,elasticOut,elasticInOut,backIn,backOut,backInOut,bounceIn,bounceOut,bounceInOut"}},"markPoint.animationDelayUpdate":{desc:'<p>数据更新动画的延迟,支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的更新动画效果。</p>\n<p>如下示例:</p>\n<pre><code class="lang-js">animationDelayUpdate: function (idx) {\n // 越往后的数据延迟越大\n return idx * 100;\n}\n</code></pre>\n<p>也可以看<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-animation-delay" target="_blank">该示例</a></p>\n'},markLine:{desc:"<p>图表标线。</p>\n"},"markLine.silent":{desc:"\n\n<p>图形是否不响应和触发鼠标事件,默认为 false,即响应和触发鼠标事件。</p>\n",uiControl:{type:"boolean"}},"markLine.symbol":{desc:'<p>标线两端的标记类型,可以是一个数组分别指定两端,也可以是单个统一指定,具体格式见 <a href="#series-line.markLine.data.0.symbol">data.symbol</a>。</p>\n'},"markLine.symbolSize":{desc:'<p>标线两端的标记大小,可以是一个数组分别指定两端,也可以是单个统一指定。</p>\n<p><strong>注意:</strong> 这里无法像一般的 <code class="codespan">symbolSize</code> 那样通过数组分别指定高宽。</p>\n'},"markLine.precision":{desc:"<p>标线数值的精度,在显示平均值线的时候有用。</p>\n"},"markLine.label":{desc:"<p>标线的文本。</p>\n"},"markLine.label.show":{desc:"<p>是否显示标签。</p>\n"},"markLine.label.position":{desc:'<p>标签位置,可选:</p>\n<ul>\n<li><code class="codespan">'start'</code> 线的起始点。</li>\n<li><code class="codespan">'middle'</code> 线的中点。</li>\n<li><code class="codespan">'end'</code> 线的结束点。</li>\n</ul>\n<p>4.7.0 版本起,支持更多标签位置:<code class="codespan">'start'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'end'</code>, <code class="codespan">'insideStartTop'</code>, <code class="codespan">'insideStartBottom'</code>, <code class="codespan">'insideMiddleTop'</code>, <code class="codespan">'insideMiddleBottom'</code>, <code class="codespan">'insideEndTop'</code>, <code class="codespan">'insideEndBottom'</code>。</p>\n<p>其中,<code class="codespan">'insideMiddleBottom'</code> 等同于 <code class="codespan">'middle'</code>。具体位置参见下图。</p>\n<p>文字与线的间距可以通过 <a href="#series-.markLine.label.distance">label.distance</a> 调整。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-markline&reset=1&edit=1" width="800" height="500"><iframe />\n\n'},"markLine.label.distance":{desc:"<p>标签与线之间的间距。如果是数组,第一项为横向间距,第二项为纵向间距。如果是数字,则表示横向纵向使用相同的间距。</p>\n"},"markLine.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markLine.lineStyle":{desc:"<p>标线的样式</p>\n"},"markLine.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markLine.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"markLine.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markLine.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markLine.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markLine.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markLine.lineStyle.curveness":{desc:"\n\n<p>边的曲度,支持从 0 到 1 的值,值越大曲度越大。</p>\n",uiControl:{type:"number",min:"0",max:"1",step:"0.01",default:"0"}},"markLine.emphasis":{desc:"<p>标线的高亮样式。</p>\n"},"markLine.emphasis.label.show":{desc:"<p>是否显示标签。</p>\n"},"markLine.emphasis.label.position":{desc:'<p>标签位置,可选:</p>\n<ul>\n<li><code class="codespan">'start'</code> 线的起始点。</li>\n<li><code class="codespan">'middle'</code> 线的中点。</li>\n<li><code class="codespan">'end'</code> 线的结束点。</li>\n</ul>\n<p>4.7.0 版本起,支持更多标签位置:<code class="codespan">'start'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'end'</code>, <code class="codespan">'insideStartTop'</code>, <code class="codespan">'insideStartBottom'</code>, <code class="codespan">'insideMiddleTop'</code>, <code class="codespan">'insideMiddleBottom'</code>, <code class="codespan">'insideEndTop'</code>, <code class="codespan">'insideEndBottom'</code>。</p>\n<p>其中,<code class="codespan">'insideMiddleBottom'</code> 等同于 <code class="codespan">'middle'</code>。具体位置参见下图。</p>\n<p>文字与线的间距可以通过 <a href="#series-.markLine.label.distance">label.distance</a> 调整。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-markline&reset=1&edit=1" width="800" height="500"><iframe />\n\n'},"markLine.emphasis.label.distance":{desc:"<p>标签与线之间的间距。如果是数组,第一项为横向间距,第二项为纵向间距。如果是数字,则表示横向纵向使用相同的间距。</p>\n"},"markLine.emphasis.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markLine.emphasis.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markLine.emphasis.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"markLine.emphasis.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markLine.emphasis.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markLine.emphasis.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markLine.emphasis.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.emphasis.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.emphasis.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markLine.blur":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>标线的淡出样式。淡出的规则跟随所在系列。</p>\n'},"markLine.blur.label.show":{desc:"<p>是否显示标签。</p>\n"},"markLine.blur.label.position":{desc:'<p>标签位置,可选:</p>\n<ul>\n<li><code class="codespan">'start'</code> 线的起始点。</li>\n<li><code class="codespan">'middle'</code> 线的中点。</li>\n<li><code class="codespan">'end'</code> 线的结束点。</li>\n</ul>\n<p>4.7.0 版本起,支持更多标签位置:<code class="codespan">'start'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'end'</code>, <code class="codespan">'insideStartTop'</code>, <code class="codespan">'insideStartBottom'</code>, <code class="codespan">'insideMiddleTop'</code>, <code class="codespan">'insideMiddleBottom'</code>, <code class="codespan">'insideEndTop'</code>, <code class="codespan">'insideEndBottom'</code>。</p>\n<p>其中,<code class="codespan">'insideMiddleBottom'</code> 等同于 <code class="codespan">'middle'</code>。具体位置参见下图。</p>\n<p>文字与线的间距可以通过 <a href="#series-.markLine.label.distance">label.distance</a> 调整。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-markline&reset=1&edit=1" width="800" height="500"><iframe />\n\n'},"markLine.blur.label.distance":{desc:"<p>标签与线之间的间距。如果是数组,第一项为横向间距,第二项为纵向间距。如果是数字,则表示横向纵向使用相同的间距。</p>\n"},"markLine.blur.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markLine.blur.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markLine.blur.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"markLine.blur.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markLine.blur.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markLine.blur.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markLine.blur.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.blur.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.blur.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markLine.data":{desc:'<p>标线的数据数组。每个数组项可以是一个两个值的数组,分别表示线的起点和终点,每一项是一个对象,有下面几种方式指定起点或终点的位置。</p>\n<ol>\n<li>通过 <a href="#series-line.markLine.data.0.x">x</a>, <a href="#series-line.markLine.data.0.y">y</a> 属性指定相对容器的屏幕坐标,单位像素,支持百分比。</li>\n</ol>\n<ol start="2">\n<li><p>用 <a href="#series-line.markLine.data.0.coord">coord</a> 属性指定数据在相应坐标系上的坐标位置,单个维度支持设置 <code class="codespan">'min'</code>, <code class="codespan">'max'</code>, <code class="codespan">'average'</code>。</p>\n</li>\n<li><p>直接用 <a href="#series-line.markLine.data.0.type">type</a> 属性标注系列中的最大值,最小值。这时候可以使用 <a href="#series-line.markLine.data.0.valueIndex">valueIndex</a> 或者 <a href="#series-line.markLine.data.0.valueDim">valueDim</a> 指定是在哪个维度上的最大值、最小值、平均值。</p>\n</li>\n<li><p>如果是笛卡尔坐标系的话,也可以通过只指定 <code class="codespan">xAxis</code> 或者 <code class="codespan">yAxis</code> 来实现 X 轴或者 Y 轴为某值的标线,见示例 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=scatter-weight" target="_blank">scatter-weight</a></p>\n</li>\n</ol>\n<p>当多个属性同时存在时,优先级按上述的顺序。</p>\n<p>也可以是直接通过 <code class="codespan">type</code> 设置该标线的类型,是最大值的线还是平均线。同样的,这时候可以通过使用 <code class="codespan">valueIndex</code> 指定维度。</p>\n<pre><code>data: [\n\n{\n name: '平均线',\n // 支持 'average', 'min', 'max'\n type: 'average'\n },\n {\n name: 'Y 轴值为 100 的水平线',\n yAxis: 100\n },\n [\n {\n // 起点和终点的项会共用一个 name\n name: '最小值到最大值',\n type: 'min'\n },\n {\n type: 'max'\n }\n ],\n[\n {\n name: '两个坐标之间的标线',\n coord: [10, 20]\n },\n {\n coord: [20, 30]\n }\n ], [{\n // 固定起点的 x 像素位置,用于模拟一条指向最大值的水平线\n yAxis: 'max',\n x: '90%'\n }, {\n type: 'max'\n }],\n[\n {\n name: '两个屏幕坐标之间的标线',\n x: 100,\n y: 100\n },\n {\n x: 500,\n y: 200\n }\n ]\n]\n</code></pre>'},"markLine.data.0":{desc:"<p>起点的数据。</p>\n"},"markLine.data.0.type":{desc:'\n\n<p>特殊的标注类型,用于标注最大值最小值等。</p>\n<p><strong>可选:</strong></p>\n<ul>\n<li><code class="codespan">'min'</code> 最小值。</li>\n<li><code class="codespan">'max'</code> 最大值。</li>\n<li><code class="codespan">'average'</code> 平均值。</li>\n<li><code class="codespan">'median'</code> 中位数。</li>\n</ul>\n',uiControl:{type:"enum",options:"min,max,average"}},"markLine.data.0.valueIndex":{desc:'\n\n<p>在使用 <a href="#series-line.markLine.data.type">type</a> 时有效,用于指定在哪个维度上指定最大值最小值,可以是 <code class="codespan">0</code>(xAxis, radiusAxis),<code class="codespan">1</code>(yAxis, angleAxis),默认使用第一个数值轴所在的维度。</p>\n',uiControl:{type:"number",min:"0",max:"1",step:"1"}},"markLine.data.0.valueDim":{desc:'<p>在使用 <a href="#series-line.markLine.data.type">type</a> 时有效,用于指定在哪个维度上指定最大值最小值。这可以是维度的直接名称,例如折线图时可以是<code class="codespan">x</code>、<code class="codespan">angle</code>等、candlestick 图时可以是<code class="codespan">open</code>、<code class="codespan">close</code>等维度名称。</p>\n'},"markLine.data.0.coord":{desc:'<p>起点或终点的坐标。坐标格式视系列的坐标系而定,可以是<a href="#grid">直角坐标系</a>上的 <code class="codespan">x</code>, <code class="codespan">y</code>,也可以是<a href="#polar">极坐标系</a>上的 <code class="codespan">radius</code>, <code class="codespan">angle</code>。</p>\n<p><strong>注:</strong>对于 <a href="#xAixs.type">axis.type</a> 为 <code class="codespan">'category'</code> 类型的轴</p>\n<ul>\n<li>如果 coord 值为 <code class="codespan">number</code>,则表示 <a href="#xAxis.data">axis.data</a> 的 index。</li>\n<li>如果 coord 值为 <code class="codespan">string</code>,则表示 <a href="#xAxis.data">axis.data</a> 中具体的值。注意使用这种方式时,xAxis.data 不能写成 [number, number, ...],而只能写成 [string, string, ...],否则不能被 markPoint / markLine 用『具体值』索引到。</li>\n</ul>\n<p>例如:</p>\n<pre><code class="lang-javascript">{\n xAxis: {\n type: 'category',\n data: ['5', '6', '9', '13', '19', '33']\n // 注意这里不建议写成 [5, 6, 9, 13, 19, 33],否则不能被 markPoint / markLine 用『具体值』索引到。\n },\n series: {\n type: 'line',\n data: [11, 22, 33, 44, 55, 66],\n markPoint: { // markLine 也是同理\n data: [{\n coord: [5, 33.4], // 其中 5 表示 xAxis.data[5],即 '33' 这个元素。\n // coord: ['5', 33.4] // 其中 '5' 表示 xAxis.data中的 '5' 这个元素。\n // 注意,使用这种方式时,xAxis.data 不能写成 [number, number, ...]\n // 而只能写成 [string, string, ...]\n }]\n }\n }\n}\n</code></pre>\n'},"markLine.data.0.name":{desc:"<p>标注名称,将会作为文字显示。</p>\n"},"markLine.data.0.x":{desc:"\n\n<p>相对容器的屏幕 x 坐标,单位像素。</p>\n",uiControl:{type:"percent",default:"0"}},"markLine.data.0.y":{desc:"\n\n<p>相对容器的屏幕 y 坐标,单位像素。</p>\n",uiControl:{type:"percent",default:"0"}},"markLine.data.0.value":{desc:"<p>标注值,可以不设。</p>\n"},"markLine.data.0.symbol":{desc:'\n\n<p>起点标记的图形。</p>\n<p>ECharts 提供的标记类型包括</p>\n<p><code class="codespan">'circle'</code>, <code class="codespan">'rect'</code>, <code class="codespan">'roundRect'</code>, <code class="codespan">'triangle'</code>, <code class="codespan">'diamond'</code>, <code class="codespan">'pin'</code>, <code class="codespan">'arrow'</code>, <code class="codespan">'none'</code></p>\n<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>',uiControl:{type:"icon",default:"circle"}},"markLine.data.0.symbolSize":{desc:'\n\n<p>起点标记的大小,可以设置成诸如 <code class="codespan">10</code> 这样单一的数字,也可以用数组分开表示宽和高,例如 <code class="codespan">[20, 10]</code> 表示标记宽为<code class="codespan">20</code>,高为<code class="codespan">10</code>。</p>\n',uiControl:{type:"number",min:"0"}},"markLine.data.0.symbolRotate":{desc:'\n\n<p>起点标记的旋转角度(而非弧度)。正值表示逆时针旋转。注意在 <code class="codespan">markLine</code> 中当 <code class="codespan">symbol</code> 为 <code class="codespan">'arrow'</code> 时会忽略 <code class="codespan">symbolRotate</code> 强制设置为切线的角度。</p>\n',uiControl:{type:"angle",min:"-180",max:"180",step:"1"}},"markLine.data.0.symbolKeepAspect":{desc:'\n\n<p>如果 <code class="codespan">symbol</code> 是 <code class="codespan">path://</code> 的形式,是否在缩放时保持该图形的长宽比。</p>\n',uiControl:{type:"boolean",clean:"true"}},"markLine.data.0.symbolOffset":{desc:'\n\n<p>起点标记相对于原本位置的偏移。默认情况下,标记会居中置放在数据对应的位置,但是如果 symbol 是自定义的矢量路径或者图片,就有可能不希望 symbol 居中。这时候可以使用该配置项配置 symbol 相对于原本居中的偏移,可以是绝对的像素值,也可以是相对的百分比。</p>\n<p>例如 <code class="codespan">[0, '50%']</code> 就是把自己向上移动了一半的位置,在 symbol 图形是气泡的时候可以让图形下端的箭头对准数据点。</p>\n',uiControl:{type:"vector",separate:"true",dims:"x,y"}},"markLine.data.0.lineStyle":{desc:'<p>该数据项线的样式,起点和终点项的 <code class="codespan">lineStyle</code>会合并到一起。</p>\n'},"markLine.data.0.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markLine.data.0.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"markLine.data.0.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markLine.data.0.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markLine.data.0.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markLine.data.0.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.0.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.0.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markLine.data.0.lineStyle.curveness":{desc:"\n\n<p>边的曲度,支持从 0 到 1 的值,值越大曲度越大。</p>\n",uiControl:{type:"number",min:"0",max:"1",step:"0.01",default:"0"}},"markLine.data.0.label":{desc:'<p>该数据项标签的样式,起点和终点项的 <code class="codespan">label</code>会合并到一起。</p>\n'},"markLine.data.0.label.show":{desc:"<p>是否显示标签。</p>\n"},"markLine.data.0.label.position":{desc:'<p>标签位置,可选:</p>\n<ul>\n<li><code class="codespan">'start'</code> 线的起始点。</li>\n<li><code class="codespan">'middle'</code> 线的中点。</li>\n<li><code class="codespan">'end'</code> 线的结束点。</li>\n</ul>\n<p>4.7.0 版本起,支持更多标签位置:<code class="codespan">'start'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'end'</code>, <code class="codespan">'insideStartTop'</code>, <code class="codespan">'insideStartBottom'</code>, <code class="codespan">'insideMiddleTop'</code>, <code class="codespan">'insideMiddleBottom'</code>, <code class="codespan">'insideEndTop'</code>, <code class="codespan">'insideEndBottom'</code>。</p>\n<p>其中,<code class="codespan">'insideMiddleBottom'</code> 等同于 <code class="codespan">'middle'</code>。具体位置参见下图。</p>\n<p>文字与线的间距可以通过 <a href="#series-.markLine.label.distance">label.distance</a> 调整。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-markline&reset=1&edit=1" width="800" height="500"><iframe />\n\n'},"markLine.data.0.label.distance":{desc:"<p>标签与线之间的间距。如果是数组,第一项为横向间距,第二项为纵向间距。如果是数字,则表示横向纵向使用相同的间距。</p>\n"},"markLine.data.0.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markLine.data.0.emphasis.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markLine.data.0.emphasis.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"markLine.data.0.emphasis.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markLine.data.0.emphasis.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markLine.data.0.emphasis.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markLine.data.0.emphasis.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.0.emphasis.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.0.emphasis.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markLine.data.0.emphasis.lineStyle.curveness":{desc:"\n\n<p>边的曲度,支持从 0 到 1 的值,值越大曲度越大。</p>\n",uiControl:{type:"number",min:"0",max:"1",step:"0.01",default:"0"}},"markLine.data.0.emphasis.label.show":{desc:"<p>是否显示标签。</p>\n"},"markLine.data.0.emphasis.label.position":{desc:'<p>标签位置,可选:</p>\n<ul>\n<li><code class="codespan">'start'</code> 线的起始点。</li>\n<li><code class="codespan">'middle'</code> 线的中点。</li>\n<li><code class="codespan">'end'</code> 线的结束点。</li>\n</ul>\n<p>4.7.0 版本起,支持更多标签位置:<code class="codespan">'start'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'end'</code>, <code class="codespan">'insideStartTop'</code>, <code class="codespan">'insideStartBottom'</code>, <code class="codespan">'insideMiddleTop'</code>, <code class="codespan">'insideMiddleBottom'</code>, <code class="codespan">'insideEndTop'</code>, <code class="codespan">'insideEndBottom'</code>。</p>\n<p>其中,<code class="codespan">'insideMiddleBottom'</code> 等同于 <code class="codespan">'middle'</code>。具体位置参见下图。</p>\n<p>文字与线的间距可以通过 <a href="#series-.markLine.label.distance">label.distance</a> 调整。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-markline&reset=1&edit=1" width="800" height="500"><iframe />\n\n'},"markLine.data.0.emphasis.label.distance":{desc:"<p>标签与线之间的间距。如果是数组,第一项为横向间距,第二项为纵向间距。如果是数字,则表示横向纵向使用相同的间距。</p>\n"},"markLine.data.0.emphasis.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markLine.data.0.blur":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n'},"markLine.data.0.blur.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markLine.data.0.blur.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"markLine.data.0.blur.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markLine.data.0.blur.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markLine.data.0.blur.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markLine.data.0.blur.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.0.blur.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.0.blur.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markLine.data.0.blur.lineStyle.curveness":{desc:"\n\n<p>边的曲度,支持从 0 到 1 的值,值越大曲度越大。</p>\n",uiControl:{type:"number",min:"0",max:"1",step:"0.01",default:"0"}},"markLine.data.0.blur.label.show":{desc:"<p>是否显示标签。</p>\n"},"markLine.data.0.blur.label.position":{desc:'<p>标签位置,可选:</p>\n<ul>\n<li><code class="codespan">'start'</code> 线的起始点。</li>\n<li><code class="codespan">'middle'</code> 线的中点。</li>\n<li><code class="codespan">'end'</code> 线的结束点。</li>\n</ul>\n<p>4.7.0 版本起,支持更多标签位置:<code class="codespan">'start'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'end'</code>, <code class="codespan">'insideStartTop'</code>, <code class="codespan">'insideStartBottom'</code>, <code class="codespan">'insideMiddleTop'</code>, <code class="codespan">'insideMiddleBottom'</code>, <code class="codespan">'insideEndTop'</code>, <code class="codespan">'insideEndBottom'</code>。</p>\n<p>其中,<code class="codespan">'insideMiddleBottom'</code> 等同于 <code class="codespan">'middle'</code>。具体位置参见下图。</p>\n<p>文字与线的间距可以通过 <a href="#series-.markLine.label.distance">label.distance</a> 调整。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-markline&reset=1&edit=1" width="800" height="500"><iframe />\n\n'},"markLine.data.0.blur.label.distance":{desc:"<p>标签与线之间的间距。如果是数组,第一项为横向间距,第二项为纵向间距。如果是数字,则表示横向纵向使用相同的间距。</p>\n"},"markLine.data.0.blur.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markLine.data.1":{desc:"<p>终点的数据。</p>\n"},"markLine.data.1.type":{desc:'\n\n<p>特殊的标注类型,用于标注最大值最小值等。</p>\n<p><strong>可选:</strong></p>\n<ul>\n<li><code class="codespan">'min'</code> 最小值。</li>\n<li><code class="codespan">'max'</code> 最大值。</li>\n<li><code class="codespan">'average'</code> 平均值。</li>\n<li><code class="codespan">'median'</code> 中位数。</li>\n</ul>\n',uiControl:{type:"enum",options:"min,max,average"}},"markLine.data.1.valueIndex":{desc:'\n\n<p>在使用 <a href="#series-line.markLine.data.type">type</a> 时有效,用于指定在哪个维度上指定最大值最小值,可以是 <code class="codespan">0</code>(xAxis, radiusAxis),<code class="codespan">1</code>(yAxis, angleAxis),默认使用第一个数值轴所在的维度。</p>\n',uiControl:{type:"number",min:"0",max:"1",step:"1"}},"markLine.data.1.valueDim":{desc:'<p>在使用 <a href="#series-line.markLine.data.type">type</a> 时有效,用于指定在哪个维度上指定最大值最小值。这可以是维度的直接名称,例如折线图时可以是<code class="codespan">x</code>、<code class="codespan">angle</code>等、candlestick 图时可以是<code class="codespan">open</code>、<code class="codespan">close</code>等维度名称。</p>\n'},"markLine.data.1.coord":{desc:'<p>起点或终点的坐标。坐标格式视系列的坐标系而定,可以是<a href="#grid">直角坐标系</a>上的 <code class="codespan">x</code>, <code class="codespan">y</code>,也可以是<a href="#polar">极坐标系</a>上的 <code class="codespan">radius</code>, <code class="codespan">angle</code>。</p>\n<p><strong>注:</strong>对于 <a href="#xAixs.type">axis.type</a> 为 <code class="codespan">'category'</code> 类型的轴</p>\n<ul>\n<li>如果 coord 值为 <code class="codespan">number</code>,则表示 <a href="#xAxis.data">axis.data</a> 的 index。</li>\n<li>如果 coord 值为 <code class="codespan">string</code>,则表示 <a href="#xAxis.data">axis.data</a> 中具体的值。注意使用这种方式时,xAxis.data 不能写成 [number, number, ...],而只能写成 [string, string, ...],否则不能被 markPoint / markLine 用『具体值』索引到。</li>\n</ul>\n<p>例如:</p>\n<pre><code class="lang-javascript">{\n xAxis: {\n type: 'category',\n data: ['5', '6', '9', '13', '19', '33']\n // 注意这里不建议写成 [5, 6, 9, 13, 19, 33],否则不能被 markPoint / markLine 用『具体值』索引到。\n },\n series: {\n type: 'line',\n data: [11, 22, 33, 44, 55, 66],\n markPoint: { // markLine 也是同理\n data: [{\n coord: [5, 33.4], // 其中 5 表示 xAxis.data[5],即 '33' 这个元素。\n // coord: ['5', 33.4] // 其中 '5' 表示 xAxis.data中的 '5' 这个元素。\n // 注意,使用这种方式时,xAxis.data 不能写成 [number, number, ...]\n // 而只能写成 [string, string, ...]\n }]\n }\n }\n}\n</code></pre>\n'},"markLine.data.1.name":{desc:"<p>标注名称,将会作为文字显示。</p>\n"},"markLine.data.1.x":{desc:"\n\n<p>相对容器的屏幕 x 坐标,单位像素。</p>\n",uiControl:{type:"percent",default:"0"}},"markLine.data.1.y":{desc:"\n\n<p>相对容器的屏幕 y 坐标,单位像素。</p>\n",uiControl:{type:"percent",default:"0"}},"markLine.data.1.value":{desc:"<p>标注值,可以不设。</p>\n"},"markLine.data.1.symbol":{desc:'\n\n<p>终点标记的图形。</p>\n<p>ECharts 提供的标记类型包括</p>\n<p><code class="codespan">'circle'</code>, <code class="codespan">'rect'</code>, <code class="codespan">'roundRect'</code>, <code class="codespan">'triangle'</code>, <code class="codespan">'diamond'</code>, <code class="codespan">'pin'</code>, <code class="codespan">'arrow'</code>, <code class="codespan">'none'</code></p>\n<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>',uiControl:{type:"icon",default:"circle"}},"markLine.data.1.symbolSize":{desc:'\n\n<p>终点标记的大小,可以设置成诸如 <code class="codespan">10</code> 这样单一的数字,也可以用数组分开表示宽和高,例如 <code class="codespan">[20, 10]</code> 表示标记宽为<code class="codespan">20</code>,高为<code class="codespan">10</code>。</p>\n',uiControl:{type:"number",min:"0"}},"markLine.data.1.symbolRotate":{desc:'\n\n<p>终点标记的旋转角度(而非弧度)。正值表示逆时针旋转。注意在 <code class="codespan">markLine</code> 中当 <code class="codespan">symbol</code> 为 <code class="codespan">'arrow'</code> 时会忽略 <code class="codespan">symbolRotate</code> 强制设置为切线的角度。</p>\n',uiControl:{type:"angle",min:"-180",max:"180",step:"1"}},"markLine.data.1.symbolKeepAspect":{desc:'\n\n<p>如果 <code class="codespan">symbol</code> 是 <code class="codespan">path://</code> 的形式,是否在缩放时保持该图形的长宽比。</p>\n',uiControl:{type:"boolean",clean:"true"}},"markLine.data.1.symbolOffset":{desc:'\n\n<p>终点标记相对于原本位置的偏移。默认情况下,标记会居中置放在数据对应的位置,但是如果 symbol 是自定义的矢量路径或者图片,就有可能不希望 symbol 居中。这时候可以使用该配置项配置 symbol 相对于原本居中的偏移,可以是绝对的像素值,也可以是相对的百分比。</p>\n<p>例如 <code class="codespan">[0, '50%']</code> 就是把自己向上移动了一半的位置,在 symbol 图形是气泡的时候可以让图形下端的箭头对准数据点。</p>\n',uiControl:{type:"vector",separate:"true",dims:"x,y"}},"markLine.data.1.lineStyle":{desc:'<p>该数据项线的样式,起点和终点项的 <code class="codespan">lineStyle</code>会合并到一起。</p>\n'},"markLine.data.1.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markLine.data.1.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"markLine.data.1.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markLine.data.1.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markLine.data.1.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markLine.data.1.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.1.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.1.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markLine.data.1.lineStyle.curveness":{desc:"\n\n<p>边的曲度,支持从 0 到 1 的值,值越大曲度越大。</p>\n",uiControl:{type:"number",min:"0",max:"1",step:"0.01",default:"0"}},"markLine.data.1.label":{desc:'<p>该数据项标签的样式,起点和终点项的 <code class="codespan">label</code>会合并到一起。</p>\n'},"markLine.data.1.label.show":{desc:"<p>是否显示标签。</p>\n"},"markLine.data.1.label.position":{desc:'<p>标签位置,可选:</p>\n<ul>\n<li><code class="codespan">'start'</code> 线的起始点。</li>\n<li><code class="codespan">'middle'</code> 线的中点。</li>\n<li><code class="codespan">'end'</code> 线的结束点。</li>\n</ul>\n<p>4.7.0 版本起,支持更多标签位置:<code class="codespan">'start'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'end'</code>, <code class="codespan">'insideStartTop'</code>, <code class="codespan">'insideStartBottom'</code>, <code class="codespan">'insideMiddleTop'</code>, <code class="codespan">'insideMiddleBottom'</code>, <code class="codespan">'insideEndTop'</code>, <code class="codespan">'insideEndBottom'</code>。</p>\n<p>其中,<code class="codespan">'insideMiddleBottom'</code> 等同于 <code class="codespan">'middle'</code>。具体位置参见下图。</p>\n<p>文字与线的间距可以通过 <a href="#series-.markLine.label.distance">label.distance</a> 调整。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-markline&reset=1&edit=1" width="800" height="500"><iframe />\n\n'},"markLine.data.1.label.distance":{desc:"<p>标签与线之间的间距。如果是数组,第一项为横向间距,第二项为纵向间距。如果是数字,则表示横向纵向使用相同的间距。</p>\n"},"markLine.data.1.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markLine.data.1.emphasis.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markLine.data.1.emphasis.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"markLine.data.1.emphasis.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markLine.data.1.emphasis.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markLine.data.1.emphasis.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markLine.data.1.emphasis.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.1.emphasis.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.1.emphasis.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markLine.data.1.emphasis.lineStyle.curveness":{desc:"\n\n<p>边的曲度,支持从 0 到 1 的值,值越大曲度越大。</p>\n",uiControl:{type:"number",min:"0",max:"1",step:"0.01",default:"0"}},"markLine.data.1.emphasis.label.show":{desc:"<p>是否显示标签。</p>\n"},"markLine.data.1.emphasis.label.position":{desc:'<p>标签位置,可选:</p>\n<ul>\n<li><code class="codespan">'start'</code> 线的起始点。</li>\n<li><code class="codespan">'middle'</code> 线的中点。</li>\n<li><code class="codespan">'end'</code> 线的结束点。</li>\n</ul>\n<p>4.7.0 版本起,支持更多标签位置:<code class="codespan">'start'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'end'</code>, <code class="codespan">'insideStartTop'</code>, <code class="codespan">'insideStartBottom'</code>, <code class="codespan">'insideMiddleTop'</code>, <code class="codespan">'insideMiddleBottom'</code>, <code class="codespan">'insideEndTop'</code>, <code class="codespan">'insideEndBottom'</code>。</p>\n<p>其中,<code class="codespan">'insideMiddleBottom'</code> 等同于 <code class="codespan">'middle'</code>。具体位置参见下图。</p>\n<p>文字与线的间距可以通过 <a href="#series-.markLine.label.distance">label.distance</a> 调整。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-markline&reset=1&edit=1" width="800" height="500"><iframe />\n\n'},"markLine.data.1.emphasis.label.distance":{desc:"<p>标签与线之间的间距。如果是数组,第一项为横向间距,第二项为纵向间距。如果是数字,则表示横向纵向使用相同的间距。</p>\n"},"markLine.data.1.emphasis.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markLine.data.1.blur":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n'},"markLine.data.1.blur.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markLine.data.1.blur.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"markLine.data.1.blur.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markLine.data.1.blur.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markLine.data.1.blur.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markLine.data.1.blur.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.1.blur.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.1.blur.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markLine.data.1.blur.lineStyle.curveness":{desc:"\n\n<p>边的曲度,支持从 0 到 1 的值,值越大曲度越大。</p>\n",uiControl:{type:"number",min:"0",max:"1",step:"0.01",default:"0"}},"markLine.data.1.blur.label.show":{desc:"<p>是否显示标签。</p>\n"},"markLine.data.1.blur.label.position":{desc:'<p>标签位置,可选:</p>\n<ul>\n<li><code class="codespan">'start'</code> 线的起始点。</li>\n<li><code class="codespan">'middle'</code> 线的中点。</li>\n<li><code class="codespan">'end'</code> 线的结束点。</li>\n</ul>\n<p>4.7.0 版本起,支持更多标签位置:<code class="codespan">'start'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'end'</code>, <code class="codespan">'insideStartTop'</code>, <code class="codespan">'insideStartBottom'</code>, <code class="codespan">'insideMiddleTop'</code>, <code class="codespan">'insideMiddleBottom'</code>, <code class="codespan">'insideEndTop'</code>, <code class="codespan">'insideEndBottom'</code>。</p>\n<p>其中,<code class="codespan">'insideMiddleBottom'</code> 等同于 <code class="codespan">'middle'</code>。具体位置参见下图。</p>\n<p>文字与线的间距可以通过 <a href="#series-.markLine.label.distance">label.distance</a> 调整。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-markline&reset=1&edit=1" width="800" height="500"><iframe />\n\n'},"markLine.data.1.blur.label.distance":{desc:"<p>标签与线之间的间距。如果是数组,第一项为横向间距,第二项为纵向间距。如果是数字,则表示横向纵向使用相同的间距。</p>\n"},"markLine.data.1.blur.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markLine.animation":{desc:"\n\n<p>是否开启动画。</p>\n",uiControl:{type:"boolean",default:"true",clean:"true"}},"markLine.animationThreshold":{desc:"<p>是否开启动画的阈值,当单个系列显示的图形数量大于这个阈值时会关闭动画。</p>\n"},"markLine.animationDuration":{desc:'\n\n<p>初始动画的时长,支持回调函数,可以通过每个数据返回不同的时长实现更戏剧的初始动画效果:</p>\n<pre><code class="lang-js">animationDuration: function (idx) {\n // 越往后的数据时长越大\n return idx * 100;\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",default:"1000",step:"20",clean:"true"}},"markLine.animationEasing":{desc:'\n\n<p>初始动画的缓动效果。不同的缓动效果可以参考 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=line-easing" target="_blank">缓动示例</a>。</p>\n',uiControl:{type:"enum",options:"linear,quadraticIn,quadraticOut,quadraticInOut,cubicIn,cubicOut,cubicInOut,quarticIn,quarticOut,quarticInOut,quinticIn,quinticOut,quinticInOut,sinusoidalIn,sinusoidalOut,sinusoidalInOut,exponentialIn,exponentialOut,exponentialInOut,circularIn,circularOut,circularInOut,elasticIn,elasticOut,elasticInOut,backIn,backOut,backInOut,bounceIn,bounceOut,bounceInOut",clean:"true"}},"markLine.animationDelay":{desc:'<p>初始动画的延迟,支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的初始动画效果。</p>\n<p>如下示例:</p>\n<pre><code class="lang-js">animationDelay: function (idx) {\n // 越往后的数据延迟越大\n return idx * 100;\n}\n</code></pre>\n<p>也可以看<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-animation-delay" target="_blank">该示例</a></p>\n'},"markLine.animationDurationUpdate":{desc:'\n\n<p>数据更新动画的时长。</p>\n<p>支持回调函数,可以通过每个数据返回不同的时长实现更戏剧的更新动画效果:</p>\n<pre><code class="lang-js">animationDurationUpdate: function (idx) {\n // 越往后的数据时长越大\n return idx * 100;\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",default:"1000",step:"20"}},"markLine.animationEasingUpdate":{desc:"\n\n<p>数据更新动画的缓动效果。</p>\n",uiControl:{type:"enum",options:"linear,quadraticIn,quadraticOut,quadraticInOut,cubicIn,cubicOut,cubicInOut,quarticIn,quarticOut,quarticInOut,quinticIn,quinticOut,quinticInOut,sinusoidalIn,sinusoidalOut,sinusoidalInOut,exponentialIn,exponentialOut,exponentialInOut,circularIn,circularOut,circularInOut,elasticIn,elasticOut,elasticInOut,backIn,backOut,backInOut,bounceIn,bounceOut,bounceInOut"}},"markLine.animationDelayUpdate":{desc:'<p>数据更新动画的延迟,支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的更新动画效果。</p>\n<p>如下示例:</p>\n<pre><code class="lang-js">animationDelayUpdate: function (idx) {\n // 越往后的数据延迟越大\n return idx * 100;\n}\n</code></pre>\n<p>也可以看<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-animation-delay" target="_blank">该示例</a></p>\n'},markArea:{desc:"<p>图表标域,常用于标记图表中某个范围的数据,例如标出某段时间投放了广告。</p>\n"},"markArea.silent":{desc:"\n\n<p>图形是否不响应和触发鼠标事件,默认为 false,即响应和触发鼠标事件。</p>\n",uiControl:{type:"boolean"}},"markArea.label":{desc:"<p>标域文本配置。</p>\n"},"markArea.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markArea.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markArea.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markArea.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markArea.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markArea.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markArea.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markArea.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markArea.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markArea.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markArea.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markArea.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.itemStyle":{desc:"<p>该标域的样式。</p>\n"},"markArea.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markArea.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markArea.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markArea.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markArea.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markArea.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markArea.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markArea.emphasis":{desc:"<p>高亮的标域样式</p>\n"},"markArea.emphasis.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markArea.emphasis.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markArea.emphasis.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markArea.emphasis.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markArea.emphasis.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markArea.emphasis.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.emphasis.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.emphasis.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.emphasis.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.emphasis.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.emphasis.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.emphasis.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.emphasis.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.emphasis.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.emphasis.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.emphasis.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.emphasis.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.emphasis.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.emphasis.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.emphasis.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.emphasis.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.emphasis.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.emphasis.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markArea.emphasis.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markArea.emphasis.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.emphasis.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.emphasis.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.emphasis.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.emphasis.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.emphasis.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.emphasis.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markArea.emphasis.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markArea.emphasis.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markArea.emphasis.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markArea.emphasis.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.emphasis.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.emphasis.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.emphasis.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.emphasis.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.emphasis.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.emphasis.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.emphasis.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.emphasis.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.emphasis.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.emphasis.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.emphasis.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.emphasis.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.emphasis.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.emphasis.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.emphasis.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.emphasis.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.emphasis.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.emphasis.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.emphasis.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.emphasis.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.emphasis.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.emphasis.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.emphasis.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.emphasis.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.emphasis.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markArea.emphasis.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markArea.emphasis.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markArea.emphasis.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markArea.emphasis.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markArea.emphasis.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markArea.emphasis.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.emphasis.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.emphasis.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markArea.blur":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>淡出的标域样式。淡出的规则跟随所在系列。</p>\n'},"markArea.blur.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markArea.blur.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markArea.blur.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markArea.blur.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markArea.blur.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markArea.blur.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.blur.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.blur.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.blur.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.blur.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.blur.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.blur.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.blur.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.blur.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.blur.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.blur.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.blur.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.blur.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.blur.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.blur.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.blur.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.blur.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.blur.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markArea.blur.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markArea.blur.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.blur.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.blur.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.blur.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.blur.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.blur.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.blur.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markArea.blur.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markArea.blur.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markArea.blur.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markArea.blur.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.blur.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.blur.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.blur.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.blur.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.blur.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.blur.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.blur.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.blur.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.blur.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.blur.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.blur.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.blur.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.blur.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.blur.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.blur.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.blur.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.blur.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.blur.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.blur.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.blur.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.blur.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.blur.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.blur.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.blur.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.blur.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markArea.blur.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markArea.blur.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markArea.blur.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markArea.blur.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markArea.blur.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markArea.blur.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.blur.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.blur.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markArea.data":{desc:'<p>标域的数据数组。每个数组项是一个两个项的数组,分别表示标域左上角和右下角的位置,每个项支持通过下面几种方式指定自己的位置</p>\n<ol>\n<li>通过 <a href="#series-line.markArea.data.0.x">x</a>, <a href="#series-line.markArea.data.0.y">y</a> 属性指定相对容器的屏幕坐标,单位像素,支持百分比。</li>\n</ol>\n<ol start="2">\n<li><p>用 <a href="#series-line.markArea.data.0.coord">coord</a> 属性指定数据在相应坐标系上的坐标位置,单个维度支持设置 <code class="codespan">'min'</code>, <code class="codespan">'max'</code>, <code class="codespan">'average'</code>。</p>\n</li>\n<li><p>直接用 <a href="#series-line.markArea.data.0.type">type</a> 属性标注系列中的最大值,最小值。这时候可以使用 <a href="#series-line.markArea.data.0.valueIndex">valueIndex</a> 或者 <a href="#series-line.markPoint.data.0.valueDim">valueDim</a> 指定是在哪个维度上的最大值、最小值、平均值。</p>\n</li>\n<li><p>如果是笛卡尔坐标系的话,也可以通过只指定 <code class="codespan">xAxis</code> 或者 <code class="codespan">yAxis</code> 来实现 X 轴或者 Y 轴为某值的标域,见示例 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=scatter-weight" target="_blank">scatter-weight</a></p>\n</li>\n</ol>\n<p>当多个属性同时存在时,优先级按上述的顺序。</p>\n<pre><code>data: [\n\n\n [\n {\n name: '平均值到最大值',\n type: 'average'\n },\n {\n type: 'max'\n }\n ],\n\n [\n {\n name: '两个坐标之间的标域',\n coord: [10, 20]\n },\n {\n coord: [20, 30]\n }\n ], [\n {\n name: '60分到80分',\n yAxis: 60\n },\n {\n yAxis: 80\n }\n ], [\n {\n name: '所有数据范围区间',\n coord: ['min', 'min']\n },\n {\n coord: ['max', 'max']\n }\n ],\n[\n {\n name: '两个屏幕坐标之间的标域',\n x: 100,\n y: 100\n }, {\n x: '90%',\n y: '10%'\n }\n ]\n]\n</code></pre>'},"markArea.data.0":{desc:"<p>标域左上角的数据</p>\n"},"markArea.data.0.type":{desc:'\n\n<p>特殊的标注类型,用于标注最大值最小值等。</p>\n<p><strong>可选:</strong></p>\n<ul>\n<li><code class="codespan">'min'</code> 最大值。</li>\n<li><code class="codespan">'max'</code> 最大值。</li>\n<li><code class="codespan">'average'</code> 平均值。</li>\n</ul>\n',uiControl:{type:"enum",options:"min,max,average"}},"markArea.data.0.valueIndex":{desc:'\n\n<p>在使用 <a href="#series-line.markArea.data.type">type</a> 时有效,用于指定在哪个维度上指定最大值最小值,可以是 <code class="codespan">0</code>(xAxis, radiusAxis),<code class="codespan">1</code>(yAxis, angleAxis),默认使用第一个数值轴所在的维度。</p>\n',uiControl:{type:"number",min:"0",max:"1",step:"1"}},"markArea.data.0.valueDim":{desc:'<p>在使用 <a href="#series-line.markArea.data.type">type</a> 时有效,用于指定在哪个维度上指定最大值最小值。这可以是维度的直接名称,例如折线图时可以是<code class="codespan">x</code>、<code class="codespan">angle</code>等、candlestick 图时可以是<code class="codespan">open</code>、<code class="codespan">close</code>等维度名称。</p>\n'},"markArea.data.0.coord":{desc:'<p>起点或终点的坐标。坐标格式视系列的坐标系而定,可以是<a href="#grid">直角坐标系</a>上的 <code class="codespan">x</code>, <code class="codespan">y</code>,也可以是<a href="#polar">极坐标系</a>上的 <code class="codespan">radius</code>, <code class="codespan">angle</code>。</p>\n'},"markArea.data.0.name":{desc:"<p>标注名称,将会作为文字显示。</p>\n"},"markArea.data.0.x":{desc:'\n\n<p>相对容器的屏幕 x 坐标,单位像素,支持百分比形式,例如 <code class="codespan">'20%'</code>。</p>\n',uiControl:{type:"percent",default:"0"}},"markArea.data.0.y":{desc:'\n\n<p>相对容器的屏幕 y 坐标,单位像素,支持百分比形式,例如 <code class="codespan">'20%'</code>。</p>\n',uiControl:{type:"percent",default:"0"}},"markArea.data.0.value":{desc:"<p>标域值,可以不设。</p>\n"},"markArea.data.0.itemStyle":{desc:'<p>该数据项区域的样式,起点和终点项的<code class="codespan">itemStyle</code>会合并到一起。</p>\n'},"markArea.data.0.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markArea.data.0.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markArea.data.0.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markArea.data.0.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markArea.data.0.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markArea.data.0.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markArea.data.0.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.0.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.0.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markArea.data.0.label":{desc:'<p>该数据项标签的样式,起点和终点项的<code class="codespan">label</code>会合并到一起。</p>\n'},"markArea.data.0.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markArea.data.0.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markArea.data.0.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markArea.data.0.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markArea.data.0.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markArea.data.0.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.0.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.0.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.0.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.0.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.0.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.0.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.0.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.0.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.0.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.0.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.0.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markArea.data.0.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markArea.data.0.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.0.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.0.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markArea.data.0.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markArea.data.0.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markArea.data.0.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markArea.data.0.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.0.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.0.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.0.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.0.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.0.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.0.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.0.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.0.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.0.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.0.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.0.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.0.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.0.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.0.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.0.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.emphasis.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markArea.data.0.emphasis.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markArea.data.0.emphasis.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markArea.data.0.emphasis.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markArea.data.0.emphasis.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markArea.data.0.emphasis.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markArea.data.0.emphasis.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.0.emphasis.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.0.emphasis.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markArea.data.0.emphasis.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markArea.data.0.emphasis.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markArea.data.0.emphasis.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markArea.data.0.emphasis.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markArea.data.0.emphasis.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markArea.data.0.emphasis.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.0.emphasis.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.0.emphasis.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.0.emphasis.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.0.emphasis.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.0.emphasis.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.0.emphasis.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.0.emphasis.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.0.emphasis.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.emphasis.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.emphasis.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.emphasis.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.0.emphasis.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.0.emphasis.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.0.emphasis.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.emphasis.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.emphasis.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.emphasis.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markArea.data.0.emphasis.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markArea.data.0.emphasis.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.0.emphasis.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.emphasis.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.0.emphasis.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.emphasis.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.emphasis.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.emphasis.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markArea.data.0.emphasis.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markArea.data.0.emphasis.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markArea.data.0.emphasis.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markArea.data.0.emphasis.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.0.emphasis.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.0.emphasis.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.0.emphasis.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.0.emphasis.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.0.emphasis.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.0.emphasis.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.0.emphasis.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.0.emphasis.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.emphasis.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.emphasis.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.emphasis.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.0.emphasis.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.0.emphasis.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.0.emphasis.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.emphasis.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.emphasis.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.emphasis.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.0.emphasis.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.0.emphasis.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.0.emphasis.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.emphasis.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.0.emphasis.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.emphasis.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.emphasis.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.blur":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n'},"markArea.data.0.blur.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markArea.data.0.blur.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markArea.data.0.blur.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markArea.data.0.blur.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markArea.data.0.blur.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markArea.data.0.blur.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markArea.data.0.blur.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.0.blur.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.0.blur.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markArea.data.0.blur.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markArea.data.0.blur.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markArea.data.0.blur.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markArea.data.0.blur.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markArea.data.0.blur.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markArea.data.0.blur.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.0.blur.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.0.blur.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.0.blur.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.0.blur.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.0.blur.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.0.blur.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.0.blur.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.0.blur.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.blur.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.blur.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.blur.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.0.blur.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.0.blur.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.0.blur.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.blur.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.blur.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.blur.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markArea.data.0.blur.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markArea.data.0.blur.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.0.blur.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.blur.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.0.blur.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.blur.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.blur.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.blur.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markArea.data.0.blur.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markArea.data.0.blur.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markArea.data.0.blur.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markArea.data.0.blur.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.0.blur.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.0.blur.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.0.blur.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.0.blur.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.0.blur.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.0.blur.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.0.blur.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.0.blur.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.blur.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.blur.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.blur.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.0.blur.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.0.blur.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.0.blur.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.blur.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.blur.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.blur.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.0.blur.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.0.blur.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.0.blur.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.blur.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.0.blur.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.blur.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.blur.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1":{desc:"<p>标域右下角的数据</p>\n"},"markArea.data.1.type":{desc:'\n\n<p>特殊的标注类型,用于标注最大值最小值等。</p>\n<p><strong>可选:</strong></p>\n<ul>\n<li><code class="codespan">'min'</code> 最大值。</li>\n<li><code class="codespan">'max'</code> 最大值。</li>\n<li><code class="codespan">'average'</code> 平均值。</li>\n</ul>\n',uiControl:{type:"enum",options:"min,max,average"}},"markArea.data.1.valueIndex":{desc:'\n\n<p>在使用 <a href="#series-line.markArea.data.type">type</a> 时有效,用于指定在哪个维度上指定最大值最小值,可以是 <code class="codespan">0</code>(xAxis, radiusAxis),<code class="codespan">1</code>(yAxis, angleAxis),默认使用第一个数值轴所在的维度。</p>\n',uiControl:{type:"number",min:"0",max:"1",step:"1"}},"markArea.data.1.valueDim":{desc:'<p>在使用 <a href="#series-line.markArea.data.type">type</a> 时有效,用于指定在哪个维度上指定最大值最小值。这可以是维度的直接名称,例如折线图时可以是<code class="codespan">x</code>、<code class="codespan">angle</code>等、candlestick 图时可以是<code class="codespan">open</code>、<code class="codespan">close</code>等维度名称。</p>\n'},"markArea.data.1.coord":{desc:'<p>起点或终点的坐标。坐标格式视系列的坐标系而定,可以是<a href="#grid">直角坐标系</a>上的 <code class="codespan">x</code>, <code class="codespan">y</code>,也可以是<a href="#polar">极坐标系</a>上的 <code class="codespan">radius</code>, <code class="codespan">angle</code>。</p>\n'},"markArea.data.1.name":{desc:"<p>标注名称,将会作为文字显示。</p>\n"},"markArea.data.1.x":{desc:'\n\n<p>相对容器的屏幕 x 坐标,单位像素,支持百分比形式,例如 <code class="codespan">'20%'</code>。</p>\n',uiControl:{type:"percent",default:"0"}},"markArea.data.1.y":{desc:'\n\n<p>相对容器的屏幕 y 坐标,单位像素,支持百分比形式,例如 <code class="codespan">'20%'</code>。</p>\n',uiControl:{type:"percent",default:"0"}},"markArea.data.1.value":{desc:"<p>标域值,可以不设。</p>\n"},"markArea.data.1.itemStyle":{desc:'<p>该数据项区域的样式,起点和终点项的<code class="codespan">itemStyle</code>会合并到一起。</p>\n'},"markArea.data.1.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markArea.data.1.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markArea.data.1.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markArea.data.1.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markArea.data.1.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markArea.data.1.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markArea.data.1.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.1.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.1.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markArea.data.1.label":{desc:'<p>该数据项标签的样式,起点和终点项的<code class="codespan">label</code>会合并到一起。</p>\n'},"markArea.data.1.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markArea.data.1.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markArea.data.1.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markArea.data.1.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markArea.data.1.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markArea.data.1.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.1.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.1.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.1.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.1.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.1.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.1.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.1.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.1.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.1.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.1.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.1.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markArea.data.1.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markArea.data.1.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.1.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.1.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markArea.data.1.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markArea.data.1.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markArea.data.1.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markArea.data.1.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.1.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.1.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.1.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.1.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.1.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.1.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.1.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.1.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.1.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.1.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.1.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.1.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.1.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.1.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.1.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.emphasis.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markArea.data.1.emphasis.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markArea.data.1.emphasis.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markArea.data.1.emphasis.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markArea.data.1.emphasis.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markArea.data.1.emphasis.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markArea.data.1.emphasis.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.1.emphasis.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.1.emphasis.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markArea.data.1.emphasis.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markArea.data.1.emphasis.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markArea.data.1.emphasis.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markArea.data.1.emphasis.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markArea.data.1.emphasis.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markArea.data.1.emphasis.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.1.emphasis.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.1.emphasis.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.1.emphasis.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.1.emphasis.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.1.emphasis.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.1.emphasis.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.1.emphasis.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.1.emphasis.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.emphasis.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.emphasis.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.emphasis.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.1.emphasis.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.1.emphasis.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.1.emphasis.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.emphasis.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.emphasis.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.emphasis.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markArea.data.1.emphasis.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markArea.data.1.emphasis.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.1.emphasis.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.emphasis.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.1.emphasis.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.emphasis.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.emphasis.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.emphasis.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markArea.data.1.emphasis.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markArea.data.1.emphasis.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markArea.data.1.emphasis.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markArea.data.1.emphasis.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.1.emphasis.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.1.emphasis.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.1.emphasis.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.1.emphasis.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.1.emphasis.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.1.emphasis.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.1.emphasis.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.1.emphasis.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.emphasis.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.emphasis.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.emphasis.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.1.emphasis.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.1.emphasis.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.1.emphasis.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.emphasis.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.emphasis.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.emphasis.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.1.emphasis.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.1.emphasis.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.1.emphasis.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.emphasis.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.1.emphasis.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.emphasis.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.emphasis.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.blur":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n'},"markArea.data.1.blur.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markArea.data.1.blur.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markArea.data.1.blur.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markArea.data.1.blur.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markArea.data.1.blur.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markArea.data.1.blur.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markArea.data.1.blur.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.1.blur.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.1.blur.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markArea.data.1.blur.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markArea.data.1.blur.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markArea.data.1.blur.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markArea.data.1.blur.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markArea.data.1.blur.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markArea.data.1.blur.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.1.blur.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.1.blur.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.1.blur.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.1.blur.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.1.blur.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.1.blur.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.1.blur.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.1.blur.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.blur.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.blur.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.blur.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.1.blur.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.1.blur.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.1.blur.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.blur.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.blur.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.blur.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markArea.data.1.blur.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markArea.data.1.blur.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.1.blur.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.blur.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.1.blur.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.blur.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.blur.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.blur.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markArea.data.1.blur.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markArea.data.1.blur.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markArea.data.1.blur.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markArea.data.1.blur.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.1.blur.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.1.blur.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.1.blur.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.1.blur.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.1.blur.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.1.blur.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.1.blur.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.1.blur.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.blur.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.blur.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.blur.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.1.blur.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.1.blur.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.1.blur.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.blur.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.blur.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.blur.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.1.blur.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.1.blur.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.1.blur.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.blur.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.1.blur.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.blur.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.blur.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.animation":{desc:"\n\n<p>是否开启动画。</p>\n",uiControl:{type:"boolean",default:"false",clean:"true"}},"markArea.animationThreshold":{desc:"<p>是否开启动画的阈值,当单个系列显示的图形数量大于这个阈值时会关闭动画。</p>\n"},"markArea.animationDuration":{desc:'\n\n<p>初始动画的时长,支持回调函数,可以通过每个数据返回不同的时长实现更戏剧的初始动画效果:</p>\n<pre><code class="lang-js">animationDuration: function (idx) {\n // 越往后的数据时长越大\n return idx * 100;\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",default:"1000",step:"20",clean:"true"}},"markArea.animationEasing":{desc:'\n\n<p>初始动画的缓动效果。不同的缓动效果可以参考 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=line-easing" target="_blank">缓动示例</a>。</p>\n',uiControl:{type:"enum",options:"linear,quadraticIn,quadraticOut,quadraticInOut,cubicIn,cubicOut,cubicInOut,quarticIn,quarticOut,quarticInOut,quinticIn,quinticOut,quinticInOut,sinusoidalIn,sinusoidalOut,sinusoidalInOut,exponentialIn,exponentialOut,exponentialInOut,circularIn,circularOut,circularInOut,elasticIn,elasticOut,elasticInOut,backIn,backOut,backInOut,bounceIn,bounceOut,bounceInOut",clean:"true"}},"markArea.animationDelay":{desc:'<p>初始动画的延迟,支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的初始动画效果。</p>\n<p>如下示例:</p>\n<pre><code class="lang-js">animationDelay: function (idx) {\n // 越往后的数据延迟越大\n return idx * 100;\n}\n</code></pre>\n<p>也可以看<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-animation-delay" target="_blank">该示例</a></p>\n'},"markArea.animationDurationUpdate":{desc:'\n\n<p>数据更新动画的时长。</p>\n<p>支持回调函数,可以通过每个数据返回不同的时长实现更戏剧的更新动画效果:</p>\n<pre><code class="lang-js">animationDurationUpdate: function (idx) {\n // 越往后的数据时长越大\n return idx * 100;\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",default:"1000",step:"20"}},"markArea.animationEasingUpdate":{desc:"\n\n<p>数据更新动画的缓动效果。</p>\n",uiControl:{type:"enum",options:"linear,quadraticIn,quadraticOut,quadraticInOut,cubicIn,cubicOut,cubicInOut,quarticIn,quarticOut,quarticInOut,quinticIn,quinticOut,quinticInOut,sinusoidalIn,sinusoidalOut,sinusoidalInOut,exponentialIn,exponentialOut,exponentialInOut,circularIn,circularOut,circularInOut,elasticIn,elasticOut,elasticInOut,backIn,backOut,backInOut,bounceIn,bounceOut,bounceInOut"}},"markArea.animationDelayUpdate":{desc:'<p>数据更新动画的延迟,支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的更新动画效果。</p>\n<p>如下示例:</p>\n<pre><code class="lang-js">animationDelayUpdate: function (idx) {\n // 越往后的数据延迟越大\n return idx * 100;\n}\n</code></pre>\n<p>也可以看<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-animation-delay" target="_blank">该示例</a></p>\n'},zlevel:{desc:'<p>折线图所有图形的 zlevel 值。</p>\n<p><code class="codespan">zlevel</code>用于 Canvas 分层,不同<code class="codespan">zlevel</code>值的图形会放置在不同的 Canvas 中,Canvas 分层是一种常见的优化手段。我们可以把一些图形变化频繁(例如有动画)的组件设置成一个单独的<code class="codespan">zlevel</code>。需要注意的是过多的 Canvas 会引起内存开销的增大,在手机端上需要谨慎使用以防崩溃。</p>\n<p><code class="codespan">zlevel</code> 大的 Canvas 会放在 <code class="codespan">zlevel</code> 小的 Canvas 的上面。</p>\n'},z:{desc:'<p>折线图组件的所有图形的<code class="codespan">z</code>值。控制图形的前后顺序。<code class="codespan">z</code>值小的图形会被<code class="codespan">z</code>值大的图形覆盖。</p>\n<p><code class="codespan">z</code>相比<code class="codespan">zlevel</code>优先级更低,而且不会创建新的 Canvas。</p>\n'},silent:{desc:"\n\n<p>图形是否不响应和触发鼠标事件,默认为 false,即响应和触发鼠标事件。</p>\n",uiControl:{type:"boolean"}},animation:{desc:"\n\n<p>是否开启动画。</p>\n",uiControl:{type:"boolean",default:"true",clean:"true"}},animationThreshold:{desc:"<p>是否开启动画的阈值,当单个系列显示的图形数量大于这个阈值时会关闭动画。</p>\n"},animationDuration:{desc:'\n\n<p>初始动画的时长,支持回调函数,可以通过每个数据返回不同的时长实现更戏剧的初始动画效果:</p>\n<pre><code class="lang-js">animationDuration: function (idx) {\n // 越往后的数据时长越大\n return idx * 100;\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",default:"1000",step:"20",clean:"true"}},animationEasing:{desc:'\n\n<p>初始动画的缓动效果。不同的缓动效果可以参考 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=line-easing" target="_blank">缓动示例</a>。</p>\n',uiControl:{type:"enum",options:"linear,quadraticIn,quadraticOut,quadraticInOut,cubicIn,cubicOut,cubicInOut,quarticIn,quarticOut,quarticInOut,quinticIn,quinticOut,quinticInOut,sinusoidalIn,sinusoidalOut,sinusoidalInOut,exponentialIn,exponentialOut,exponentialInOut,circularIn,circularOut,circularInOut,elasticIn,elasticOut,elasticInOut,backIn,backOut,backInOut,bounceIn,bounceOut,bounceInOut",clean:"true"}},animationDelay:{desc:'<p>初始动画的延迟,支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的初始动画效果。</p>\n<p>如下示例:</p>\n<pre><code class="lang-js">animationDelay: function (idx) {\n // 越往后的数据延迟越大\n return idx * 100;\n}\n</code></pre>\n<p>也可以看<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-animation-delay" target="_blank">该示例</a></p>\n'},animationDurationUpdate:{desc:'\n\n<p>数据更新动画的时长。</p>\n<p>支持回调函数,可以通过每个数据返回不同的时长实现更戏剧的更新动画效果:</p>\n<pre><code class="lang-js">animationDurationUpdate: function (idx) {\n // 越往后的数据时长越大\n return idx * 100;\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",default:"1000",step:"20"}},animationEasingUpdate:{desc:"\n\n<p>数据更新动画的缓动效果。</p>\n",uiControl:{type:"enum",options:"linear,quadraticIn,quadraticOut,quadraticInOut,cubicIn,cubicOut,cubicInOut,quarticIn,quarticOut,quarticInOut,quinticIn,quinticOut,quinticInOut,sinusoidalIn,sinusoidalOut,sinusoidalInOut,exponentialIn,exponentialOut,exponentialInOut,circularIn,circularOut,circularInOut,elasticIn,elasticOut,elasticInOut,backIn,backOut,backInOut,bounceIn,bounceOut,bounceInOut"}},animationDelayUpdate:{desc:'<p>数据更新动画的延迟,支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的更新动画效果。</p>\n<p>如下示例:</p>\n<pre><code class="lang-js">animationDelayUpdate: function (idx) {\n // 越往后的数据延迟越大\n return idx * 100;\n}\n</code></pre>\n<p>也可以看<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-animation-delay" target="_blank">该示例</a></p>\n'},tooltip:{desc:"<p>本系列特定的 tooltip 设定。</p>\n"},"tooltip.position":{desc:'<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的位置,默认不设置时位置会跟随鼠标的位置。</p>\n<p>可选:</p>\n<ul>\n<li><p><code class="codespan">Array</code></p>\n<p> 通过数组表示提示框浮层的位置,支持数字设置绝对位置,百分比设置相对位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对位置,相对于容器左侧 10px, 上侧 10 px\n position: [10, 10]\n // 相对位置,放置在容器正中间\n position: ['50%', '50%']\n</code></pre>\n</li>\n<li><p><code class="codespan">Function</code></p>\n<p> 回调函数,格式如下:</p>\n<pre><code class="lang-js"> (point: Array, params: Object|Array.<Object>, dom: HTMLDomElement, rect: Object, size: Object) => Array\n</code></pre>\n<p> <strong>参数:</strong><br>\n point: 鼠标位置,如 [20, 40]。<br>\n params: 同 formatter 的参数相同。<br>\n dom: tooltip 的 dom 对象。<br>\n rect: 只有鼠标在图形上时有效,是一个用<code class="codespan">x</code>, <code class="codespan">y</code>, <code class="codespan">width</code>, <code class="codespan">height</code>四个属性表达的图形包围盒。<br>\n size: 包括 dom 的尺寸和 echarts 容器的当前尺寸,例如:<code class="codespan">{contentSize: [width, height], viewSize: [width, height]}</code>。<br></p>\n<p> <strong>返回值:</strong><br>\n 可以是一个表示 tooltip 位置的数组,数组值可以是绝对的像素值,也可以是相 百分比。<br>\n 也可以是一个对象,如:<code class="codespan">{left: 10, top: 30}</code>,或者 <code class="codespan">{right: '20%', bottom: 40}</code>。<br></p>\n<p> 如下示例:</p>\n<pre><code class="lang-js"> position: function (point, params, dom, rect, size) {\n // 固定在顶部\n return [point[0], '10%'];\n }\n</code></pre>\n<p> 或者:</p>\n<pre><code class="lang-js"> position: function (pos, params, dom, rect, size) {\n // 鼠标在左侧时 tooltip 显示到右侧,鼠标在右侧时 tooltip 显示到左侧。\n var obj = {top: 60};\n obj[['left', 'right'][+(pos[0] < size.viewSize[0] / 2)]] = 5;\n return obj;\n }\n</code></pre>\n</li>\n</ul>\n<ul>\n<li><p><code class="codespan">'inside'</code></p>\n<p> 鼠标所在图形的内部中心位置,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'top'</code></p>\n<p> 鼠标所在图形上侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'left'</code></p>\n<p> 鼠标所在图形左侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'right'</code></p>\n<p> 鼠标所在图形右侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'bottom'</code></p>\n<p> 鼠标所在图形底侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n</ul>\n'},"tooltip.formatter":{desc:'<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层内容格式器,支持字符串模板和回调函数两种形式。</p>\n<p><strong>1, 字符串模板</strong></p>\n<p>模板变量有 <code class="codespan">{a}</code>, <code class="codespan">{b}</code>,<code class="codespan">{c}</code>,<code class="codespan">{d}</code>,<code class="codespan">{e}</code>,分别表示系列名,数据名,数据值等。\n在 <a href="#tooltip.trigger">trigger</a> 为 <code class="codespan">'axis'</code> 的时候,会有多个系列的数据,此时可以通过 <code class="codespan">{a0}</code>, <code class="codespan">{a1}</code>, <code class="codespan">{a2}</code> 这种后面加索引的方式表示系列的索引。\n不同图表类型下的 <code class="codespan">{a}</code>,<code class="codespan">{b}</code>,<code class="codespan">{c}</code>,<code class="codespan">{d}</code> 含义不一样。\n其中变量<code class="codespan">{a}</code>, <code class="codespan">{b}</code>, <code class="codespan">{c}</code>, <code class="codespan">{d}</code>在不同图表类型下代表数据含义为:</p>\n<ul>\n<li><p>折线(区域)图、柱状(条形)图、K线图 : <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(类目值),<code class="codespan">{c}</code>(数值), <code class="codespan">{d}</code>(无)</p>\n</li>\n<li><p>散点图(气泡)图 : <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(数据名称),<code class="codespan">{c}</code>(数值数组), <code class="codespan">{d}</code>(无)</p>\n</li>\n<li><p>地图 : <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(区域名称),<code class="codespan">{c}</code>(合并数值), <code class="codespan">{d}</code>(无)</p>\n</li>\n<li><p>饼图、仪表盘、漏斗图: <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(数据项名称),<code class="codespan">{c}</code>(数值), <code class="codespan">{d}</code>(百分比)</p>\n</li>\n</ul>\n<p>更多其它图表模板变量的含义可以见相应的图表的 label.formatter 配置项。</p>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b0}: {c0}<br />{b1}: {c1}'\n</code></pre>\n<p><strong>2, 回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array, ticket: string, callback: (ticket: string, html: string)) => string\n</code></pre>\n<p>第一个参数 <code class="codespan">params</code> 是 formatter 需要的数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n // 饼图的百分比\n percent: number,\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n<p>在 <a href="#tooltip.trigger">trigger</a> 为 <code class="codespan">'axis'</code> 的时候,或者 tooltip 被 <a href="#xAxis.axisPointer">axisPointer</a> 触发的时候,<code class="codespan">params</code> 是多个系列的数据数组。其中每项内容格式同上,并且,</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n<p><strong>注:</strong> ECharts 2.x 使用数组表示各参数的方式不再支持。</p>\n<p>第二个参数 <code class="codespan">ticket</code> 是异步回调标识,配合第三个参数 <code class="codespan">callback</code> 使用。\n第三个参数 <code class="codespan">callback</code> 是异步回调,在提示框浮层内容是异步获取的时候,可以通过 callback 传入上述的 <code class="codespan">ticket</code> 和 <code class="codespan">html</code> 更新提示框浮层内容。</p>\n<p>示例:</p>\n<pre><code class="lang-js">formatter: function (params, ticket, callback) {\n $.get('detail?name=' + params.name, function (content) {\n callback(ticket, toHTML(content));\n });\n return 'Loading';\n}\n</code></pre>\n'},"tooltip.backgroundColor":{desc:'<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的背景颜色。</p>\n'},"tooltip.borderColor":{desc:'\n\n\n\n\n<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的边框颜色。</p>\n',uiControl:{type:"color",default:"#333"}},"tooltip.borderWidth":{desc:'\n\n\n\n\n<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的边框宽。</p>\n',uiControl:{type:"number",default:"0",step:"0.5"}},"tooltip.padding":{desc:'\n\n\n\n\n<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n\n\n<p>提示框浮层内边距,单位px,默认各方向内边距为5,接受数组分别设定上右下左边距。</p>\n<p>使用示例:</p>\n<pre><code class="lang-js">// 设置内边距为 5\npadding: 5\n// 设置上下的内边距为 5,左右的内边距为 10\npadding: [5, 10]\n// 分别设置四个方向的内边距\npadding: [\n 5, // 上\n 10, // 右\n 5, // 下\n 10, // 左\n]\n</code></pre>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"tooltip.textStyle":{desc:'<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的文本样式。</p>\n'},"tooltip.textStyle.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"'#fff'"}},"tooltip.textStyle.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"tooltip.textStyle.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"tooltip.textStyle.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"tooltip.textStyle.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"14",min:"1",step:"1"}},"tooltip.textStyle.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"tooltip.textStyle.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"tooltip.textStyle.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"tooltip.textStyle.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"tooltip.textStyle.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"tooltip.textStyle.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"tooltip.textStyle.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"tooltip.textStyle.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"tooltip.textStyle.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"tooltip.textStyle.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"tooltip.textStyle.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"tooltip.textStyle.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"tooltip.extraCssText":{desc:'<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>额外附加到浮层的 css 样式。如下为浮层添加阴影的示例:</p>\n<pre><code class="lang-js">extraCssText: 'box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);'\n</code></pre>\n'}}),s("bar",{id:{desc:"<p>组件 ID。默认不指定。指定则可用于在 option 或者 API 中引用组件。</p>\n"},name:{desc:'<p>系列名称,用于<a href="#tooltip">tooltip</a>的显示,<a href="#legend">legend</a> 的图例筛选,在 <code class="codespan">setOption</code> 更新数据和配置项时用于指定对应的系列。</p>\n'},legendHoverLink:{desc:'\n\n<p>是否启用<a href="#legend">图例</a> hover 时的联动高亮。</p>\n',uiControl:{type:"boolean",default:"true"}},coordinateSystem:{desc:'<p>该系列使用的坐标系,可选:</p>\n<ul>\n<li><p><code class="codespan">'cartesian2d'</code></p>\n<p> 使用二维的直角坐标系(也称笛卡尔坐标系),通过 <a href="#series-bar.xAxisIndex">xAxisIndex</a>, <a href="#series-bar.yAxisIndex">yAxisIndex</a>指定相应的坐标轴组件。</p>\n</li>\n</ul>\n'},xAxisIndex:{desc:'<p>使用的 <a href="#xAxis">x 轴</a>的 index,在单个图表实例中存在多个 x 轴的时候有用。</p>\n'},yAxisIndex:{desc:'<p>使用的 <a href="#yAxis">y 轴</a>的 index,在单个图表实例中存在多个 y轴的时候有用。</p>\n'},roundCap:{desc:'\n\n\n\n<blockquote>\n<p>从 <code class="codespan">v4.5.0</code> 开始支持</p>\n</blockquote>\n\n\n<p>是否在环形柱条两侧使用圆弧效果。</p>\n<p>仅对极坐标系柱状图有效。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=polar-roundCap&reset=1&edit=1" width="800" height="500"><iframe />\n\n',uiControl:{type:"boolean",clean:"true"}},showBackground:{desc:'<blockquote>\n<p>从 <code class="codespan">v4.7.0</code> 开始支持</p>\n</blockquote>\n\n\n<p>是否显示柱条的背景色。通过 <a href="#series-bar.backgroundStyle">backgroundStyle</a> 配置背景样式。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-background&reset=1&edit=1" width="800" height="400"><iframe />\n\n',uiControl:{type:"boolean",clean:"true"}},backgroundStyle:{desc:'<blockquote>\n<p>从 <code class="codespan">v4.7.0</code> 开始支持</p>\n</blockquote>\n<p>每一个柱条的背景样式。需要将 <a href="#series-bar.showBackground">showBackground</a> 设置为 <code class="codespan">true</code> 时才有效。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-background&reset=1&edit=1" width="800" height="400"><iframe />\n\n\n\n'},"backgroundStyle.color":{desc:"\n\n<p>柱条的颜色。</p>\n",uiControl:{type:"color"}},"backgroundStyle.borderColor":{desc:"\n\n<p>柱条的描边颜色。</p>\n",uiControl:{type:"color",value:"#000"}},"backgroundStyle.borderWidth":{desc:"\n\n<p>柱条的描边宽度,默认不描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"backgroundStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"backgroundStyle.borderRadius":{desc:"\n\n<p>圆角半径,单位px,支持传入数组分别指定 4 个圆角半径。\n如:</p>\n<pre><code>borderRadius: 5, // 统一设置四个角的圆角大小\nborderRadius: [5, 5, 0, 0] //(顺时针左上,右上,右下,左下)\n</code></pre>",uiControl:{type:"vector",min:"0",dims:"LT,RT,RB,LB"}},"backgroundStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"backgroundStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"backgroundStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"backgroundStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"backgroundStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},label:{desc:"<p>图形上的文本标签,可用于说明图形的一些数据信息,比如值,名称等。</p>\n"},"label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {@score}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},labelLine:{desc:"<p>标签的视觉引导线配置。</p>\n"},"labelLine.show":{desc:"\n\n<p>是否显示视觉引导线。</p>\n",uiControl:{type:"boolean"}},"labelLine.showAbove":{desc:"<p>是否显示在图形上方。</p>\n"},"labelLine.length2":{desc:"\n\n<p>视觉引导项第二段的长度。</p>\n",uiControl:{type:"number",default:"15",min:"0",step:"1"}},"labelLine.smooth":{desc:'\n\n<p>是否平滑视觉引导线,默认不平滑,可以设置成 <code class="codespan">true</code> 平滑显示,也可以设置为 0 到 1 的值,表示平滑程度。</p>\n',uiControl:{type:"boolean"}},"labelLine.minTurnAngle":{desc:"<p>通过调整第二段线的长度,限制引导线两端之间最小的夹角,以防止过小的夹角导致显示不美观。</p>\n<p>可以设置为 0 - 180 度。</p>\n"},"labelLine.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"labelLine.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"labelLine.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"labelLine.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"labelLine.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"labelLine.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"labelLine.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"labelLine.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},itemStyle:{desc:"<p> 图形样式。</p>\n"},"itemStyle.color":{desc:"\n\n<p>柱条的颜色。</p>\n",uiControl:{type:"color"}},"itemStyle.borderColor":{desc:"\n\n<p>柱条的描边颜色。</p>\n",uiControl:{type:"color",value:"#000"}},"itemStyle.borderWidth":{desc:"\n\n<p>柱条的描边宽度,默认不描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"itemStyle.borderRadius":{desc:"\n\n<p>圆角半径,单位px,支持传入数组分别指定 4 个圆角半径。\n如:</p>\n<pre><code>borderRadius: 5, // 统一设置四个角的圆角大小\nborderRadius: [5, 5, 0, 0] //(顺时针左上,右上,右下,左下)\n</code></pre>",uiControl:{type:"vector",min:"0",dims:"LT,RT,RB,LB"}},"itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"itemStyle.decal(Object | 'none')":{desc:'<p>图形的贴花图案,在 <a href="#aria.enabled">aria.enabled</a> 与 <a href="#aria.decal.show">aria.decal.show</a> 都是 <code class="codespan">true</code> 的情况下才生效。</p>\n<p>如果为 <code class="codespan">'none'</code> 表示不使用贴花图案。</p>\n'},"itemStyle.decal(Object | 'none').symbol(string|string[]) = 'rect'":{desc:'<p>贴花的图案,如果是 <code class="codespan">string[]</code> 表示循环使用数组中的图案。</p>\n<p>ECharts 提供的标记类型包括</p>\n<p><code class="codespan">'circle'</code>, <code class="codespan">'rect'</code>, <code class="codespan">'roundRect'</code>, <code class="codespan">'triangle'</code>, <code class="codespan">'diamond'</code>, <code class="codespan">'pin'</code>, <code class="codespan">'arrow'</code>, <code class="codespan">'none'</code></p>\n<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>'},"itemStyle.decal(Object | 'none').symbolSize":{desc:'<p>取值范围:<code class="codespan">0</code> 到 <code class="codespan">1</code>,表示占图案区域的百分比。</p>\n'},"itemStyle.decal(Object | 'none').symbolKeepAspect":{desc:"<p>是否保持图案的长宽比。</p>\n"},"itemStyle.decal(Object | 'none').color":{desc:"<p>贴花图案的颜色,建议使用半透明色,这样能叠加在系列本身的颜色上。</p>\n"},"itemStyle.decal(Object | 'none').backgroundColor":{desc:"<p>贴花的背景色,将会覆盖在系列本身颜色之上,贴花图案之下。</p>\n"},"itemStyle.decal(Object | 'none').dashArrayX(number | number[] | (number | number[])[]) = 5":{desc:'<p>贴花图案的基本模式是在横向和纵向上分别以<code class="codespan">图案 - 空白 - 图案 - 空白 - 图案 - 空白</code>的形式无限循环。通过设置每个图案和空白的长度,可以实现复杂的图案效果。</p>\n<p><code class="codespan">dashArrayX</code> 控制了横向的图案模式。当其值为 <code class="codespan">number</code> 或 <code class="codespan">number[]</code> 类型时,与 <a href="https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-dasharray" target="_blank">SVG stroke-dasharray</a> 类似。</p>\n<ul>\n<li><p>如果是 <code class="codespan">number</code> 类型,表示图案和空白分别是这个值。如 <code class="codespan">5</code> 表示先显示宽度为 5 的图案,然后空 5 像素,再然后显示宽度为 5 的图案……</p>\n</li>\n<li><p>如果是 <code class="codespan">number[]</code> 类型,则表示图案和空白依次为数组值的循环。如:<code class="codespan">[5, 10, 2, 6]</code> 表示图案宽 5 像素,然后空 10 像素,然后图案宽 2 像素,然后空 6 像素,然后图案宽 5 像素……</p>\n</li>\n<li><p>如果是 <code class="codespan">(number | number[])[]</code> 类型,表示每行的图案和空白依次为数组值的循环。如:<code class="codespan">[10, [2, 5]]</code> 表示第一行以图案 10 像素空 10 像素循环,第二行以图案 2 像素空 5 像素循环,第三行以图案 10 像素空 10 像素循环……</p>\n</li>\n</ul>\n<p>可以结合以下的例子理解本接口:</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/aria-decal&edit=1&reset=1" width="700" height="300"><iframe />\n\n'},"itemStyle.decal(Object | 'none').dashArrayY(number | number[]) = 5":{desc:'<p>贴花图案的基本模式是在横向和纵向上分别以<code class="codespan">图案 - 空白 - 图案 - 空白 - 图案 - 空白</code>的形式无限循环。通过设置每个图案和空白的长度,可以实现复杂的图案效果。</p>\n<p><code class="codespan">dashArrayY</code> 控制了横向的图案模式。与 <a href="https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-dasharray" target="_blank">SVG stroke-dasharray</a> 类似。</p>\n<ul>\n<li><p>如果是 <code class="codespan">number</code> 类型,表示图案和空白分别是这个值。如 <code class="codespan">5</code> 表示先显示高度为 5 的图案,然后空 5 像素,再然后显示高度为 5 的图案……</p>\n</li>\n<li><p>如果是 <code class="codespan">number[]</code> 类型,则表示图案和空白依次为数组值的循环。如:<code class="codespan">[5, 10, 2, 6]</code> 表示图案高 5 像素,然后空 10 像素,然后图案高 2 像素,然后空 6 像素,然后图案高 5 像素……</p>\n</li>\n</ul>\n<p>可以结合以下的例子理解本接口:</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/aria-decal&edit=1&reset=1" width="700" height="300"><iframe />\n\n'},"itemStyle.decal(Object | 'none').rotation":{desc:'<p>图案的整体旋转角度(弧度制),取值范围从 <code class="codespan">-Math.PI</code> 到 <code class="codespan">Math.PI</code>。</p>\n'},"itemStyle.decal(Object | 'none').maxTileWidth":{desc:"<p>生成的图案在未重复之前的宽度上限。通常不需要设置该值,当你发现图案在重复的时候出现不连续的接缝时,可以尝试提高该值。</p>\n"},"itemStyle.decal(Object | 'none').maxTileHeight":{desc:"<p>生成的图案在未重复之前的高度上限。通常不需要设置该值,当你发现图案在重复的时候出现不连续的接缝时,可以尝试提高该值。</p>\n"},labelLayout:{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>标签的统一布局配置。</p>\n<p>该配置项是在每个系列默认的标签布局基础上,统一调整标签的<code class="codespan">(x, y)</code>位置,标签对齐等属性以实现想要的标签布局效果。</p>\n<p>该配置项也可以是一个有如下参数的回调函数</p>\n<pre><code class="lang-js">// 标签对应数据的 dataIndex\ndataIndex: number\n// 标签对应的数据类型,只在关系图中会有 node 和 edge 数据类型的区分\ndataType?: string\n// 标签对应的系列的 index\nseriesIndex: number\n// 标签显示的文本\ntext: string\n// 默认的标签的包围盒,由系列默认的标签布局决定\nlabelRect: {x: number, y: number, width: number, height: number}\n// 默认的标签水平对齐\nalign: 'left' | 'center' | 'right'\n// 默认的标签垂直对齐\nverticalAlign: 'top' | 'middle' | 'bottom'\n// 标签所对应的数据图形的包围盒,可用于定位标签位置\nrect: {x: number, y: number, width: number, height: number}\n// 默认引导线的位置,目前只有饼图(pie)和漏斗图(funnel)有默认标签位置\n// 如果没有该值则为 null\nlabelLinePoints?: number[][]\n</code></pre>\n<p><strong>示例:</strong></p>\n<p>将标签显示在图形右侧 10px 的位置,并且垂直居中:</p>\n<pre><code class="lang-js">labelLayout(params) {\n return {\n x: params.rect.x + 10,\n y: params.rect.y + params.rect.height / 2,\n verticalAlign: 'middle',\n align: 'left'\n }\n}\n</code></pre>\n<p>根据图形的包围盒尺寸决定文本尺寸</p>\n<pre><code class="lang-js">\nlabelLayout(params) {\n return {\n fontSize: Math.max(params.rect.width / 10, 5)\n };\n}\n</code></pre>\n'},"labelLayout.hideOverlap":{desc:'<p>是否隐藏重叠的标签。</p>\n<p>下面示例演示了在关系图中开启该配置后,在缩放时可以实现自动的标签隐藏。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=graph-label-overlap&edit=1&reset=1" width="600" height="400"><iframe />\n\n'},"labelLayout.moveOverlap":{desc:'<p>在标签重叠的时候是否挪动标签位置以防止重叠。</p>\n<p>目前支持配置为:</p>\n<ul>\n<li><code class="codespan">'shiftX'</code> 水平方向依次位移,在水平方向对齐时使用</li>\n<li><code class="codespan">'shiftY'</code> 垂直方向依次位移,在垂直方向对齐时使用</li>\n</ul>\n<p>下面是标签右对齐并配置垂直方向依次位移以防止重叠的示例。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=scatter-label-align-right&edit=1&reset=1" width="600" height="400"><iframe />\n\n'},"labelLayout.x":{desc:'<p>标签的 x 位置。支持绝对的像素值或者<code class="codespan">'20%'</code>这样的相对值。</p>\n'},"labelLayout.y":{desc:'<p>标签的 y 位置。支持绝对的像素值或者<code class="codespan">'20%'</code>这样的相对值。</p>\n'},"labelLayout.dx":{desc:'<p>标签在 x 方向上的像素偏移。可以和<code class="codespan">x</code>一起使用。</p>\n'},"labelLayout.dy":{desc:'<p>标签在 y 方向上的像素偏移。可以和<code class="codespan">y</code>一起使用</p>\n'},"labelLayout.rotate":{desc:"<p>标签旋转角度。</p>\n"},"labelLayout.width":{desc:'<p>标签显示的宽度。可以配合<code class="codespan">overflow</code>使用控制标签显示在固定宽度内</p>\n'},"labelLayout.height":{desc:'<p>标签显示的高度。可以配合<code class="codespan">lineOverflow</code>使用控制标签显示在固定高度内</p>\n'},"labelLayout.align":{desc:'<p>标签水平对齐方式。可以设置<code class="codespan">'left'</code>, <code class="codespan">'center'</code>, <code class="codespan">'right'</code>。</p>\n'},"labelLayout.verticalAlign":{desc:'<p>标签垂直对齐方式。可以设置<code class="codespan">'top'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'bottom'</code>。</p>\n'},"labelLayout.fontSize":{desc:"<p>The text size of the label.</p>\n"},"labelLayout.draggable":{desc:"<p>标签是否可以允许用户通过拖拽二次调整位置。</p>\n"},"labelLayout.labelLinePoints":{desc:'<p>标签引导线三个点的位置。格式为:</p>\n<pre><code class="lang-js">[[x, y], [x, y], [x, y]]\n</code></pre>\n<p>在饼图中常用来微调已经计算好的引导线,其它情况一般不建议设置。</p>\n'},emphasis:{desc:"<p>高亮的图形样式和标签样式。</p>\n"},"emphasis.focus":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>在高亮图形时,是否淡出其它数据的图形已达到聚焦的效果。支持如下配置:</p>\n<ul>\n<li><code class="codespan">'none'</code> 不淡出其它图形,默认使用该配置。</li>\n<li><code class="codespan">'self'</code> 只聚焦(不淡出)当前高亮的数据的图形。</li>\n<li><code class="codespan">'series'</code> 聚焦当前高亮的数据所在的系列的所有图形。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<p>下面代码配置了柱状图在高亮一个图形的时候,淡出当前直角坐标系所有其它的系列。</p>\n<pre><code class="lang-js">emphasis: {\n focus: 'series',\n blurScope: 'coordinateSystem'\n}\n</code></pre>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-y-category-stack&reset=1&edit=1" width="600" height="400"><iframe />\n\n'},"emphasis.blurScope":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>在开启<code class="codespan">focus</code>的时候,可以通过<code class="codespan">blurScope</code>配置淡出的范围。支持如下配置</p>\n<ul>\n<li><code class="codespan">'coordinateSystem'</code> 淡出范围为坐标系,默认使用该配置。</li>\n<li><code class="codespan">'series'</code> 淡出范围为系列。</li>\n<li><code class="codespan">'global'</code> 淡出范围为全局。</li>\n</ul>\n'},"emphasis.label":{desc:"<p>图形上的文本标签,可用于说明图形的一些数据信息,比如值,名称等。</p>\n"},"emphasis.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"emphasis.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"emphasis.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"emphasis.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"emphasis.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"emphasis.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {@score}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"emphasis.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"emphasis.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"emphasis.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"emphasis.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"emphasis.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"emphasis.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"emphasis.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"emphasis.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"emphasis.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"emphasis.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"emphasis.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"emphasis.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"emphasis.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"emphasis.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"emphasis.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"emphasis.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"emphasis.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"emphasis.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"emphasis.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"emphasis.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"emphasis.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"emphasis.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"emphasis.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"emphasis.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"emphasis.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"emphasis.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"emphasis.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"emphasis.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"emphasis.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"emphasis.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"emphasis.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"emphasis.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"emphasis.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"emphasis.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"emphasis.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"emphasis.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"emphasis.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"emphasis.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"emphasis.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.labelLine":{desc:"<p>标签的视觉引导线配置。</p>\n"},"emphasis.labelLine.show":{desc:"\n\n<p>是否显示视觉引导线。</p>\n",uiControl:{type:"boolean"}},"emphasis.labelLine.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"emphasis.labelLine.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"emphasis.labelLine.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"emphasis.labelLine.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"emphasis.labelLine.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"emphasis.labelLine.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"emphasis.labelLine.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"emphasis.labelLine.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"emphasis.itemStyle":{desc:"<p> 图形样式。</p>\n"},"emphasis.itemStyle.color":{desc:"\n\n<p>柱条的颜色。</p>\n",uiControl:{type:"color"}},"emphasis.itemStyle.borderColor":{desc:"\n\n<p>柱条的描边颜色。</p>\n",uiControl:{type:"color",value:"#000"}},"emphasis.itemStyle.borderWidth":{desc:"\n\n<p>柱条的描边宽度,默认不描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"emphasis.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"emphasis.itemStyle.borderRadius":{desc:"\n\n<p>圆角半径,单位px,支持传入数组分别指定 4 个圆角半径。\n如:</p>\n<pre><code>borderRadius: 5, // 统一设置四个角的圆角大小\nborderRadius: [5, 5, 0, 0] //(顺时针左上,右上,右下,左下)\n</code></pre>",uiControl:{type:"vector",min:"0",dims:"LT,RT,RB,LB"}},"emphasis.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"emphasis.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"emphasis.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"emphasis.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"emphasis.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},blur:{desc:'<p>淡出时的图形样式和标签样式。开启 <a href="#series-bar.emphasis.focus">emphasis.focus</a> 后有效。</p>\n'},"blur.label":{desc:"<p>图形上的文本标签,可用于说明图形的一些数据信息,比如值,名称等。</p>\n"},"blur.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"blur.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"blur.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"blur.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"blur.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"blur.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {@score}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"blur.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"blur.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"blur.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"blur.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"blur.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"blur.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"blur.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"blur.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"blur.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"blur.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"blur.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"blur.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"blur.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"blur.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"blur.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"blur.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"blur.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"blur.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"blur.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"blur.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"blur.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"blur.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"blur.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"blur.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"blur.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"blur.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"blur.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"blur.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"blur.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"blur.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"blur.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"blur.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"blur.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"blur.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"blur.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"blur.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"blur.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"blur.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"blur.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.labelLine":{desc:"<p>标签的视觉引导线配置。</p>\n"},"blur.labelLine.show":{desc:"\n\n<p>是否显示视觉引导线。</p>\n",uiControl:{type:"boolean"}},"blur.labelLine.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"blur.labelLine.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"blur.labelLine.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"blur.labelLine.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"blur.labelLine.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"blur.labelLine.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"blur.labelLine.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"blur.labelLine.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"blur.itemStyle":{desc:"<p> 图形样式。</p>\n"},"blur.itemStyle.color":{desc:"\n\n<p>柱条的颜色。</p>\n",uiControl:{type:"color"}},"blur.itemStyle.borderColor":{desc:"\n\n<p>柱条的描边颜色。</p>\n",uiControl:{type:"color",value:"#000"}},"blur.itemStyle.borderWidth":{desc:"\n\n<p>柱条的描边宽度,默认不描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"blur.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"blur.itemStyle.borderRadius":{desc:"\n\n<p>圆角半径,单位px,支持传入数组分别指定 4 个圆角半径。\n如:</p>\n<pre><code>borderRadius: 5, // 统一设置四个角的圆角大小\nborderRadius: [5, 5, 0, 0] //(顺时针左上,右上,右下,左下)\n</code></pre>",uiControl:{type:"vector",min:"0",dims:"LT,RT,RB,LB"}},"blur.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"blur.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"blur.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"blur.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"blur.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},select:{desc:'<p>数据选中时的图形样式和标签样式。开启 <a href="#series-bar.selectedMode">selectedMode</a> 后有效。</p>\n'},"select.label":{desc:"<p>图形上的文本标签,可用于说明图形的一些数据信息,比如值,名称等。</p>\n"},"select.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"select.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"select.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"select.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"select.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"select.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {@score}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"select.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"select.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"select.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"select.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"select.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"select.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"select.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"select.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"select.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"select.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"select.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"select.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"select.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"select.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"select.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"select.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"select.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"select.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"select.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"select.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"select.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"select.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"select.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"select.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"select.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"select.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"select.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"select.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"select.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"select.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"select.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"select.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"select.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"select.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"select.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"select.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"select.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"select.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"select.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.labelLine":{desc:"<p>标签的视觉引导线配置。</p>\n"},"select.labelLine.show":{desc:"\n\n<p>是否显示视觉引导线。</p>\n",uiControl:{type:"boolean"}},"select.labelLine.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"select.labelLine.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"select.labelLine.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"select.labelLine.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"select.labelLine.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"select.labelLine.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"select.labelLine.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"select.labelLine.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"select.itemStyle":{desc:"<p> 图形样式。</p>\n"},"select.itemStyle.color":{desc:"\n\n<p>柱条的颜色。</p>\n",uiControl:{type:"color"}},"select.itemStyle.borderColor":{desc:"\n\n<p>柱条的描边颜色。</p>\n",uiControl:{type:"color",value:"#000"}},"select.itemStyle.borderWidth":{desc:"\n\n<p>柱条的描边宽度,默认不描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"select.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"select.itemStyle.borderRadius":{desc:"\n\n<p>圆角半径,单位px,支持传入数组分别指定 4 个圆角半径。\n如:</p>\n<pre><code>borderRadius: 5, // 统一设置四个角的圆角大小\nborderRadius: [5, 5, 0, 0] //(顺时针左上,右上,右下,左下)\n</code></pre>",uiControl:{type:"vector",min:"0",dims:"LT,RT,RB,LB"}},"select.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"select.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"select.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"select.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"select.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},selectedMode:{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n\n\n<p>选中模式的配置,表示是否支持多个选中,默认关闭,支持布尔值和字符串,字符串取值可选<code class="codespan">'single'</code>,<code class="codespan">'multiple'</code>,分别表示单选还是多选。</p>\n',uiControl:{type:"enum",options:"false,true,single,multiple"}},stack:{desc:'<p>数据堆叠,同个类目轴上系列配置相同的<code class="codespan">stack</code>值可以堆叠放置。</p>\n'},sampling:{desc:'<p>柱状图在数据量远大于像素点时候的降采样策略,开启后可以有效的优化图表的绘制效率,默认关闭,也就是全部绘制不过滤数据点。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'lttb'</code> 采用 Largest-Triangle-Three-Bucket 算法,可以最大程度保证采样后线条的趋势,形状和极值。</li>\n<li><code class="codespan">'average'</code> 取过滤点的平均值</li>\n<li><code class="codespan">'max'</code> 取过滤点的最大值</li>\n<li><code class="codespan">'min'</code> 取过滤点的最小值</li>\n<li><code class="codespan">'sum'</code> 取过滤点的和</li>\n</ul>\n'},cursor:{desc:'\n\n<p>鼠标悬浮时在图形元素上时鼠标的样式是什么。同 CSS 的 <code class="codespan">cursor</code>。</p>\n',uiControl:{type:"enum",options:"auto,pointer,move",default:"pointer"}},barWidth:{desc:'<p>柱条的宽度,不设时自适应。</p>\n\n\n\n\n<p>可以是绝对值例如 <code class="codespan">40</code> 或者百分数例如 <code class="codespan">'60%'</code>。百分数基于自动计算出的每一类目的宽度。</p>\n<p>在同一坐标系上,此属性会被多个 <code class="codespan">'bar'</code> 系列共享。此属性应设置于此坐标系中最后一个 <code class="codespan">'bar'</code> 系列上才会生效,并且是对此坐标系中所有 <code class="codespan">'bar'</code> 系列生效。</p>\n',uiControl:{type:"percent"}},barMaxWidth:{desc:'<p>柱条的最大宽度。</p>\n<p>比 <a href="#series-bar.barWidth">barWidth</a> 优先级高。</p>\n<p>可以是绝对值例如 <code class="codespan">40</code> 或者百分数例如 <code class="codespan">'60%'</code>。百分数基于自动计算出的每一类目的宽度。</p>\n<p>在同一坐标系上,此属性会被多个 <code class="codespan">'bar'</code> 系列共享。此属性应设置于此坐标系中最后一个 <code class="codespan">'bar'</code> 系列上才会生效,并且是对此坐标系中所有 <code class="codespan">'bar'</code> 系列生效。</p>\n'},barMinWidth:{desc:'<p>柱条的最小宽度。在直角坐标系中,默认值是 <code class="codespan">1</code>。否则默认值是 <code class="codespan">null</code>。</p>\n<p>比 <a href="#series-bar.barWidth">barWidth</a> 优先级高。</p>\n<p>可以是绝对值例如 <code class="codespan">40</code> 或者百分数例如 <code class="codespan">'60%'</code>。百分数基于自动计算出的每一类目的宽度。</p>\n<p>在同一坐标系上,此属性会被多个 <code class="codespan">'bar'</code> 系列共享。此属性应设置于此坐标系中最后一个 <code class="codespan">'bar'</code> 系列上才会生效,并且是对此坐标系中所有 <code class="codespan">'bar'</code> 系列生效。</p>\n'},barMinHeight:{desc:"<p>柱条最小高度,可用于防止某数据项的值过小而影响交互。</p>\n\n",uiControl:{type:"number",min:"0"}},barGap:{desc:'\n\n<p>不同系列的柱间距离,为百分比(如 <code class="codespan">'30%'</code>,表示柱子宽度的 <code class="codespan">30%</code>)。</p>\n<p>如果想要两个系列的柱子重叠,可以设置 barGap 为 <code class="codespan">'-100%'</code>。这在用柱子做背景的时候有用。</p>\n<p>在同一坐标系上,此属性会被多个 <code class="codespan">'bar'</code> 系列共享。此属性应设置于此坐标系中最后一个 <code class="codespan">'bar'</code> 系列上才会生效,并且是对此坐标系中所有 <code class="codespan">'bar'</code> 系列生效。</p>\n<p>例子:</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/barGrid-barGap&reset=1&edit=1" width="600" height="400"><iframe />\n\n',uiControl:{type:"percent",default:"30%"}},barCategoryGap:{desc:'\n\n<p>同一系列的柱间距离,默认为类目间距的20%,可设固定值</p>\n<p>在同一坐标系上,此属性会被多个 <code class="codespan">'bar'</code> 系列共享。此属性应设置于此坐标系中最后一个 <code class="codespan">'bar'</code> 系列上才会生效,并且是对此坐标系中所有 <code class="codespan">'bar'</code> 系列生效。</p>\n',uiControl:{type:"percent",default:"20%"}},large:{desc:'\n\n<p>是否开启大数据量优化,在数据图形特别多而出现卡顿时候可以开启。</p>\n<p>开启后配合 <code class="codespan">largeThreshold</code> 在数据量大于指定阈值的时候对绘制进行优化。</p>\n<p>缺点:优化后不能自定义设置单个数据项的样式。</p>\n',uiControl:{type:"boolean"}},largeThreshold:{desc:"\n\n<p>开启绘制优化的阈值。</p>\n",uiControl:{type:"number",min:"1",default:"400"}},progressive:{desc:"<p>渐进式渲染时每一帧绘制图形数量,设为 0 时不启用渐进式渲染,支持每个系列单独配置。</p>\n<p>在图中有数千到几千万图形元素的时候,一下子把图形绘制出来,或者交互重绘的时候可能会造成界面的卡顿甚至假死。ECharts 4 开始全流程支持渐进渲染(progressive rendering),渲染的时候会把创建好的图形分到数帧中渲染,每一帧渲染只渲染指定数量的图形。</p>\n<p>该配置项就是用于配置该系列每一帧渲染的图形数,可以根据图表图形复杂度的需要适当调整这个数字使得在不影响交互流畅性的前提下达到绘制速度的最大化。比如在 lines 图或者平行坐标中线宽大于 1 的 polyline 绘制会很慢,这个数字就可以设置小一点,而线宽小于等于 1 的 polyline 绘制非常快,该配置项就可以相对调得比较大。</p>\n"},progressiveThreshold:{desc:"<p>启用渐进式渲染的图形数量阈值,在单个系列的图形数量超过该阈值时启用渐进式渲染。</p>\n"},progressiveChunkMode:{desc:'<p>分片的方式。可选值:</p>\n<ul>\n<li><code class="codespan">'sequential'</code>: 按照数据的顺序分片。缺点是渲染过程不自然。</li>\n<li><code class="codespan">'mod'</code>: 取模分片,即每个片段中的点会遍布于整个数据,从而能够视觉上均匀得渲染。</li>\n</ul>\n'},dimensions:{desc:'<p>使用 dimensions 定义 <code class="codespan">series.data</code> 或者 <code class="codespan">dataset.source</code> 的每个维度的信息。</p>\n<p>注意:如果使用了 <a href="#dataset">dataset</a>,那么可以在 <a href="#dataset.dimensions">dataset.dimensions</a> 中定义 dimension ,或者在 <a href="#dataset.source">dataset.source</a> 的第一行/列中给出 dimension 名称。于是就不用在这里指定 dimension。但如果在这里指定了 <code class="codespan">dimensions</code>,那么优先使用这里的。</p>\n<p>例如:</p>\n<pre><code class="lang-js">option = {\n dataset: {\n source: [\n // 有了上面 dimensions 定义后,下面这五个维度的名称分别为:\n // 'date', 'open', 'close', 'highest', 'lowest'\n [12, 44, 55, 66, 2],\n [23, 6, 16, 23, 1],\n ...\n ]\n },\n series: {\n type: 'xxx',\n // 定义了每个维度的名称。这个名称会被显示到默认的 tooltip 中。\n dimensions: ['date', 'open', 'close', 'highest', 'lowest']\n }\n}\n</code></pre>\n<pre><code class="lang-js">series: {\n type: 'xxx',\n dimensions: [\n null, // 如果此维度不想给出定义,则使用 null 即可\n {type: 'ordinal'}, // 只定义此维度的类型。\n // 'ordinal' 表示离散型,一般文本使用这种类型。\n // 如果类型没有被定义,会自动猜测类型。\n {name: 'good', type: 'number'},\n 'bad' // 等同于 {name: 'bad'}\n ]\n}\n</code></pre>\n<p><code class="codespan">dimensions</code> 数组中的每一项可以是:</p>\n<ul>\n<li><code class="codespan">string</code>,如 <code class="codespan">'someName'</code>,等同于 <code class="codespan">{name: 'someName'}</code></li>\n<li><code class="codespan">Object</code>,属性可以有:<ul>\n<li>name: <code class="codespan">string</code>。</li>\n<li>type: <code class="codespan">string</code>,支持<ul>\n<li><code class="codespan">number</code>,默认,表示普通数据。</li>\n<li><code class="codespan">ordinal</code>,对于类目、文本这些 string 类型的数据,如果需要能在数轴上使用,须是 'ordinal' 类型。ECharts 默认会自动判断这个类型。但是自动判断也是不可能很完备的,所以使用者也可以手动强制指定。</li>\n<li><code class="codespan">float</code>,即 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Float64Array" target="_blank">Float64Array</a>。</li>\n<li><code class="codespan">int</code>,即 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Int32Array" target="_blank">Int32Array</a>。</li>\n<li><code class="codespan">time</code>,表示时间类型。设置成 'time' 则能支持自动解析数据成时间戳(timestamp),比如该维度的数据是 '2017-05-10',会自动被解析。时间类型的支持参见 <a href="#series.data">data</a>。</li>\n</ul>\n</li>\n<li>displayName: 一般用于 tooltip 中维度名的展示。<code class="codespan">string</code> 如果没有指定,默认使用 name 来展示。</li>\n</ul>\n</li>\n</ul>\n<p>值得一提的是,当定义了 <code class="codespan">dimensions</code> 后,默认 <code class="codespan">tooltip</code> 中对个维度的显示,会变为『竖排』,从而方便显示每个维度的名称。如果没有定义 <code class="codespan">dimensions</code>,则默认 <code class="codespan">tooltip</code> 会横排显示,且只显示数值没有维度名称可显示。</p>\n'},encode:{desc:'<p>可以定义 <code class="codespan">data</code> 的哪个维度被编码成什么。比如:</p>\n<pre><code class="lang-js">option = {\n dataset: {\n source: [\n // 每一列称为一个『维度』。\n // 这里分别是维度 0、1、2、3、4。\n [12, 44, 55, 66, 2],\n [23, 6, 16, 23, 1],\n ...\n ]\n },\n series: {\n type: 'xxx',\n encode: {\n x: [3, 1, 5], // 表示维度 3、1、5 映射到 x 轴。\n y: 2, // 表示维度 2 映射到 y 轴。\n tooltip: [3, 2, 4] // 表示维度 3、2、4 会在 tooltip 中显示。\n }\n }\n}\n</code></pre>\n<p>当使用 <a href="#series.dimensions">dimensions</a> 给维度定义名称后,<code class="codespan">encode</code> 中可直接引用名称,例如:</p>\n<pre><code class="lang-js">series: {\n type: 'xxx',\n dimensions: ['date', 'open', 'close', 'highest', 'lowest'],\n encode: {\n x: 'date',\n y: ['open', 'close', 'highest', 'lowest']\n }\n}\n</code></pre>\n<p><code class="codespan">encode</code> 声明的基本结构如下,其中冒号左边是坐标系、标签等特定名称,如 <code class="codespan">'x'</code>, <code class="codespan">'y'</code>, <code class="codespan">'tooltip'</code> 等,冒号右边是数据中的维度名(string 格式)或者维度的序号(number 格式,从 0 开始计数),可以指定一个或多个维度(使用数组)。通常情况下,下面各种信息不需要所有的都写,按需写即可。</p>\n<p>下面是 encode 支持的属性:</p>\n<pre><code class="lang-js">// 在任何坐标系和系列中,都支持:\nencode: {\n // 使用 “名为 product 的维度” 和 “名为 score 的维度” 的值在 tooltip 中显示\n tooltip: ['product', 'score']\n // 使用 “维度 1” 和 “维度 3” 的维度名连起来作为系列名。(有时候名字比较长,这可以避免在 series.name 重复输入这些名字)\n seriesName: [1, 3],\n // 表示使用 “维度2” 中的值作为 id。这在使用 setOption 动态更新数据时有用处,可以使新老数据用 id 对应起来,从而能够产生合适的数据更新动画。\n itemId: 2,\n // 指定数据项的名称使用 “维度3” 在饼图等图表中有用,可以使这个名字显示在图例(legend)中。\n itemName: 3\n}\n\n// 直角坐标系(grid/cartesian)特有的属性:\nencode: {\n // 把 “维度1”、“维度5”、“名为 score 的维度” 映射到 X 轴:\n x: [1, 5, 'score'],\n // 把“维度0”映射到 Y 轴。\n y: 0\n}\n\n// 单轴(singleAxis)特有的属性:\nencode: {\n single: 3\n}\n\n// 极坐标系(polar)特有的属性:\nencode: {\n radius: 3,\n angle: 2\n}\n\n// 地理坐标系(geo)特有的属性:\nencode: {\n lng: 3,\n lat: 2\n}\n\n// 对于一些没有坐标系的图表,例如饼图、漏斗图等,可以是:\nencode: {\n value: 3\n}\n</code></pre>\n<p>这是个更丰富的 <code class="codespan">encode</code> 的<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=dataset-encode1&edit=1&reset=1" target="_blank">示例</a>:</p>\n<p>特殊地,在 <a href="#series-custom">自定义系列(custom series)</a> 中,<code class="codespan">encode</code> 中轴可以不指定或设置为 <code class="codespan">null/undefined</code>,从而使系列免于受这个轴控制,也就是说,轴的范围(extent)不会受此系列数值的影响,轴被 <a href="#dataZoom">dataZoom</a> 控制时也不会过滤掉这个系列:</p>\n<pre><code class="lang-js">var option = {\n xAxis: {},\n yAxis: {},\n dataZoom: [{\n xAxisIndex: 0\n }, {\n yAxisIndex: 0\n }],\n series: {\n type: 'custom',\n renderItem: function (params, api) {\n return {\n type: 'circle',\n shape: {\n cx: 100, // x 位置永远为 100\n cy: api.coord([0, api.value(0)])[1],\n r: 30\n },\n style: {\n fill: 'blue'\n }\n };\n },\n encode: {\n // 这样这个系列就不会被 x 轴以及 x\n // 轴上的 dataZoom 控制了。\n x: -1,\n y: 1\n },\n data: [ ... ]\n }\n};\n</code></pre>\n'},seriesLayoutBy:{desc:'<p>当使用 <a href="#dataset">dataset</a> 时,<code class="codespan">seriesLayoutBy</code> 指定了 <code class="codespan">dataset</code> 中用行还是列对应到系列上,也就是说,系列“排布”到 <code class="codespan">dataset</code> 的行还是列上。可取值:</p>\n<ul>\n<li>'column':默认,<code class="codespan">dataset</code> 的列对应于系列,从而 <code class="codespan">dataset</code> 中每一列是一个维度(dimension)。</li>\n<li>'row':<code class="codespan">dataset</code> 的行对应于系列,从而 <code class="codespan">dataset</code> 中每一行是一个维度(dimension)。</li>\n</ul>\n<p>参见这个 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=dataset-series-layout-by&theme=lite" target="_blank">示例</a></p>\n'},datasetIndex:{desc:'<p>如果 <a href="#series.data">series.data</a> 没有指定,并且 <a href="#dataset">dataset</a> 存在,那么就会使用 <a href="#dataset">dataset</a>。<code class="codespan">datasetIndex</code> 指定本系列使用那个 <a href="#dataset">dataset</a>。</p>\n'},data:{desc:'<p>系列中的数据内容数组。数组项通常为具体的数据项。</p>\n<p>注意,如果系列没有指定 <code class="codespan">data</code>,并且 option 有 <a href="#dataset">dataset</a>,那么默认使用第一个 <a href="#dataset">dataset</a>。如果指定了 <code class="codespan">data</code>,则不会再使用 <a href="#dataset">dataset</a>。</p>\n<p>可以使用 <code class="codespan">series.datasetIndex</code> 指定其他的 <a href="#dataset">dataset</a>。</p>\n<p>通常来说,数据用一个二维数组表示。如下,每一列被称为一个『维度』。</p>\n<pre><code class="lang-js">series: [{\n data: [\n // 维度X 维度Y 其他维度 ...\n [ 3.4, 4.5, 15, 43],\n [ 4.2, 2.3, 20, 91],\n [ 10.8, 9.5, 30, 18],\n [ 7.2, 8.8, 18, 57]\n ]\n}]\n</code></pre>\n<ul>\n<li>在 <a href="#grid">直角坐标系 (grid)</a> 中『维度X』和『维度Y』会默认对应于 <a href="#xAxis">xAxis</a> 和 <a href="#yAxis">yAxis</a>。</li>\n<li>在 <a href="#polar">极坐标系 (polar)</a> 中『维度X』和『维度Y』会默认对应于 <a href="#radiusAxis">radiusAxis</a> 和 <a href="#anbleAxis">angleAxis</a>。</li>\n<li>后面的其他维度是可选的,可以在别处被使用,例如:<ul>\n<li>在 <a href="#visualMap">visualMap</a> 中可以将一个或多个维度映射到颜色,大小等多个图形属性上。</li>\n<li>在 <a href="#series.symbolSize">series.symbolSize</a> 中可以使用回调函数,基于某个维度得到 symbolSize 值。</li>\n<li>使用 <a href="#tooltip.formatter">tooltip.formatter</a> 或 <a href="#series.label.formatter">series.label.formatter</a> 可以把其他维度的值展示出来。</li>\n</ul>\n</li>\n</ul>\n<p>特别地,当只有一个轴为类目轴(axis.type 为 <code class="codespan">'category'</code>)的时候,数据可以简化用一个一维数组表示。例如:</p>\n<pre><code class="lang-js">xAxis: {\n data: ['a', 'b', 'm', 'n']\n},\nseries: [{\n // 与 xAxis.data 一一对应。\n data: [23, 44, 55, 19]\n // 它其实是下面这种形式的简化:\n // data: [[0, 23], [1, 44], [2, 55], [3, 19]]\n}]\n</code></pre>\n<p><strong>『值』与 <a href="#xAxis.type">轴类型</a> 的关系:</strong></p>\n<ul>\n<li><p>当某维度对应于数值轴(axis.type 为 <code class="codespan">'value'</code> 或者 <code class="codespan">'log'</code>)的时候:</p>\n<p> 其值可以为 <code class="codespan">number</code>(例如 <code class="codespan">12</code>)。(也可以兼容 <code class="codespan">string</code> 形式的 number,例如 <code class="codespan">'12'</code>)</p>\n</li>\n<li><p>当某维度对应于类目轴(axis.type 为 <code class="codespan">'category'</code>)的时候:</p>\n<p> 其值须为类目的『序数』(从 <code class="codespan">0</code> 开始)或者类目的『字符串值』。例如:</p>\n<pre><code class="lang-js"> xAxis: {\n type: 'category',\n data: ['星期一', '星期二', '星期三', '星期四']\n },\n yAxis: {\n type: 'category',\n data: ['a', 'b', 'm', 'n', 'p', 'q']\n },\n series: [{\n data: [\n // xAxis yAxis\n [ 0, 0, 2 ], // 意思是此点位于 xAxis: '星期一', yAxis: 'a'。\n [ '星期四', 2, 1 ], // 意思是此点位于 xAxis: '星期四', yAxis: 'm'。\n [ 2, 'p', 2 ], // 意思是此点位于 xAxis: '星期三', yAxis: 'p'。\n [ 3, 3, 5 ]\n ]\n }]\n</code></pre>\n<p> 双类目轴的示例可以参考 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=scatter-punchCard" target="_blank">Github Punchcard</a> 示例。</p>\n</li>\n<li><p>当某维度对应于时间轴(type 为 <code class="codespan">'time'</code>)的时候,值可以为:</p>\n<ul>\n<li>一个时间戳,如 <code class="codespan">1484141700832</code>,表示 UTC 时间。</li>\n<li>或者字符串形式的时间描述:<ul>\n<li><a href="http://www.ecma-international.org/ecma-262/5.1/#sec-15.9.1.15" target="_blank">ISO 8601</a> 的子集,只包含这些形式(这几种格式,除非指明时区,否则均表示本地时间,与 <a href="https://momentjs.com/" target="_blank">moment</a> 一致):<ul>\n<li>部分年月日时间: <code class="codespan">'2012-03'</code>, <code class="codespan">'2012-03-01'</code>, <code class="codespan">'2012-03-01 05'</code>, <code class="codespan">'2012-03-01 05:06'</code>.</li>\n<li>使用 <code class="codespan">'T'</code> 或空格分割: <code class="codespan">'2012-03-01T12:22:33.123'</code>, <code class="codespan">'2012-03-01 12:22:33.123'</code>.</li>\n<li>时区设定: <code class="codespan">'2012-03-01T12:22:33Z'</code>, <code class="codespan">'2012-03-01T12:22:33+8000'</code>, <code class="codespan">'2012-03-01T12:22:33-05:00'</code>.</li>\n</ul>\n</li>\n<li>其他的时间字符串,包括(均表示本地时间):\n<code class="codespan">'2012'</code>, <code class="codespan">'2012-3-1'</code>, <code class="codespan">'2012/3/1'</code>, <code class="codespan">'2012/03/01'</code>,\n<code class="codespan">'2009/6/12 2:00'</code>, <code class="codespan">'2009/6/12 2:05:08'</code>, <code class="codespan">'2009/6/12 2:05:08.123'</code></li>\n</ul>\n</li>\n<li>或者用户自行初始化的 Date 实例:<ul>\n<li>注意,用户自行初始化 Date 实例的时候,<a href="http://dygraphs.com/date-formats.html" target="_blank">浏览器的行为有差异,不同字符串的表示也不同</a>。</li>\n<li>例如:在 chrome 中,<code class="codespan">new Date('2012-01-01')</code> 表示 UTC 时间的 2012 年 1 月 1 日,而 <code class="codespan">new Date('2012-1-1')</code> 和 <code class="codespan">new Date('2012/01/01')</code> 表示本地时间的 2012 年 1 月 1 日。在 safari 中,不支持 <code class="codespan">new Date('2012-1-1')</code> 这种表示方法。</li>\n<li>所以,使用 <code class="codespan">new Date(dataString)</code> 时,可使用第三方库解析(如 <a href="https://momentjs.com/" target="_blank">moment</a>),或者使用 <code class="codespan">echarts.number.parseDate</code>,或者参见 <a href="http://dygraphs.com/date-formats.html" target="_blank">这里</a>。</li>\n</ul>\n</li>\n</ul>\n</li>\n</ul>\n<p><strong>当需要对个别数据进行个性化定义时:</strong></p>\n<p>数组项可用对象,其中的 <code class="codespan">value</code> 像表示具体的数值,如:</p>\n<pre><code class="lang-js">[\n 12,\n 34,\n {\n value : 56,\n //自定义标签样式,仅对该数据项有效\n label: {},\n //自定义特殊 itemStyle,仅对该数据项有效\n itemStyle:{}\n },\n 10\n]\n// 或\n[\n [12, 33],\n [34, 313],\n {\n value: [56, 44],\n label: {},\n itemStyle:{}\n },\n [10, 33]\n]\n</code></pre>\n<p><strong>空值:</strong></p>\n<p>当某数据不存在时(ps:<em>不存在</em>不代表值为 0),可以用 <code class="codespan">'-'</code> 或者 <code class="codespan">null</code> 或者 <code class="codespan">undefined</code> 或者 <code class="codespan">NaN</code> 表示。</p>\n<p>例如,无数据在折线图中可表现为该点是断开的,在其它图中可表示为图形不存在。</p>\n'},"data.name":{desc:"<p>数据项名称。</p>\n"},"data.value":{desc:"<p>单个数据项的数值。</p>\n"},"data.label":{desc:"<p>单个数据的文本配置。</p>\n"},"data.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"data.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"data.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"data.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"data.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"data.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"data.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"data.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"data.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"data.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"data.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"data.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"data.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"data.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"data.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"data.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.labelLine":{desc:"<p>标签的视觉引导线配置。</p>\n"},"data.labelLine.show":{desc:"\n\n<p>是否显示视觉引导线。</p>\n",uiControl:{type:"boolean"}},"data.labelLine.showAbove":{desc:"<p>是否显示在图形上方。</p>\n"},"data.labelLine.length2":{desc:"\n\n<p>视觉引导项第二段的长度。</p>\n",uiControl:{type:"number",default:"15",min:"0",step:"1"}},"data.labelLine.smooth":{desc:'\n\n<p>是否平滑视觉引导线,默认不平滑,可以设置成 <code class="codespan">true</code> 平滑显示,也可以设置为 0 到 1 的值,表示平滑程度。</p>\n',uiControl:{type:"boolean"}},"data.labelLine.minTurnAngle":{desc:"<p>通过调整第二段线的长度,限制引导线两端之间最小的夹角,以防止过小的夹角导致显示不美观。</p>\n<p>可以设置为 0 - 180 度。</p>\n"},"data.labelLine.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"data.labelLine.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"data.labelLine.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"data.labelLine.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"data.labelLine.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"data.labelLine.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.labelLine.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.labelLine.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"data.itemStyle":{desc:"<p>单个数据的图形样式设置。</p>\n"},"data.itemStyle.color":{desc:"\n\n<p>柱条的颜色。</p>\n",uiControl:{type:"color"}},"data.itemStyle.borderColor":{desc:"\n\n<p>柱条的描边颜色。</p>\n",uiControl:{type:"color",value:"#000"}},"data.itemStyle.borderWidth":{desc:"\n\n<p>柱条的描边宽度,默认不描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"data.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"data.itemStyle.borderRadius":{desc:"\n\n<p>圆角半径,单位px,支持传入数组分别指定 4 个圆角半径。\n如:</p>\n<pre><code>borderRadius: 5, // 统一设置四个角的圆角大小\nborderRadius: [5, 5, 0, 0] //(顺时针左上,右上,右下,左下)\n</code></pre>",uiControl:{type:"vector",min:"0",dims:"LT,RT,RB,LB"}},"data.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"data.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"data.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"data.itemStyle.decal(Object | 'none')":{desc:'<p>图形的贴花图案,在 <a href="#aria.enabled">aria.enabled</a> 与 <a href="#aria.decal.show">aria.decal.show</a> 都是 <code class="codespan">true</code> 的情况下才生效。</p>\n<p>如果为 <code class="codespan">'none'</code> 表示不使用贴花图案。</p>\n'},"data.itemStyle.decal(Object | 'none').symbol(string|string[]) = 'rect'":{desc:'<p>贴花的图案,如果是 <code class="codespan">string[]</code> 表示循环使用数组中的图案。</p>\n<p>ECharts 提供的标记类型包括</p>\n<p><code class="codespan">'circle'</code>, <code class="codespan">'rect'</code>, <code class="codespan">'roundRect'</code>, <code class="codespan">'triangle'</code>, <code class="codespan">'diamond'</code>, <code class="codespan">'pin'</code>, <code class="codespan">'arrow'</code>, <code class="codespan">'none'</code></p>\n<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>'},"data.itemStyle.decal(Object | 'none').symbolSize":{desc:'<p>取值范围:<code class="codespan">0</code> 到 <code class="codespan">1</code>,表示占图案区域的百分比。</p>\n'},"data.itemStyle.decal(Object | 'none').symbolKeepAspect":{desc:"<p>是否保持图案的长宽比。</p>\n"},"data.itemStyle.decal(Object | 'none').color":{desc:"<p>贴花图案的颜色,建议使用半透明色,这样能叠加在系列本身的颜色上。</p>\n"},"data.itemStyle.decal(Object | 'none').backgroundColor":{desc:"<p>贴花的背景色,将会覆盖在系列本身颜色之上,贴花图案之下。</p>\n"},"data.itemStyle.decal(Object | 'none').dashArrayX(number | number[] | (number | number[])[]) = 5":{desc:'<p>贴花图案的基本模式是在横向和纵向上分别以<code class="codespan">图案 - 空白 - 图案 - 空白 - 图案 - 空白</code>的形式无限循环。通过设置每个图案和空白的长度,可以实现复杂的图案效果。</p>\n<p><code class="codespan">dashArrayX</code> 控制了横向的图案模式。当其值为 <code class="codespan">number</code> 或 <code class="codespan">number[]</code> 类型时,与 <a href="https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-dasharray" target="_blank">SVG stroke-dasharray</a> 类似。</p>\n<ul>\n<li><p>如果是 <code class="codespan">number</code> 类型,表示图案和空白分别是这个值。如 <code class="codespan">5</code> 表示先显示宽度为 5 的图案,然后空 5 像素,再然后显示宽度为 5 的图案……</p>\n</li>\n<li><p>如果是 <code class="codespan">number[]</code> 类型,则表示图案和空白依次为数组值的循环。如:<code class="codespan">[5, 10, 2, 6]</code> 表示图案宽 5 像素,然后空 10 像素,然后图案宽 2 像素,然后空 6 像素,然后图案宽 5 像素……</p>\n</li>\n<li><p>如果是 <code class="codespan">(number | number[])[]</code> 类型,表示每行的图案和空白依次为数组值的循环。如:<code class="codespan">[10, [2, 5]]</code> 表示第一行以图案 10 像素空 10 像素循环,第二行以图案 2 像素空 5 像素循环,第三行以图案 10 像素空 10 像素循环……</p>\n</li>\n</ul>\n<p>可以结合以下的例子理解本接口:</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/aria-decal&edit=1&reset=1" width="700" height="300"><iframe />\n\n'},"data.itemStyle.decal(Object | 'none').dashArrayY(number | number[]) = 5":{desc:'<p>贴花图案的基本模式是在横向和纵向上分别以<code class="codespan">图案 - 空白 - 图案 - 空白 - 图案 - 空白</code>的形式无限循环。通过设置每个图案和空白的长度,可以实现复杂的图案效果。</p>\n<p><code class="codespan">dashArrayY</code> 控制了横向的图案模式。与 <a href="https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-dasharray" target="_blank">SVG stroke-dasharray</a> 类似。</p>\n<ul>\n<li><p>如果是 <code class="codespan">number</code> 类型,表示图案和空白分别是这个值。如 <code class="codespan">5</code> 表示先显示高度为 5 的图案,然后空 5 像素,再然后显示高度为 5 的图案……</p>\n</li>\n<li><p>如果是 <code class="codespan">number[]</code> 类型,则表示图案和空白依次为数组值的循环。如:<code class="codespan">[5, 10, 2, 6]</code> 表示图案高 5 像素,然后空 10 像素,然后图案高 2 像素,然后空 6 像素,然后图案高 5 像素……</p>\n</li>\n</ul>\n<p>可以结合以下的例子理解本接口:</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/aria-decal&edit=1&reset=1" width="700" height="300"><iframe />\n\n'},"data.itemStyle.decal(Object | 'none').rotation":{desc:'<p>图案的整体旋转角度(弧度制),取值范围从 <code class="codespan">-Math.PI</code> 到 <code class="codespan">Math.PI</code>。</p>\n'},"data.itemStyle.decal(Object | 'none').maxTileWidth":{desc:"<p>生成的图案在未重复之前的宽度上限。通常不需要设置该值,当你发现图案在重复的时候出现不连续的接缝时,可以尝试提高该值。</p>\n"},"data.itemStyle.decal(Object | 'none').maxTileHeight":{desc:"<p>生成的图案在未重复之前的高度上限。通常不需要设置该值,当你发现图案在重复的时候出现不连续的接缝时,可以尝试提高该值。</p>\n"},"data.emphasis":{desc:"<p>单个数据的高亮状态配置。</p>\n"},"data.emphasis.label":{desc:"<p>单个数据的文本配置。</p>\n"},"data.emphasis.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"data.emphasis.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"data.emphasis.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"data.emphasis.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"data.emphasis.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"data.emphasis.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"data.emphasis.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.emphasis.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.emphasis.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.emphasis.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.emphasis.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.emphasis.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.emphasis.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.emphasis.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.emphasis.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.emphasis.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.emphasis.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.emphasis.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.emphasis.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.emphasis.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.emphasis.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.emphasis.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.emphasis.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"data.emphasis.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"data.emphasis.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"data.emphasis.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.emphasis.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.emphasis.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.emphasis.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.emphasis.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.emphasis.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"data.emphasis.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"data.emphasis.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"data.emphasis.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"data.emphasis.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"data.emphasis.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.emphasis.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.emphasis.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.emphasis.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.emphasis.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.emphasis.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.emphasis.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.emphasis.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.emphasis.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.emphasis.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.emphasis.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.emphasis.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.emphasis.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.emphasis.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.emphasis.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.emphasis.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.emphasis.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.emphasis.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.emphasis.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"data.emphasis.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.emphasis.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.emphasis.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.emphasis.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.emphasis.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.emphasis.labelLine":{desc:"<p>标签的视觉引导线配置。</p>\n"},"data.emphasis.labelLine.show":{desc:"\n\n<p>是否显示视觉引导线。</p>\n",uiControl:{type:"boolean"}},"data.emphasis.labelLine.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"data.emphasis.labelLine.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"data.emphasis.labelLine.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"data.emphasis.labelLine.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"data.emphasis.labelLine.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"data.emphasis.labelLine.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.emphasis.labelLine.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.emphasis.labelLine.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"data.emphasis.itemStyle":{desc:"<p>单个数据的图形样式设置。</p>\n"},"data.emphasis.itemStyle.color":{desc:"\n\n<p>柱条的颜色。</p>\n",uiControl:{type:"color"}},"data.emphasis.itemStyle.borderColor":{desc:"\n\n<p>柱条的描边颜色。</p>\n",uiControl:{type:"color",value:"#000"}},"data.emphasis.itemStyle.borderWidth":{desc:"\n\n<p>柱条的描边宽度,默认不描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"data.emphasis.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"data.emphasis.itemStyle.borderRadius":{desc:"\n\n<p>圆角半径,单位px,支持传入数组分别指定 4 个圆角半径。\n如:</p>\n<pre><code>borderRadius: 5, // 统一设置四个角的圆角大小\nborderRadius: [5, 5, 0, 0] //(顺时针左上,右上,右下,左下)\n</code></pre>",uiControl:{type:"vector",min:"0",dims:"LT,RT,RB,LB"}},"data.emphasis.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"data.emphasis.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"data.emphasis.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.emphasis.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.emphasis.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"data.blur":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>单个数据的淡出状态配置。</p>\n'},"data.blur.label":{desc:"<p>单个数据的文本配置。</p>\n"},"data.blur.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"data.blur.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"data.blur.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"data.blur.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"data.blur.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"data.blur.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"data.blur.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.blur.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.blur.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.blur.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.blur.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.blur.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.blur.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.blur.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.blur.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.blur.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.blur.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.blur.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.blur.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.blur.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.blur.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.blur.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.blur.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"data.blur.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"data.blur.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"data.blur.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.blur.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.blur.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.blur.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.blur.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.blur.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"data.blur.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"data.blur.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"data.blur.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"data.blur.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"data.blur.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.blur.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.blur.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.blur.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.blur.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.blur.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.blur.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.blur.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.blur.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.blur.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.blur.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.blur.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.blur.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.blur.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.blur.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.blur.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.blur.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.blur.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.blur.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"data.blur.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.blur.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.blur.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.blur.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.blur.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.blur.labelLine":{desc:"<p>标签的视觉引导线配置。</p>\n"},"data.blur.labelLine.show":{desc:"\n\n<p>是否显示视觉引导线。</p>\n",uiControl:{type:"boolean"}},"data.blur.labelLine.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"data.blur.labelLine.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"data.blur.labelLine.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"data.blur.labelLine.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"data.blur.labelLine.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"data.blur.labelLine.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.blur.labelLine.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.blur.labelLine.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"data.blur.itemStyle":{desc:"<p>单个数据的图形样式设置。</p>\n"},"data.blur.itemStyle.color":{desc:"\n\n<p>柱条的颜色。</p>\n",uiControl:{type:"color"}},"data.blur.itemStyle.borderColor":{desc:"\n\n<p>柱条的描边颜色。</p>\n",uiControl:{type:"color",value:"#000"}},"data.blur.itemStyle.borderWidth":{desc:"\n\n<p>柱条的描边宽度,默认不描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"data.blur.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"data.blur.itemStyle.borderRadius":{desc:"\n\n<p>圆角半径,单位px,支持传入数组分别指定 4 个圆角半径。\n如:</p>\n<pre><code>borderRadius: 5, // 统一设置四个角的圆角大小\nborderRadius: [5, 5, 0, 0] //(顺时针左上,右上,右下,左下)\n</code></pre>",uiControl:{type:"vector",min:"0",dims:"LT,RT,RB,LB"}},"data.blur.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"data.blur.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"data.blur.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.blur.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.blur.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"data.select":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>单个数据的选中状态配置。</p>\n'},"data.select.label":{desc:"<p>单个数据的文本配置。</p>\n"},"data.select.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"data.select.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"data.select.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"data.select.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"data.select.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"data.select.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"data.select.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.select.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.select.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.select.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.select.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.select.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.select.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.select.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.select.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.select.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.select.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.select.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.select.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.select.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.select.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.select.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.select.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"data.select.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"data.select.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"data.select.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.select.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.select.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.select.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.select.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.select.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"data.select.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"data.select.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"data.select.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"data.select.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"data.select.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.select.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.select.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.select.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.select.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.select.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.select.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.select.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.select.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.select.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.select.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.select.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.select.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.select.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.select.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.select.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.select.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.select.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.select.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"data.select.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.select.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.select.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.select.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.select.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.select.labelLine":{desc:"<p>标签的视觉引导线配置。</p>\n"},"data.select.labelLine.show":{desc:"\n\n<p>是否显示视觉引导线。</p>\n",uiControl:{type:"boolean"}},"data.select.labelLine.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"data.select.labelLine.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"data.select.labelLine.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"data.select.labelLine.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"data.select.labelLine.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"data.select.labelLine.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.select.labelLine.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.select.labelLine.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"data.select.itemStyle":{desc:"<p>单个数据的图形样式设置。</p>\n"},"data.select.itemStyle.color":{desc:"\n\n<p>柱条的颜色。</p>\n",uiControl:{type:"color"}},"data.select.itemStyle.borderColor":{desc:"\n\n<p>柱条的描边颜色。</p>\n",uiControl:{type:"color",value:"#000"}},"data.select.itemStyle.borderWidth":{desc:"\n\n<p>柱条的描边宽度,默认不描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"data.select.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"data.select.itemStyle.borderRadius":{desc:"\n\n<p>圆角半径,单位px,支持传入数组分别指定 4 个圆角半径。\n如:</p>\n<pre><code>borderRadius: 5, // 统一设置四个角的圆角大小\nborderRadius: [5, 5, 0, 0] //(顺时针左上,右上,右下,左下)\n</code></pre>",uiControl:{type:"vector",min:"0",dims:"LT,RT,RB,LB"}},"data.select.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"data.select.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"data.select.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.select.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.select.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},clip:{desc:'\n\n\n\n<blockquote>\n<p>从 <code class="codespan">v4.4.0</code> 开始支持</p>\n</blockquote>\n<p>是否裁剪超出坐标系部分的图形,具体裁剪效果根据系列决定:</p>\n<ul>\n<li>散点图:忽略中心点超出坐标系的图形,但是不裁剪单个图形</li>\n<li>柱状图:裁掉完全超出的柱子,但是不会裁剪只超出部分的柱子</li>\n<li>折线图:裁掉所有超出坐标系的折线部分,拐点图形的逻辑按照散点图处理</li>\n<li>路径图:裁掉所有超出坐标系的部分</li>\n<li>K 线图:忽略整体都超出坐标系的图形,但是不裁剪单个图形</li>\n<li>自定义系列:裁掉所有超出坐标系的部分</li>\n</ul>\n<p>除了自定义系列,其它系列的默认值都为 true,及开启裁剪,如果你觉得不想要裁剪的话,可以设置成 false 关闭。</p>\n',uiControl:{type:"boolean",default:"true"}},zlevel:{desc:'<p>柱状图所有图形的 zlevel 值。</p>\n<p><code class="codespan">zlevel</code>用于 Canvas 分层,不同<code class="codespan">zlevel</code>值的图形会放置在不同的 Canvas 中,Canvas 分层是一种常见的优化手段。我们可以把一些图形变化频繁(例如有动画)的组件设置成一个单独的<code class="codespan">zlevel</code>。需要注意的是过多的 Canvas 会引起内存开销的增大,在手机端上需要谨慎使用以防崩溃。</p>\n<p><code class="codespan">zlevel</code> 大的 Canvas 会放在 <code class="codespan">zlevel</code> 小的 Canvas 的上面。</p>\n'},z:{desc:'<p>柱状图组件的所有图形的<code class="codespan">z</code>值。控制图形的前后顺序。<code class="codespan">z</code>值小的图形会被<code class="codespan">z</code>值大的图形覆盖。</p>\n<p><code class="codespan">z</code>相比<code class="codespan">zlevel</code>优先级更低,而且不会创建新的 Canvas。</p>\n'},silent:{desc:"\n\n<p>图形是否不响应和触发鼠标事件,默认为 false,即响应和触发鼠标事件。</p>\n",uiControl:{type:"boolean"}},animation:{desc:"\n\n<p>是否开启动画。</p>\n",uiControl:{type:"boolean",default:"true",clean:"true"}},animationThreshold:{desc:"<p>是否开启动画的阈值,当单个系列显示的图形数量大于这个阈值时会关闭动画。</p>\n"},animationDuration:{desc:'\n\n<p>初始动画的时长,支持回调函数,可以通过每个数据返回不同的时长实现更戏剧的初始动画效果:</p>\n<pre><code class="lang-js">animationDuration: function (idx) {\n // 越往后的数据时长越大\n return idx * 100;\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",default:"1000",step:"20",clean:"true"}},animationEasing:{desc:'\n\n<p>初始动画的缓动效果。不同的缓动效果可以参考 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=line-easing" target="_blank">缓动示例</a>。</p>\n',uiControl:{type:"enum",options:"linear,quadraticIn,quadraticOut,quadraticInOut,cubicIn,cubicOut,cubicInOut,quarticIn,quarticOut,quarticInOut,quinticIn,quinticOut,quinticInOut,sinusoidalIn,sinusoidalOut,sinusoidalInOut,exponentialIn,exponentialOut,exponentialInOut,circularIn,circularOut,circularInOut,elasticIn,elasticOut,elasticInOut,backIn,backOut,backInOut,bounceIn,bounceOut,bounceInOut",clean:"true"}},animationDelay:{desc:'<p>初始动画的延迟,支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的初始动画效果。</p>\n<p>如下示例:</p>\n<pre><code class="lang-js">animationDelay: function (idx) {\n // 越往后的数据延迟越大\n return idx * 100;\n}\n</code></pre>\n<p>也可以看<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-animation-delay" target="_blank">该示例</a></p>\n'},animationDurationUpdate:{desc:'\n\n<p>数据更新动画的时长。</p>\n<p>支持回调函数,可以通过每个数据返回不同的时长实现更戏剧的更新动画效果:</p>\n<pre><code class="lang-js">animationDurationUpdate: function (idx) {\n // 越往后的数据时长越大\n return idx * 100;\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",default:"1000",step:"20"}},animationEasingUpdate:{desc:"\n\n<p>数据更新动画的缓动效果。</p>\n",uiControl:{type:"enum",options:"linear,quadraticIn,quadraticOut,quadraticInOut,cubicIn,cubicOut,cubicInOut,quarticIn,quarticOut,quarticInOut,quinticIn,quinticOut,quinticInOut,sinusoidalIn,sinusoidalOut,sinusoidalInOut,exponentialIn,exponentialOut,exponentialInOut,circularIn,circularOut,circularInOut,elasticIn,elasticOut,elasticInOut,backIn,backOut,backInOut,bounceIn,bounceOut,bounceInOut"}},animationDelayUpdate:{desc:'<p>数据更新动画的延迟,支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的更新动画效果。</p>\n<p>如下示例:</p>\n<pre><code class="lang-js">animationDelayUpdate: function (idx) {\n // 越往后的数据延迟越大\n return idx * 100;\n}\n</code></pre>\n<p>也可以看<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-animation-delay" target="_blank">该示例</a></p>\n'},tooltip:{desc:"<p>本系列特定的 tooltip 设定。</p>\n"},"tooltip.position":{desc:'<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的位置,默认不设置时位置会跟随鼠标的位置。</p>\n<p>可选:</p>\n<ul>\n<li><p><code class="codespan">Array</code></p>\n<p> 通过数组表示提示框浮层的位置,支持数字设置绝对位置,百分比设置相对位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对位置,相对于容器左侧 10px, 上侧 10 px\n position: [10, 10]\n // 相对位置,放置在容器正中间\n position: ['50%', '50%']\n</code></pre>\n</li>\n<li><p><code class="codespan">Function</code></p>\n<p> 回调函数,格式如下:</p>\n<pre><code class="lang-js"> (point: Array, params: Object|Array.<Object>, dom: HTMLDomElement, rect: Object, size: Object) => Array\n</code></pre>\n<p> <strong>参数:</strong><br>\n point: 鼠标位置,如 [20, 40]。<br>\n params: 同 formatter 的参数相同。<br>\n dom: tooltip 的 dom 对象。<br>\n rect: 只有鼠标在图形上时有效,是一个用<code class="codespan">x</code>, <code class="codespan">y</code>, <code class="codespan">width</code>, <code class="codespan">height</code>四个属性表达的图形包围盒。<br>\n size: 包括 dom 的尺寸和 echarts 容器的当前尺寸,例如:<code class="codespan">{contentSize: [width, height], viewSize: [width, height]}</code>。<br></p>\n<p> <strong>返回值:</strong><br>\n 可以是一个表示 tooltip 位置的数组,数组值可以是绝对的像素值,也可以是相 百分比。<br>\n 也可以是一个对象,如:<code class="codespan">{left: 10, top: 30}</code>,或者 <code class="codespan">{right: '20%', bottom: 40}</code>。<br></p>\n<p> 如下示例:</p>\n<pre><code class="lang-js"> position: function (point, params, dom, rect, size) {\n // 固定在顶部\n return [point[0], '10%'];\n }\n</code></pre>\n<p> 或者:</p>\n<pre><code class="lang-js"> position: function (pos, params, dom, rect, size) {\n // 鼠标在左侧时 tooltip 显示到右侧,鼠标在右侧时 tooltip 显示到左侧。\n var obj = {top: 60};\n obj[['left', 'right'][+(pos[0] < size.viewSize[0] / 2)]] = 5;\n return obj;\n }\n</code></pre>\n</li>\n</ul>\n<ul>\n<li><p><code class="codespan">'inside'</code></p>\n<p> 鼠标所在图形的内部中心位置,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'top'</code></p>\n<p> 鼠标所在图形上侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'left'</code></p>\n<p> 鼠标所在图形左侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'right'</code></p>\n<p> 鼠标所在图形右侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'bottom'</code></p>\n<p> 鼠标所在图形底侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n</ul>\n'},"tooltip.formatter":{desc:'<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层内容格式器,支持字符串模板和回调函数两种形式。</p>\n<p><strong>1, 字符串模板</strong></p>\n<p>模板变量有 <code class="codespan">{a}</code>, <code class="codespan">{b}</code>,<code class="codespan">{c}</code>,<code class="codespan">{d}</code>,<code class="codespan">{e}</code>,分别表示系列名,数据名,数据值等。\n在 <a href="#tooltip.trigger">trigger</a> 为 <code class="codespan">'axis'</code> 的时候,会有多个系列的数据,此时可以通过 <code class="codespan">{a0}</code>, <code class="codespan">{a1}</code>, <code class="codespan">{a2}</code> 这种后面加索引的方式表示系列的索引。\n不同图表类型下的 <code class="codespan">{a}</code>,<code class="codespan">{b}</code>,<code class="codespan">{c}</code>,<code class="codespan">{d}</code> 含义不一样。\n其中变量<code class="codespan">{a}</code>, <code class="codespan">{b}</code>, <code class="codespan">{c}</code>, <code class="codespan">{d}</code>在不同图表类型下代表数据含义为:</p>\n<ul>\n<li><p>折线(区域)图、柱状(条形)图、K线图 : <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(类目值),<code class="codespan">{c}</code>(数值), <code class="codespan">{d}</code>(无)</p>\n</li>\n<li><p>散点图(气泡)图 : <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(数据名称),<code class="codespan">{c}</code>(数值数组), <code class="codespan">{d}</code>(无)</p>\n</li>\n<li><p>地图 : <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(区域名称),<code class="codespan">{c}</code>(合并数值), <code class="codespan">{d}</code>(无)</p>\n</li>\n<li><p>饼图、仪表盘、漏斗图: <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(数据项名称),<code class="codespan">{c}</code>(数值), <code class="codespan">{d}</code>(百分比)</p>\n</li>\n</ul>\n<p>更多其它图表模板变量的含义可以见相应的图表的 label.formatter 配置项。</p>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b0}: {c0}<br />{b1}: {c1}'\n</code></pre>\n<p><strong>2, 回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array, ticket: string, callback: (ticket: string, html: string)) => string\n</code></pre>\n<p>第一个参数 <code class="codespan">params</code> 是 formatter 需要的数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n // 饼图的百分比\n percent: number,\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n<p>在 <a href="#tooltip.trigger">trigger</a> 为 <code class="codespan">'axis'</code> 的时候,或者 tooltip 被 <a href="#xAxis.axisPointer">axisPointer</a> 触发的时候,<code class="codespan">params</code> 是多个系列的数据数组。其中每项内容格式同上,并且,</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n<p><strong>注:</strong> ECharts 2.x 使用数组表示各参数的方式不再支持。</p>\n<p>第二个参数 <code class="codespan">ticket</code> 是异步回调标识,配合第三个参数 <code class="codespan">callback</code> 使用。\n第三个参数 <code class="codespan">callback</code> 是异步回调,在提示框浮层内容是异步获取的时候,可以通过 callback 传入上述的 <code class="codespan">ticket</code> 和 <code class="codespan">html</code> 更新提示框浮层内容。</p>\n<p>示例:</p>\n<pre><code class="lang-js">formatter: function (params, ticket, callback) {\n $.get('detail?name=' + params.name, function (content) {\n callback(ticket, toHTML(content));\n });\n return 'Loading';\n}\n</code></pre>\n'},"tooltip.backgroundColor":{desc:'<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的背景颜色。</p>\n'},"tooltip.borderColor":{desc:'\n\n\n\n\n<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的边框颜色。</p>\n',uiControl:{type:"color",default:"#333"}},"tooltip.borderWidth":{desc:'\n\n\n\n\n<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的边框宽。</p>\n',uiControl:{type:"number",default:"0",step:"0.5"}},"tooltip.padding":{desc:'\n\n\n\n\n<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n\n\n<p>提示框浮层内边距,单位px,默认各方向内边距为5,接受数组分别设定上右下左边距。</p>\n<p>使用示例:</p>\n<pre><code class="lang-js">// 设置内边距为 5\npadding: 5\n// 设置上下的内边距为 5,左右的内边距为 10\npadding: [5, 10]\n// 分别设置四个方向的内边距\npadding: [\n 5, // 上\n 10, // 右\n 5, // 下\n 10, // 左\n]\n</code></pre>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"tooltip.textStyle":{desc:'<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的文本样式。</p>\n'},"tooltip.textStyle.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"'#fff'"}},"tooltip.textStyle.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"tooltip.textStyle.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"tooltip.textStyle.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"tooltip.textStyle.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"14",min:"1",step:"1"}},"tooltip.textStyle.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"tooltip.textStyle.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"tooltip.textStyle.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"tooltip.textStyle.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"tooltip.textStyle.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"tooltip.textStyle.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"tooltip.textStyle.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"tooltip.textStyle.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"tooltip.textStyle.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"tooltip.textStyle.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"tooltip.textStyle.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"tooltip.textStyle.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"tooltip.extraCssText":{desc:'<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>额外附加到浮层的 css 样式。如下为浮层添加阴影的示例:</p>\n<pre><code class="lang-js">extraCssText: 'box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);'\n</code></pre>\n'}}),s("pie",{id:{desc:"<p>组件 ID。默认不指定。指定则可用于在 option 或者 API 中引用组件。</p>\n"},name:{desc:'<p>系列名称,用于<a href="#tooltip">tooltip</a>的显示,<a href="#legend">legend</a> 的图例筛选,在 <code class="codespan">setOption</code> 更新数据和配置项时用于指定对应的系列。</p>\n'},legendHoverLink:{desc:'\n\n<p>是否启用<a href="#legend">图例</a> hover 时的联动高亮。</p>\n',uiControl:{type:"boolean",default:"true"}},selectedMode:{desc:'\n\n<p>选中模式的配置,表示是否支持多个选中,默认关闭,支持布尔值和字符串,字符串取值可选<code class="codespan">'single'</code>,<code class="codespan">'multiple'</code>,分别表示单选还是多选。</p>\n',uiControl:{type:"enum",options:"false,true,single,multiple"}},selectedOffset:{desc:"\n\n<p>选中扇区的偏移距离。</p>\n",uiControl:{type:"number",min:"0",default:"10"}},clockwise:{desc:"\n\n<p>饼图的扇区是否是顺时针排布。</p>\n",uiControl:{type:"boolean",default:"true"}},startAngle:{desc:"\n\n<p>起始角度,支持范围[0, 360]。</p>\n",uiControl:{type:"angle",step:"1",min:"0",max:"360",default:"90"}},minAngle:{desc:"\n\n<p>最小的扇区角度(0 ~ 360),用于防止某个值过小导致扇区太小影响交互。</p>\n",uiControl:{type:"angle",step:"1",min:"0",max:"360",default:"0"}},minShowLabelAngle:{desc:"\n\n<p>小于这个角度(0 ~ 360)的扇区,不显示标签(label 和 labelLine)。</p>\n",uiControl:{type:"angle",step:"1",min:"0",max:"360",default:"0"}},roseType:{desc:'\n\n<p>是否展示成南丁格尔图,通过半径区分数据大小。可选择两种模式:</p>\n<ul>\n<li><code class="codespan">'radius'</code> 扇区圆心角展现数据的百分比,半径展现数据的大小。</li>\n<li><code class="codespan">'area'</code> 所有扇区圆心角相同,仅通过半径展现数据大小。</li>\n</ul>\n',uiControl:{type:"enum",options:"radius,area"}},avoidLabelOverlap:{desc:'\n\n<p>是否启用防止标签重叠策略,默认开启,在标签拥挤重叠的情况下会挪动各个标签的位置,防止标签间的重叠。</p>\n<p>如果不需要开启该策略,例如<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=pie-doughnut" target="_blank">圆环图</a>这个例子中需要强制所有标签放在中心位置,可以将该值设为 <code class="codespan">false</code>。</p>\n',uiControl:{type:"boolean",default:"true"}},stillShowZeroSum:{desc:'\n\n<p>是否在数据和为<code class="codespan">0</code>(一般情况下所有数据为<code class="codespan">0</code>) 的时候不显示扇区。</p>\n',uiControl:{type:"boolean",default:"true"}},cursor:{desc:'\n\n<p>鼠标悬浮时在图形元素上时鼠标的样式是什么。同 CSS 的 <code class="codespan">cursor</code>。</p>\n',uiControl:{type:"enum",options:"auto,pointer,move",default:"pointer"}},zlevel:{desc:'<p>所有图形的 zlevel 值。</p>\n<p><code class="codespan">zlevel</code>用于 Canvas 分层,不同<code class="codespan">zlevel</code>值的图形会放置在不同的 Canvas 中,Canvas 分层是一种常见的优化手段。我们可以把一些图形变化频繁(例如有动画)的组件设置成一个单独的<code class="codespan">zlevel</code>。需要注意的是过多的 Canvas 会引起内存开销的增大,在手机端上需要谨慎使用以防崩溃。</p>\n<p><code class="codespan">zlevel</code> 大的 Canvas 会放在 <code class="codespan">zlevel</code> 小的 Canvas 的上面。</p>\n'},z:{desc:'<p>组件的所有图形的<code class="codespan">z</code>值。控制图形的前后顺序。<code class="codespan">z</code>值小的图形会被<code class="codespan">z</code>值大的图形覆盖。</p>\n<p><code class="codespan">z</code>相比<code class="codespan">zlevel</code>优先级更低,而且不会创建新的 Canvas。</p>\n'},left:{desc:'\n\n<p>pie chart组件离容器左侧的距离。</p>\n<p><code class="codespan">left</code> 的值可以是像 <code class="codespan">20</code> 这样的具体像素值,可以是像 <code class="codespan">'20%'</code> 这样相对于容器高宽的百分比,也可以是 <code class="codespan">'left'</code>, <code class="codespan">'center'</code>, <code class="codespan">'right'</code>。</p>\n<p>如果 <code class="codespan">left</code> 的值为<code class="codespan">'left'</code>, <code class="codespan">'center'</code>, <code class="codespan">'right'</code>,组件会根据相应的位置自动对齐。</p>\n',uiControl:{type:"percent",default:"0%"}},top:{desc:'\n\n<p>pie chart组件离容器上侧的距离。</p>\n<p><code class="codespan">top</code> 的值可以是像 <code class="codespan">20</code> 这样的具体像素值,可以是像 <code class="codespan">'20%'</code> 这样相对于容器高宽的百分比,也可以是 <code class="codespan">'top'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'bottom'</code>。</p>\n<p>如果 <code class="codespan">top</code> 的值为<code class="codespan">'top'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'bottom'</code>,组件会根据相应的位置自动对齐。</p>\n',uiControl:{type:"percent",default:"0%"}},right:{desc:'\n\n<p>pie chart组件离容器右侧的距离。</p>\n<p><code class="codespan">right</code> 的值可以是像 <code class="codespan">20</code> 这样的具体像素值,可以是像 <code class="codespan">'20%'</code> 这样相对于容器高宽的百分比。</p>\n<p>默认自适应。</p>\n',uiControl:{type:"percent",default:"0%"}},bottom:{desc:'\n\n<p>pie chart组件离容器下侧的距离。</p>\n<p>bottom 的值可以是像 <code class="codespan">20</code> 这样的具体像素值,可以是像 <code class="codespan">'20%'</code> 这样相对于容器高宽的百分比。</p>\n<p>默认自适应。</p>\n',uiControl:{type:"percent",default:"0%"}},width:{desc:"\n\n<p>pie chart组件的宽度。默认自适应。</p>\n",uiControl:{type:"percent",default:"50%"}},height:{desc:"\n\n<p>pie chart组件的高度。默认自适应。</p>\n",uiControl:{type:"percent",default:"50%"}},label:{desc:"<p>饼图图形上的文本标签,可用于说明图形的一些数据信息,比如值,名称等。</p>\n"},"label.position":{desc:'<p>标签的位置。</p>\n<p><strong>可选:</strong></p>\n<ul>\n<li><p><code class="codespan">'outside'</code></p>\n<p> 饼图扇区外侧,通过<a href="#series-pie.labelLine">视觉引导线</a>连到相应的扇区。</p>\n</li>\n<li><p><code class="codespan">'inside'</code></p>\n<p> 饼图扇区内部。</p>\n</li>\n<li><p><code class="codespan">'inner'</code> 同 <code class="codespan">'inside'</code>。</p>\n</li>\n<li><p><code class="codespan">'center'</code></p>\n<p> 在饼图中心位置。见<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=pie-doughnut" target="_blank">圆环图示例</a></p>\n</li>\n</ul>\n'},"label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n // 百分比\n percent: number,\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"label.rotate":{desc:'<p>标签旋转:</p>\n<ul>\n<li>如果为 <code class="codespan">true</code>,则为径向排布。</li>\n<li>如果为 <code class="codespan">number</code> ,旋转指定角度,从 -90 度到 90 度。正值是逆时针。</li>\n</ul>\n'},"label.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"label.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"label.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"label.rich.<style_name>.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"label.rich.<style_name>.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"label.rich.<style_name>.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"label.alignTo":{desc:'\n\n<p>标签的对齐方式,仅当 <code class="codespan">position</code> 值为 <code class="codespan">'outer'</code> 时有效。</p>\n<p>从 ECharts v4.6.0 版本起,我们提供了 <code class="codespan">'labelLine'</code> 与 <code class="codespan">'edge'</code> 两种新的布局方式。</p>\n<ul>\n<li><code class="codespan">'none'</code>(默认值):label line 的长度为固定值,分别为 <a href="#series-pie.labelLine.length">labelLine.length</a> 及 <a href="#series-pie.labelLine.length2">labelLine.length2</a>。</li>\n<li><code class="codespan">'labelLine'</code>:label line 的末端对齐,其中最短的长度由 <a href="#series-pie.labelLine.length2">labelLine.length2</a> 决定。</li>\n<li><code class="codespan">'edge'</code>:文字对齐,文字的边距由 <a href="#series-pie.label.margin">label.margin</a> 决定。</li>\n</ul>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=pie-alignTo&reset=1&edit=1" width="900" height="250"><iframe />\n\n',uiControl:{type:"enum",options:"labelLine,edge"}},"label.margin":{desc:'\n\n<p>文字边距,仅当 <a href="#series-pie.label.position">label.position</a> 为 <code class="codespan">'outer'</code> 并且 <a href="#series-pie.label.alignTo">label.alignTo</a> 为 <code class="codespan">'edge'</code> 时有效。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/pie-label-margin&edit=1&reset=1" width="900" height="250"><iframe />\n\n\n<p>通常来说,对于移动端等分辨率较小的情况,<code class="codespan">margin</code> 值设为比较小的值(比如 <code class="codespan">10</code>)能在有限的空间内显示更多文字,而不是被裁剪为 <code class="codespan">...</code>。但是对于分辨率更大的场景,百分比的值可以避免 label line 过长。如果你需要在不同分辨率下使用,建议使用<a href="tutorial.html#移动端自适应" target="_blank">响应式图表设计</a>为不同的分辨率设置不同的 <code class="codespan">margin</code> 值。</p>\n',uiControl:{type:"percent",default:"20%"}},"label.bleedMargin":{desc:'\n\n<p>文字的出血线大小,超过出血线的文字将被裁剪为 <code class="codespan">'...'</code>。仅当 <a href="#series-pie.label.position">label.position</a> 为 <code class="codespan">'outer'</code> 并且 <a href="#series-pie.label.alignTo">label.alignTo</a> 为 <code class="codespan">'none'</code> 或 <code class="codespan">'labelLine'</code> 的情况有效。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/pie-label-bleedMargin&edit=1&reset=1" width="800" height="250"><iframe />\n\n',uiControl:{type:"number",default:"10",min:"0",step:"1"}},"label.distanceToLabelLine":{desc:'\n\n<p>文字与 label line 之间的距离。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/pie-label-distanceToLabelLine&edit=1&reset=1" width="800" height="250"><iframe />\n\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},labelLine:{desc:'<p>标签的视觉引导线配置。在 <a href="#series-pie.label.position">label 位置</a> 设置为<code class="codespan">'outside'</code>的时候会显示视觉引导线。</p>\n'},"labelLine.show":{desc:"\n\n<p>是否显示视觉引导线。</p>\n",uiControl:{type:"boolean"}},"labelLine.showAbove":{desc:"<p>是否显示在图形上方。</p>\n"},"labelLine.length":{desc:"\n\n<p>视觉引导线第一段的长度。</p>\n",uiControl:{type:"number",default:"15",min:"0",step:"1"}},"labelLine.length2":{desc:"\n\n<p>视觉引导项第二段的长度。</p>\n",uiControl:{type:"number",default:"15",min:"0",step:"1"}},"labelLine.smooth":{desc:'\n\n<p>是否平滑视觉引导线,默认不平滑,可以设置成 <code class="codespan">true</code> 平滑显示,也可以设置为 0 到 1 的值,表示平滑程度。</p>\n',uiControl:{type:"boolean"}},"labelLine.minTurnAngle":{desc:"<p>通过调整第二段线的长度,限制引导线两端之间最小的夹角,以防止过小的夹角导致显示不美观。</p>\n<p>可以设置为 0 - 180 度。</p>\n"},"labelLine.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"labelLine.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"labelLine.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"labelLine.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"labelLine.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"labelLine.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"labelLine.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"labelLine.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"labelLine.maxSurfaceAngle":{desc:"<p>通过调整第二段线的长度,限制引导线与扇区法线的最大夹角。设置为小于 90 度的值保证引导线不会和扇区交叉。</p>\n<p>可以设置为 0 - 180 度。</p>\n"},labelLayout:{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>标签的统一布局配置。</p>\n<p>该配置项是在每个系列默认的标签布局基础上,统一调整标签的<code class="codespan">(x, y)</code>位置,标签对齐等属性以实现想要的标签布局效果。</p>\n<p>该配置项也可以是一个有如下参数的回调函数</p>\n<pre><code class="lang-js">// 标签对应数据的 dataIndex\ndataIndex: number\n// 标签对应的数据类型,只在关系图中会有 node 和 edge 数据类型的区分\ndataType?: string\n// 标签对应的系列的 index\nseriesIndex: number\n// 标签显示的文本\ntext: string\n// 默认的标签的包围盒,由系列默认的标签布局决定\nlabelRect: {x: number, y: number, width: number, height: number}\n// 默认的标签水平对齐\nalign: 'left' | 'center' | 'right'\n// 默认的标签垂直对齐\nverticalAlign: 'top' | 'middle' | 'bottom'\n// 标签所对应的数据图形的包围盒,可用于定位标签位置\nrect: {x: number, y: number, width: number, height: number}\n// 默认引导线的位置,目前只有饼图(pie)和漏斗图(funnel)有默认标签位置\n// 如果没有该值则为 null\nlabelLinePoints?: number[][]\n</code></pre>\n<p><strong>示例:</strong></p>\n<p>将标签显示在图形右侧 10px 的位置,并且垂直居中:</p>\n<pre><code class="lang-js">labelLayout(params) {\n return {\n x: params.rect.x + 10,\n y: params.rect.y + params.rect.height / 2,\n verticalAlign: 'middle',\n align: 'left'\n }\n}\n</code></pre>\n<p>根据图形的包围盒尺寸决定文本尺寸</p>\n<pre><code class="lang-js">\nlabelLayout(params) {\n return {\n fontSize: Math.max(params.rect.width / 10, 5)\n };\n}\n</code></pre>\n'},"labelLayout.hideOverlap":{desc:'<p>是否隐藏重叠的标签。</p>\n<p>下面示例演示了在关系图中开启该配置后,在缩放时可以实现自动的标签隐藏。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=graph-label-overlap&edit=1&reset=1" width="600" height="400"><iframe />\n\n'},"labelLayout.moveOverlap":{desc:'<p>在标签重叠的时候是否挪动标签位置以防止重叠。</p>\n<p>目前支持配置为:</p>\n<ul>\n<li><code class="codespan">'shiftX'</code> 水平方向依次位移,在水平方向对齐时使用</li>\n<li><code class="codespan">'shiftY'</code> 垂直方向依次位移,在垂直方向对齐时使用</li>\n</ul>\n<p>下面是标签右对齐并配置垂直方向依次位移以防止重叠的示例。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=scatter-label-align-right&edit=1&reset=1" width="600" height="400"><iframe />\n\n'},"labelLayout.x":{desc:'<p>标签的 x 位置。支持绝对的像素值或者<code class="codespan">'20%'</code>这样的相对值。</p>\n'},"labelLayout.y":{desc:'<p>标签的 y 位置。支持绝对的像素值或者<code class="codespan">'20%'</code>这样的相对值。</p>\n'},"labelLayout.dx":{desc:'<p>标签在 x 方向上的像素偏移。可以和<code class="codespan">x</code>一起使用。</p>\n'},"labelLayout.dy":{desc:'<p>标签在 y 方向上的像素偏移。可以和<code class="codespan">y</code>一起使用</p>\n'},"labelLayout.rotate":{desc:"<p>标签旋转角度。</p>\n"},"labelLayout.width":{desc:'<p>标签显示的宽度。可以配合<code class="codespan">overflow</code>使用控制标签显示在固定宽度内</p>\n'},"labelLayout.height":{desc:'<p>标签显示的高度。可以配合<code class="codespan">lineOverflow</code>使用控制标签显示在固定高度内</p>\n'},"labelLayout.align":{desc:'<p>标签水平对齐方式。可以设置<code class="codespan">'left'</code>, <code class="codespan">'center'</code>, <code class="codespan">'right'</code>。</p>\n'},"labelLayout.verticalAlign":{desc:'<p>标签垂直对齐方式。可以设置<code class="codespan">'top'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'bottom'</code>。</p>\n'},"labelLayout.fontSize":{desc:"<p>The text size of the label.</p>\n"},"labelLayout.draggable":{desc:"<p>标签是否可以允许用户通过拖拽二次调整位置。</p>\n"},"labelLayout.labelLinePoints":{desc:'<p>标签引导线三个点的位置。格式为:</p>\n<pre><code class="lang-js">[[x, y], [x, y], [x, y]]\n</code></pre>\n<p>在饼图中常用来微调已经计算好的引导线,其它情况一般不建议设置。</p>\n'},itemStyle:{desc:"<p> 图形样式。</p>\n"},"itemStyle.color":{desc:'\n\n<p>图形的颜色。 默认从全局调色盘 <a href="#color">option.color</a> 获取颜色 </p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n<p>支持使用回调函数。回调函数格式如下:</p>\n<pre><code class="lang-js">(params: Object) => Color\n</code></pre>\n<p>传入的是数据项 <code class="codespan">seriesIndex</code>, <code class="codespan">dataIndex</code>, <code class="codespan">data</code>, <code class="codespan">value</code> 等各个参数。</p>\n',uiControl:{type:"color"}},"itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"itemStyle.decal(Object | 'none')":{desc:'<p>图形的贴花图案,在 <a href="#aria.enabled">aria.enabled</a> 与 <a href="#aria.decal.show">aria.decal.show</a> 都是 <code class="codespan">true</code> 的情况下才生效。</p>\n<p>如果为 <code class="codespan">'none'</code> 表示不使用贴花图案。</p>\n'},"itemStyle.decal(Object | 'none').symbol(string|string[]) = 'rect'":{desc:'<p>贴花的图案,如果是 <code class="codespan">string[]</code> 表示循环使用数组中的图案。</p>\n<p>ECharts 提供的标记类型包括</p>\n<p><code class="codespan">'circle'</code>, <code class="codespan">'rect'</code>, <code class="codespan">'roundRect'</code>, <code class="codespan">'triangle'</code>, <code class="codespan">'diamond'</code>, <code class="codespan">'pin'</code>, <code class="codespan">'arrow'</code>, <code class="codespan">'none'</code></p>\n<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>'},"itemStyle.decal(Object | 'none').symbolSize":{desc:'<p>取值范围:<code class="codespan">0</code> 到 <code class="codespan">1</code>,表示占图案区域的百分比。</p>\n'},"itemStyle.decal(Object | 'none').symbolKeepAspect":{desc:"<p>是否保持图案的长宽比。</p>\n"},"itemStyle.decal(Object | 'none').color":{desc:"<p>贴花图案的颜色,建议使用半透明色,这样能叠加在系列本身的颜色上。</p>\n"},"itemStyle.decal(Object | 'none').backgroundColor":{desc:"<p>贴花的背景色,将会覆盖在系列本身颜色之上,贴花图案之下。</p>\n"},"itemStyle.decal(Object | 'none').dashArrayX(number | number[] | (number | number[])[]) = 5":{desc:'<p>贴花图案的基本模式是在横向和纵向上分别以<code class="codespan">图案 - 空白 - 图案 - 空白 - 图案 - 空白</code>的形式无限循环。通过设置每个图案和空白的长度,可以实现复杂的图案效果。</p>\n<p><code class="codespan">dashArrayX</code> 控制了横向的图案模式。当其值为 <code class="codespan">number</code> 或 <code class="codespan">number[]</code> 类型时,与 <a href="https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-dasharray" target="_blank">SVG stroke-dasharray</a> 类似。</p>\n<ul>\n<li><p>如果是 <code class="codespan">number</code> 类型,表示图案和空白分别是这个值。如 <code class="codespan">5</code> 表示先显示宽度为 5 的图案,然后空 5 像素,再然后显示宽度为 5 的图案……</p>\n</li>\n<li><p>如果是 <code class="codespan">number[]</code> 类型,则表示图案和空白依次为数组值的循环。如:<code class="codespan">[5, 10, 2, 6]</code> 表示图案宽 5 像素,然后空 10 像素,然后图案宽 2 像素,然后空 6 像素,然后图案宽 5 像素……</p>\n</li>\n<li><p>如果是 <code class="codespan">(number | number[])[]</code> 类型,表示每行的图案和空白依次为数组值的循环。如:<code class="codespan">[10, [2, 5]]</code> 表示第一行以图案 10 像素空 10 像素循环,第二行以图案 2 像素空 5 像素循环,第三行以图案 10 像素空 10 像素循环……</p>\n</li>\n</ul>\n<p>可以结合以下的例子理解本接口:</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/aria-decal&edit=1&reset=1" width="700" height="300"><iframe />\n\n'},"itemStyle.decal(Object | 'none').dashArrayY(number | number[]) = 5":{desc:'<p>贴花图案的基本模式是在横向和纵向上分别以<code class="codespan">图案 - 空白 - 图案 - 空白 - 图案 - 空白</code>的形式无限循环。通过设置每个图案和空白的长度,可以实现复杂的图案效果。</p>\n<p><code class="codespan">dashArrayY</code> 控制了横向的图案模式。与 <a href="https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-dasharray" target="_blank">SVG stroke-dasharray</a> 类似。</p>\n<ul>\n<li><p>如果是 <code class="codespan">number</code> 类型,表示图案和空白分别是这个值。如 <code class="codespan">5</code> 表示先显示高度为 5 的图案,然后空 5 像素,再然后显示高度为 5 的图案……</p>\n</li>\n<li><p>如果是 <code class="codespan">number[]</code> 类型,则表示图案和空白依次为数组值的循环。如:<code class="codespan">[5, 10, 2, 6]</code> 表示图案高 5 像素,然后空 10 像素,然后图案高 2 像素,然后空 6 像素,然后图案高 5 像素……</p>\n</li>\n</ul>\n<p>可以结合以下的例子理解本接口:</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/aria-decal&edit=1&reset=1" width="700" height="300"><iframe />\n\n'},"itemStyle.decal(Object | 'none').rotation":{desc:'<p>图案的整体旋转角度(弧度制),取值范围从 <code class="codespan">-Math.PI</code> 到 <code class="codespan">Math.PI</code>。</p>\n'},"itemStyle.decal(Object | 'none').maxTileWidth":{desc:"<p>生成的图案在未重复之前的宽度上限。通常不需要设置该值,当你发现图案在重复的时候出现不连续的接缝时,可以尝试提高该值。</p>\n"},"itemStyle.decal(Object | 'none').maxTileHeight":{desc:"<p>生成的图案在未重复之前的高度上限。通常不需要设置该值,当你发现图案在重复的时候出现不连续的接缝时,可以尝试提高该值。</p>\n"},emphasis:{desc:"<p>高亮状态的扇区和标签样式。</p>\n"},"emphasis.scale":{desc:"\n\n<p>是否开启高亮后扇区的放大效果。</p>\n",uiControl:{type:"boolean",default:"true"}},"emphasis.scaleSize":{desc:'\n\n<p>高亮后扇区的放大尺寸, 在开启 <a href="#series-pie.emphasis.scale">emphasis.scale</a> 后有效。</p>\n',uiControl:{type:"number",min:"0",default:"10"}},"emphasis.focus":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>在高亮图形时,是否淡出其它数据的图形已达到聚焦的效果。支持如下配置:</p>\n<ul>\n<li><code class="codespan">'none'</code> 不淡出其它图形,默认使用该配置。</li>\n<li><code class="codespan">'self'</code> 只聚焦(不淡出)当前高亮的数据的图形。</li>\n<li><code class="codespan">'series'</code> 聚焦当前高亮的数据所在的系列的所有图形。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<p>下面代码配置了柱状图在高亮一个图形的时候,淡出当前直角坐标系所有其它的系列。</p>\n<pre><code class="lang-js">emphasis: {\n focus: 'series',\n blurScope: 'coordinateSystem'\n}\n</code></pre>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-y-category-stack&reset=1&edit=1" width="600" height="400"><iframe />\n\n'},"emphasis.blurScope":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>在开启<code class="codespan">focus</code>的时候,可以通过<code class="codespan">blurScope</code>配置淡出的范围。支持如下配置</p>\n<ul>\n<li><code class="codespan">'coordinateSystem'</code> 淡出范围为坐标系,默认使用该配置。</li>\n<li><code class="codespan">'series'</code> 淡出范围为系列。</li>\n<li><code class="codespan">'global'</code> 淡出范围为全局。</li>\n</ul>\n'},"emphasis.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n // 百分比\n percent: number,\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"emphasis.label.rotate":{desc:'<p>标签旋转:</p>\n<ul>\n<li>如果为 <code class="codespan">true</code>,则为径向排布。</li>\n<li>如果为 <code class="codespan">number</code> ,旋转指定角度,从 -90 度到 90 度。正值是逆时针。</li>\n</ul>\n'},"emphasis.label.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"emphasis.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"emphasis.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"emphasis.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"emphasis.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"emphasis.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"emphasis.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"emphasis.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"emphasis.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"emphasis.label.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"emphasis.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"emphasis.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"emphasis.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"emphasis.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"emphasis.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"emphasis.label.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"emphasis.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"emphasis.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"emphasis.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"emphasis.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"emphasis.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"emphasis.label.rich.<style_name>.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"emphasis.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"emphasis.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"emphasis.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"emphasis.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"emphasis.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"emphasis.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"emphasis.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"emphasis.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"emphasis.label.rich.<style_name>.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"emphasis.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"emphasis.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"emphasis.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"emphasis.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"emphasis.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"emphasis.label.rich.<style_name>.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"emphasis.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"emphasis.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"emphasis.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"emphasis.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"emphasis.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"emphasis.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"emphasis.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"emphasis.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"emphasis.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"emphasis.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},blur:{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>淡出状态的扇区和标签样式。开启 <a href="#series-pie.emphasis.focus">emphasis.focus</a> 后有效。</p>\n'},"blur.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n // 百分比\n percent: number,\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"blur.label.rotate":{desc:'<p>标签旋转:</p>\n<ul>\n<li>如果为 <code class="codespan">true</code>,则为径向排布。</li>\n<li>如果为 <code class="codespan">number</code> ,旋转指定角度,从 -90 度到 90 度。正值是逆时针。</li>\n</ul>\n'},"blur.label.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"blur.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"blur.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"blur.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"blur.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"blur.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"blur.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"blur.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"blur.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"blur.label.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"blur.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"blur.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"blur.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"blur.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"blur.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"blur.label.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"blur.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"blur.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"blur.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"blur.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"blur.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"blur.label.rich.<style_name>.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"blur.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"blur.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"blur.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"blur.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"blur.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"blur.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"blur.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"blur.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"blur.label.rich.<style_name>.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"blur.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"blur.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"blur.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"blur.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"blur.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"blur.label.rich.<style_name>.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"blur.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"blur.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"blur.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"blur.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"blur.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"blur.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"blur.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"blur.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"blur.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"blur.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},select:{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>选中状态的扇区和标签样式。开启 <a href="#series-pie.selectedMode">selectedMode</a> 后有效。</p>\n'},"select.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n // 百分比\n percent: number,\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"select.label.rotate":{desc:'<p>标签旋转:</p>\n<ul>\n<li>如果为 <code class="codespan">true</code>,则为径向排布。</li>\n<li>如果为 <code class="codespan">number</code> ,旋转指定角度,从 -90 度到 90 度。正值是逆时针。</li>\n</ul>\n'},"select.label.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"select.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"select.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"select.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"select.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"select.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"select.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"select.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"select.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"select.label.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"select.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"select.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"select.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"select.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"select.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"select.label.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"select.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"select.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"select.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"select.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"select.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"select.label.rich.<style_name>.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"select.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"select.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"select.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"select.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"select.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"select.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"select.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"select.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"select.label.rich.<style_name>.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"select.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"select.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"select.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"select.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"select.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"select.label.rich.<style_name>.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"select.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"select.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"select.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"select.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"select.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"select.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"select.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"select.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"select.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"select.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},center:{desc:"\n\n<p>饼图的中心(圆心)坐标,数组的第一项是横坐标,第二项是纵坐标。</p>\n<p>支持设置成百分比,设置成百分比时第一项是相对于容器宽度,第二项是相对于容器高度。</p>\n<p><strong>使用示例:</strong></p>\n<pre><code>// 设置成绝对的像素值\ncenter: [400, 300]\n// 设置成相对的百分比\ncenter: ['50%', '50%']\n</code></pre>",uiControl:{type:"percentvector",dims:"x,y"}},radius:{desc:'\n\n<p>饼图的半径。可以为如下类型:</p>\n<ul>\n<li><code class="codespan">number</code>:直接指定外半径值。</li>\n<li><code class="codespan">string</code>:例如,<code class="codespan">'20%'</code>,表示外半径为可视区尺寸(容器高宽中较小一项)的 20% 长度。</li>\n</ul>\n<ul>\n<li><code class="codespan">Array.<number|string></code>:数组的第一项是内半径,第二项是外半径。每一项遵从上述 <code class="codespan">number</code> <code class="codespan">string</code> 的描述。</li>\n</ul>\n<p>可以将内半径设大显示成圆环图(Donut chart)。</p>\n',uiControl:{type:"percentvector",dims:"inner,outer",default:"0%, 75%"}},seriesLayoutBy:{desc:'<p>当使用 <a href="#dataset">dataset</a> 时,<code class="codespan">seriesLayoutBy</code> 指定了 <code class="codespan">dataset</code> 中用行还是列对应到系列上,也就是说,系列“排布”到 <code class="codespan">dataset</code> 的行还是列上。可取值:</p>\n<ul>\n<li>'column':默认,<code class="codespan">dataset</code> 的列对应于系列,从而 <code class="codespan">dataset</code> 中每一列是一个维度(dimension)。</li>\n<li>'row':<code class="codespan">dataset</code> 的行对应于系列,从而 <code class="codespan">dataset</code> 中每一行是一个维度(dimension)。</li>\n</ul>\n<p>参见这个 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=dataset-series-layout-by&theme=lite" target="_blank">示例</a></p>\n'},datasetIndex:{desc:'<p>如果 <a href="#series.data">series.data</a> 没有指定,并且 <a href="#dataset">dataset</a> 存在,那么就会使用 <a href="#dataset">dataset</a>。<code class="codespan">datasetIndex</code> 指定本系列使用那个 <a href="#dataset">dataset</a>。</p>\n'},dimensions:{desc:'<p>使用 dimensions 定义 <code class="codespan">series.data</code> 或者 <code class="codespan">dataset.source</code> 的每个维度的信息。</p>\n<p>注意:如果使用了 <a href="#dataset">dataset</a>,那么可以在 <a href="#dataset.dimensions">dataset.dimensions</a> 中定义 dimension ,或者在 <a href="#dataset.source">dataset.source</a> 的第一行/列中给出 dimension 名称。于是就不用在这里指定 dimension。但如果在这里指定了 <code class="codespan">dimensions</code>,那么优先使用这里的。</p>\n<p>例如:</p>\n<pre><code class="lang-js">option = {\n dataset: {\n source: [\n // 有了上面 dimensions 定义后,下面这五个维度的名称分别为:\n // 'date', 'open', 'close', 'highest', 'lowest'\n [12, 44, 55, 66, 2],\n [23, 6, 16, 23, 1],\n ...\n ]\n },\n series: {\n type: 'xxx',\n // 定义了每个维度的名称。这个名称会被显示到默认的 tooltip 中。\n dimensions: ['date', 'open', 'close', 'highest', 'lowest']\n }\n}\n</code></pre>\n<pre><code class="lang-js">series: {\n type: 'xxx',\n dimensions: [\n null, // 如果此维度不想给出定义,则使用 null 即可\n {type: 'ordinal'}, // 只定义此维度的类型。\n // 'ordinal' 表示离散型,一般文本使用这种类型。\n // 如果类型没有被定义,会自动猜测类型。\n {name: 'good', type: 'number'},\n 'bad' // 等同于 {name: 'bad'}\n ]\n}\n</code></pre>\n<p><code class="codespan">dimensions</code> 数组中的每一项可以是:</p>\n<ul>\n<li><code class="codespan">string</code>,如 <code class="codespan">'someName'</code>,等同于 <code class="codespan">{name: 'someName'}</code></li>\n<li><code class="codespan">Object</code>,属性可以有:<ul>\n<li>name: <code class="codespan">string</code>。</li>\n<li>type: <code class="codespan">string</code>,支持<ul>\n<li><code class="codespan">number</code>,默认,表示普通数据。</li>\n<li><code class="codespan">ordinal</code>,对于类目、文本这些 string 类型的数据,如果需要能在数轴上使用,须是 'ordinal' 类型。ECharts 默认会自动判断这个类型。但是自动判断也是不可能很完备的,所以使用者也可以手动强制指定。</li>\n<li><code class="codespan">float</code>,即 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Float64Array" target="_blank">Float64Array</a>。</li>\n<li><code class="codespan">int</code>,即 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Int32Array" target="_blank">Int32Array</a>。</li>\n<li><code class="codespan">time</code>,表示时间类型。设置成 'time' 则能支持自动解析数据成时间戳(timestamp),比如该维度的数据是 '2017-05-10',会自动被解析。时间类型的支持参见 <a href="#series.data">data</a>。</li>\n</ul>\n</li>\n<li>displayName: 一般用于 tooltip 中维度名的展示。<code class="codespan">string</code> 如果没有指定,默认使用 name 来展示。</li>\n</ul>\n</li>\n</ul>\n<p>值得一提的是,当定义了 <code class="codespan">dimensions</code> 后,默认 <code class="codespan">tooltip</code> 中对个维度的显示,会变为『竖排』,从而方便显示每个维度的名称。如果没有定义 <code class="codespan">dimensions</code>,则默认 <code class="codespan">tooltip</code> 会横排显示,且只显示数值没有维度名称可显示。</p>\n'},encode:{desc:'<p>可以定义 <code class="codespan">data</code> 的哪个维度被编码成什么。比如:</p>\n<pre><code class="lang-js">option = {\n dataset: {\n source: [\n // 每一列称为一个『维度』。\n // 这里分别是维度 0、1、2、3、4。\n [12, 44, 55, 66, 2],\n [23, 6, 16, 23, 1],\n ...\n ]\n },\n series: {\n type: 'xxx',\n encode: {\n x: [3, 1, 5], // 表示维度 3、1、5 映射到 x 轴。\n y: 2, // 表示维度 2 映射到 y 轴。\n tooltip: [3, 2, 4] // 表示维度 3、2、4 会在 tooltip 中显示。\n }\n }\n}\n</code></pre>\n<p>当使用 <a href="#series.dimensions">dimensions</a> 给维度定义名称后,<code class="codespan">encode</code> 中可直接引用名称,例如:</p>\n<pre><code class="lang-js">series: {\n type: 'xxx',\n dimensions: ['date', 'open', 'close', 'highest', 'lowest'],\n encode: {\n x: 'date',\n y: ['open', 'close', 'highest', 'lowest']\n }\n}\n</code></pre>\n<p><code class="codespan">encode</code> 声明的基本结构如下,其中冒号左边是坐标系、标签等特定名称,如 <code class="codespan">'x'</code>, <code class="codespan">'y'</code>, <code class="codespan">'tooltip'</code> 等,冒号右边是数据中的维度名(string 格式)或者维度的序号(number 格式,从 0 开始计数),可以指定一个或多个维度(使用数组)。通常情况下,下面各种信息不需要所有的都写,按需写即可。</p>\n<p>下面是 encode 支持的属性:</p>\n<pre><code class="lang-js">// 在任何坐标系和系列中,都支持:\nencode: {\n // 使用 “名为 product 的维度” 和 “名为 score 的维度” 的值在 tooltip 中显示\n tooltip: ['product', 'score']\n // 使用 “维度 1” 和 “维度 3” 的维度名连起来作为系列名。(有时候名字比较长,这可以避免在 series.name 重复输入这些名字)\n seriesName: [1, 3],\n // 表示使用 “维度2” 中的值作为 id。这在使用 setOption 动态更新数据时有用处,可以使新老数据用 id 对应起来,从而能够产生合适的数据更新动画。\n itemId: 2,\n // 指定数据项的名称使用 “维度3” 在饼图等图表中有用,可以使这个名字显示在图例(legend)中。\n itemName: 3\n}\n\n// 直角坐标系(grid/cartesian)特有的属性:\nencode: {\n // 把 “维度1”、“维度5”、“名为 score 的维度” 映射到 X 轴:\n x: [1, 5, 'score'],\n // 把“维度0”映射到 Y 轴。\n y: 0\n}\n\n// 单轴(singleAxis)特有的属性:\nencode: {\n single: 3\n}\n\n// 极坐标系(polar)特有的属性:\nencode: {\n radius: 3,\n angle: 2\n}\n\n// 地理坐标系(geo)特有的属性:\nencode: {\n lng: 3,\n lat: 2\n}\n\n// 对于一些没有坐标系的图表,例如饼图、漏斗图等,可以是:\nencode: {\n value: 3\n}\n</code></pre>\n<p>这是个更丰富的 <code class="codespan">encode</code> 的<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=dataset-encode1&edit=1&reset=1" target="_blank">示例</a>:</p>\n<p>特殊地,在 <a href="#series-custom">自定义系列(custom series)</a> 中,<code class="codespan">encode</code> 中轴可以不指定或设置为 <code class="codespan">null/undefined</code>,从而使系列免于受这个轴控制,也就是说,轴的范围(extent)不会受此系列数值的影响,轴被 <a href="#dataZoom">dataZoom</a> 控制时也不会过滤掉这个系列:</p>\n<pre><code class="lang-js">var option = {\n xAxis: {},\n yAxis: {},\n dataZoom: [{\n xAxisIndex: 0\n }, {\n yAxisIndex: 0\n }],\n series: {\n type: 'custom',\n renderItem: function (params, api) {\n return {\n type: 'circle',\n shape: {\n cx: 100, // x 位置永远为 100\n cy: api.coord([0, api.value(0)])[1],\n r: 30\n },\n style: {\n fill: 'blue'\n }\n };\n },\n encode: {\n // 这样这个系列就不会被 x 轴以及 x\n // 轴上的 dataZoom 控制了。\n x: -1,\n y: 1\n },\n data: [ ... ]\n }\n};\n</code></pre>\n'},data:{desc:'<p>系列中的数据内容数组。数组项可以为单个数值,如:</p>\n<pre><code class="lang-js">[12, 34, 56, 10, 23]\n</code></pre>\n<p>如果需要在数据中加入其它维度给 <a href="#visualMap">visualMap</a> 组件用来映射到颜色等其它图形属性。每个数据项也可以是数组,如:</p>\n<pre><code class="lang-js">[[12, 14], [34, 50], [56, 30], [10, 15], [23, 10]]\n</code></pre>\n<p>这时候可以将每项数组中的第二个值指定给 <a href="#visualMap">visualMap</a> 组件。</p>\n<p>更多时候我们需要指定每个数据项的名称,这时候需要每个项为一个对象:</p>\n<pre><code class="lang-js">[{\n // 数据项的名称\n name: '数据1',\n // 数据项值8\n value: 10\n}, {\n name: '数据2',\n value: 20\n}]\n</code></pre>\n<p>需要对个别内容指定进行个性化定义时:</p>\n<pre><code class="lang-js">[{\n name: '数据1',\n value: 10\n}, {\n // 数据项名称\n name: '数据2',\n value : 56,\n //自定义特殊 tooltip,仅对该数据项有效\n tooltip:{},\n //自定义特殊itemStyle,仅对该item有效\n itemStyle:{}\n}]\n</code></pre>\n'},"data.name":{desc:"<p>数据项名称。</p>\n"},"data.value":{desc:"<p>数据值。</p>\n"},"data.selected":{desc:"<p>该数据项是否被选中。</p>\n"},"data.label":{desc:"<p>单个扇区的标签配置。</p>\n"},"data.label.position":{desc:'<p>标签的位置。</p>\n<p><strong>可选:</strong></p>\n<ul>\n<li><p><code class="codespan">'outside'</code></p>\n<p> 饼图扇区外侧,通过<a href="#series-pie.labelLine">视觉引导线</a>连到相应的扇区。</p>\n</li>\n<li><p><code class="codespan">'inside'</code></p>\n<p> 饼图扇区内部。</p>\n</li>\n<li><p><code class="codespan">'inner'</code> 同 <code class="codespan">'inside'</code>。</p>\n</li>\n<li><p><code class="codespan">'center'</code></p>\n<p> 在饼图中心位置。见<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=pie-doughnut" target="_blank">圆环图示例</a></p>\n</li>\n</ul>\n'},"data.label.rotate":{desc:'<p>标签旋转:</p>\n<ul>\n<li>如果为 <code class="codespan">true</code>,则为径向排布。</li>\n<li>如果为 <code class="codespan">number</code> ,旋转指定角度,从 -90 度到 90 度。正值是逆时针。</li>\n</ul>\n'},"data.label.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"data.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.label.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"data.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"data.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"data.label.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"data.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"data.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"data.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"data.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"data.label.rich.<style_name>.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"data.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.label.rich.<style_name>.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"data.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.label.rich.<style_name>.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"data.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.itemStyle":{desc:"<p> 图形样式。</p>\n"},"data.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"data.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"data.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"data.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"data.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"data.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"data.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"data.itemStyle.decal(Object | 'none')":{desc:'<p>图形的贴花图案,在 <a href="#aria.enabled">aria.enabled</a> 与 <a href="#aria.decal.show">aria.decal.show</a> 都是 <code class="codespan">true</code> 的情况下才生效。</p>\n<p>如果为 <code class="codespan">'none'</code> 表示不使用贴花图案。</p>\n'},"data.itemStyle.decal(Object | 'none').symbol(string|string[]) = 'rect'":{desc:'<p>贴花的图案,如果是 <code class="codespan">string[]</code> 表示循环使用数组中的图案。</p>\n<p>ECharts 提供的标记类型包括</p>\n<p><code class="codespan">'circle'</code>, <code class="codespan">'rect'</code>, <code class="codespan">'roundRect'</code>, <code class="codespan">'triangle'</code>, <code class="codespan">'diamond'</code>, <code class="codespan">'pin'</code>, <code class="codespan">'arrow'</code>, <code class="codespan">'none'</code></p>\n<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>'},"data.itemStyle.decal(Object | 'none').symbolSize":{desc:'<p>取值范围:<code class="codespan">0</code> 到 <code class="codespan">1</code>,表示占图案区域的百分比。</p>\n'},"data.itemStyle.decal(Object | 'none').symbolKeepAspect":{desc:"<p>是否保持图案的长宽比。</p>\n"},"data.itemStyle.decal(Object | 'none').color":{desc:"<p>贴花图案的颜色,建议使用半透明色,这样能叠加在系列本身的颜色上。</p>\n"},"data.itemStyle.decal(Object | 'none').backgroundColor":{desc:"<p>贴花的背景色,将会覆盖在系列本身颜色之上,贴花图案之下。</p>\n"},"data.itemStyle.decal(Object | 'none').dashArrayX(number | number[] | (number | number[])[]) = 5":{desc:'<p>贴花图案的基本模式是在横向和纵向上分别以<code class="codespan">图案 - 空白 - 图案 - 空白 - 图案 - 空白</code>的形式无限循环。通过设置每个图案和空白的长度,可以实现复杂的图案效果。</p>\n<p><code class="codespan">dashArrayX</code> 控制了横向的图案模式。当其值为 <code class="codespan">number</code> 或 <code class="codespan">number[]</code> 类型时,与 <a href="https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-dasharray" target="_blank">SVG stroke-dasharray</a> 类似。</p>\n<ul>\n<li><p>如果是 <code class="codespan">number</code> 类型,表示图案和空白分别是这个值。如 <code class="codespan">5</code> 表示先显示宽度为 5 的图案,然后空 5 像素,再然后显示宽度为 5 的图案……</p>\n</li>\n<li><p>如果是 <code class="codespan">number[]</code> 类型,则表示图案和空白依次为数组值的循环。如:<code class="codespan">[5, 10, 2, 6]</code> 表示图案宽 5 像素,然后空 10 像素,然后图案宽 2 像素,然后空 6 像素,然后图案宽 5 像素……</p>\n</li>\n<li><p>如果是 <code class="codespan">(number | number[])[]</code> 类型,表示每行的图案和空白依次为数组值的循环。如:<code class="codespan">[10, [2, 5]]</code> 表示第一行以图案 10 像素空 10 像素循环,第二行以图案 2 像素空 5 像素循环,第三行以图案 10 像素空 10 像素循环……</p>\n</li>\n</ul>\n<p>可以结合以下的例子理解本接口:</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/aria-decal&edit=1&reset=1" width="700" height="300"><iframe />\n\n'},"data.itemStyle.decal(Object | 'none').dashArrayY(number | number[]) = 5":{desc:'<p>贴花图案的基本模式是在横向和纵向上分别以<code class="codespan">图案 - 空白 - 图案 - 空白 - 图案 - 空白</code>的形式无限循环。通过设置每个图案和空白的长度,可以实现复杂的图案效果。</p>\n<p><code class="codespan">dashArrayY</code> 控制了横向的图案模式。与 <a href="https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-dasharray" target="_blank">SVG stroke-dasharray</a> 类似。</p>\n<ul>\n<li><p>如果是 <code class="codespan">number</code> 类型,表示图案和空白分别是这个值。如 <code class="codespan">5</code> 表示先显示高度为 5 的图案,然后空 5 像素,再然后显示高度为 5 的图案……</p>\n</li>\n<li><p>如果是 <code class="codespan">number[]</code> 类型,则表示图案和空白依次为数组值的循环。如:<code class="codespan">[5, 10, 2, 6]</code> 表示图案高 5 像素,然后空 10 像素,然后图案高 2 像素,然后空 6 像素,然后图案高 5 像素……</p>\n</li>\n</ul>\n<p>可以结合以下的例子理解本接口:</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/aria-decal&edit=1&reset=1" width="700" height="300"><iframe />\n\n'},"data.itemStyle.decal(Object | 'none').rotation":{desc:'<p>图案的整体旋转角度(弧度制),取值范围从 <code class="codespan">-Math.PI</code> 到 <code class="codespan">Math.PI</code>。</p>\n'},"data.itemStyle.decal(Object | 'none').maxTileWidth":{desc:"<p>生成的图案在未重复之前的宽度上限。通常不需要设置该值,当你发现图案在重复的时候出现不连续的接缝时,可以尝试提高该值。</p>\n"},"data.itemStyle.decal(Object | 'none').maxTileHeight":{desc:"<p>生成的图案在未重复之前的高度上限。通常不需要设置该值,当你发现图案在重复的时候出现不连续的接缝时,可以尝试提高该值。</p>\n"},"data.emphasis.label.rotate":{desc:'<p>标签旋转:</p>\n<ul>\n<li>如果为 <code class="codespan">true</code>,则为径向排布。</li>\n<li>如果为 <code class="codespan">number</code> ,旋转指定角度,从 -90 度到 90 度。正值是逆时针。</li>\n</ul>\n'},"data.emphasis.label.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"data.emphasis.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.emphasis.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.emphasis.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.emphasis.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.emphasis.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.emphasis.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.emphasis.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.emphasis.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.emphasis.label.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"data.emphasis.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.emphasis.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.emphasis.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.emphasis.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.emphasis.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.emphasis.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.emphasis.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.emphasis.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"data.emphasis.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"data.emphasis.label.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"data.emphasis.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.emphasis.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.emphasis.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.emphasis.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.emphasis.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.emphasis.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"data.emphasis.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"data.emphasis.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"data.emphasis.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"data.emphasis.label.rich.<style_name>.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"data.emphasis.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.emphasis.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.emphasis.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.emphasis.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.emphasis.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.emphasis.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.emphasis.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.emphasis.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.emphasis.label.rich.<style_name>.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"data.emphasis.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.emphasis.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.emphasis.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.emphasis.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.emphasis.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.emphasis.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.emphasis.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.emphasis.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.emphasis.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.emphasis.label.rich.<style_name>.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"data.emphasis.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.emphasis.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.emphasis.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.emphasis.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.emphasis.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.emphasis.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"data.emphasis.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"data.emphasis.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"data.emphasis.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"data.emphasis.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"data.emphasis.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"data.emphasis.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.emphasis.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.emphasis.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"data.blur":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n'},"data.blur.label.rotate":{desc:'<p>标签旋转:</p>\n<ul>\n<li>如果为 <code class="codespan">true</code>,则为径向排布。</li>\n<li>如果为 <code class="codespan">number</code> ,旋转指定角度,从 -90 度到 90 度。正值是逆时针。</li>\n</ul>\n'},"data.blur.label.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"data.blur.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.blur.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.blur.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.blur.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.blur.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.blur.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.blur.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.blur.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.blur.label.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"data.blur.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.blur.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.blur.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.blur.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.blur.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.blur.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.blur.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.blur.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"data.blur.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"data.blur.label.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"data.blur.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.blur.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.blur.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.blur.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.blur.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.blur.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"data.blur.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"data.blur.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"data.blur.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"data.blur.label.rich.<style_name>.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"data.blur.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.blur.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.blur.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.blur.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.blur.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.blur.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.blur.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.blur.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.blur.label.rich.<style_name>.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"data.blur.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.blur.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.blur.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.blur.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.blur.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.blur.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.blur.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.blur.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.blur.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.blur.label.rich.<style_name>.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"data.blur.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.blur.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.blur.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.blur.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.blur.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.blur.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"data.blur.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"data.blur.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"data.blur.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"data.blur.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"data.blur.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"data.blur.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.blur.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.blur.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"data.select":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n'},"data.select.label.rotate":{desc:'<p>标签旋转:</p>\n<ul>\n<li>如果为 <code class="codespan">true</code>,则为径向排布。</li>\n<li>如果为 <code class="codespan">number</code> ,旋转指定角度,从 -90 度到 90 度。正值是逆时针。</li>\n</ul>\n'},"data.select.label.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"data.select.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.select.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.select.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.select.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.select.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.select.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.select.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.select.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.select.label.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"data.select.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.select.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.select.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.select.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.select.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.select.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.select.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.select.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"data.select.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"data.select.label.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"data.select.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.select.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.select.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.select.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.select.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.select.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"data.select.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"data.select.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"data.select.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"data.select.label.rich.<style_name>.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"data.select.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.select.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.select.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.select.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.select.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.select.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.select.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.select.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.select.label.rich.<style_name>.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"data.select.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.select.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.select.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.select.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.select.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.select.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.select.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.select.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.select.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.select.label.rich.<style_name>.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"data.select.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.select.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.select.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.select.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.select.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.select.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"data.select.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"data.select.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"data.select.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"data.select.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"data.select.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"data.select.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.select.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.select.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"data.tooltip":{desc:"<p>本系列每个数据项中特定的 tooltip 设定。</p>\n"},"data.tooltip.position":{desc:'<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.data.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的位置,默认不设置时位置会跟随鼠标的位置。</p>\n<p>可选:</p>\n<ul>\n<li><p><code class="codespan">Array</code></p>\n<p> 通过数组表示提示框浮层的位置,支持数字设置绝对位置,百分比设置相对位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对位置,相对于容器左侧 10px, 上侧 10 px\n position: [10, 10]\n // 相对位置,放置在容器正中间\n position: ['50%', '50%']\n</code></pre>\n</li>\n<li><p><code class="codespan">Function</code></p>\n<p> 回调函数,格式如下:</p>\n<pre><code class="lang-js"> (point: Array, params: Object|Array.<Object>, dom: HTMLDomElement, rect: Object, size: Object) => Array\n</code></pre>\n<p> <strong>参数:</strong><br>\n point: 鼠标位置,如 [20, 40]。<br>\n params: 同 formatter 的参数相同。<br>\n dom: tooltip 的 dom 对象。<br>\n rect: 只有鼠标在图形上时有效,是一个用<code class="codespan">x</code>, <code class="codespan">y</code>, <code class="codespan">width</code>, <code class="codespan">height</code>四个属性表达的图形包围盒。<br>\n size: 包括 dom 的尺寸和 echarts 容器的当前尺寸,例如:<code class="codespan">{contentSize: [width, height], viewSize: [width, height]}</code>。<br></p>\n<p> <strong>返回值:</strong><br>\n 可以是一个表示 tooltip 位置的数组,数组值可以是绝对的像素值,也可以是相 百分比。<br>\n 也可以是一个对象,如:<code class="codespan">{left: 10, top: 30}</code>,或者 <code class="codespan">{right: '20%', bottom: 40}</code>。<br></p>\n<p> 如下示例:</p>\n<pre><code class="lang-js"> position: function (point, params, dom, rect, size) {\n // 固定在顶部\n return [point[0], '10%'];\n }\n</code></pre>\n<p> 或者:</p>\n<pre><code class="lang-js"> position: function (pos, params, dom, rect, size) {\n // 鼠标在左侧时 tooltip 显示到右侧,鼠标在右侧时 tooltip 显示到左侧。\n var obj = {top: 60};\n obj[['left', 'right'][+(pos[0] < size.viewSize[0] / 2)]] = 5;\n return obj;\n }\n</code></pre>\n</li>\n</ul>\n<ul>\n<li><p><code class="codespan">'inside'</code></p>\n<p> 鼠标所在图形的内部中心位置,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'top'</code></p>\n<p> 鼠标所在图形上侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'left'</code></p>\n<p> 鼠标所在图形左侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'right'</code></p>\n<p> 鼠标所在图形右侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'bottom'</code></p>\n<p> 鼠标所在图形底侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n</ul>\n'},"data.tooltip.formatter":{desc:'<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.data.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层内容格式器,支持字符串模板和回调函数两种形式。</p>\n<p><strong>1, 字符串模板</strong></p>\n<p>模板变量有 <code class="codespan">{a}</code>, <code class="codespan">{b}</code>,<code class="codespan">{c}</code>,<code class="codespan">{d}</code>,<code class="codespan">{e}</code>,分别表示系列名,数据名,数据值等。\n在 <a href="#tooltip.trigger">trigger</a> 为 <code class="codespan">'axis'</code> 的时候,会有多个系列的数据,此时可以通过 <code class="codespan">{a0}</code>, <code class="codespan">{a1}</code>, <code class="codespan">{a2}</code> 这种后面加索引的方式表示系列的索引。\n不同图表类型下的 <code class="codespan">{a}</code>,<code class="codespan">{b}</code>,<code class="codespan">{c}</code>,<code class="codespan">{d}</code> 含义不一样。\n其中变量<code class="codespan">{a}</code>, <code class="codespan">{b}</code>, <code class="codespan">{c}</code>, <code class="codespan">{d}</code>在不同图表类型下代表数据含义为:</p>\n<ul>\n<li><p>折线(区域)图、柱状(条形)图、K线图 : <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(类目值),<code class="codespan">{c}</code>(数值), <code class="codespan">{d}</code>(无)</p>\n</li>\n<li><p>散点图(气泡)图 : <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(数据名称),<code class="codespan">{c}</code>(数值数组), <code class="codespan">{d}</code>(无)</p>\n</li>\n<li><p>地图 : <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(区域名称),<code class="codespan">{c}</code>(合并数值), <code class="codespan">{d}</code>(无)</p>\n</li>\n<li><p>饼图、仪表盘、漏斗图: <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(数据项名称),<code class="codespan">{c}</code>(数值), <code class="codespan">{d}</code>(百分比)</p>\n</li>\n</ul>\n<p>更多其它图表模板变量的含义可以见相应的图表的 label.formatter 配置项。</p>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b0}: {c0}<br />{b1}: {c1}'\n</code></pre>\n<p><strong>2, 回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array, ticket: string, callback: (ticket: string, html: string)) => string\n</code></pre>\n<p>第一个参数 <code class="codespan">params</code> 是 formatter 需要的数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n // 饼图的百分比\n percent: number,\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n<p>在 <a href="#tooltip.trigger">trigger</a> 为 <code class="codespan">'axis'</code> 的时候,或者 tooltip 被 <a href="#xAxis.axisPointer">axisPointer</a> 触发的时候,<code class="codespan">params</code> 是多个系列的数据数组。其中每项内容格式同上,并且,</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n<p><strong>注:</strong> ECharts 2.x 使用数组表示各参数的方式不再支持。</p>\n<p>第二个参数 <code class="codespan">ticket</code> 是异步回调标识,配合第三个参数 <code class="codespan">callback</code> 使用。\n第三个参数 <code class="codespan">callback</code> 是异步回调,在提示框浮层内容是异步获取的时候,可以通过 callback 传入上述的 <code class="codespan">ticket</code> 和 <code class="codespan">html</code> 更新提示框浮层内容。</p>\n<p>示例:</p>\n<pre><code class="lang-js">formatter: function (params, ticket, callback) {\n $.get('detail?name=' + params.name, function (content) {\n callback(ticket, toHTML(content));\n });\n return 'Loading';\n}\n</code></pre>\n'},"data.tooltip.backgroundColor":{desc:'<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.data.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的背景颜色。</p>\n'},"data.tooltip.borderColor":{desc:'\n\n\n\n\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.data.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的边框颜色。</p>\n',uiControl:{type:"color",default:"#333"}},"data.tooltip.borderWidth":{desc:'\n\n\n\n\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.data.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的边框宽。</p>\n',uiControl:{type:"number",default:"0",step:"0.5"}},"data.tooltip.padding":{desc:'\n\n\n\n\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.data.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n\n\n<p>提示框浮层内边距,单位px,默认各方向内边距为5,接受数组分别设定上右下左边距。</p>\n<p>使用示例:</p>\n<pre><code class="lang-js">// 设置内边距为 5\npadding: 5\n// 设置上下的内边距为 5,左右的内边距为 10\npadding: [5, 10]\n// 分别设置四个方向的内边距\npadding: [\n 5, // 上\n 10, // 右\n 5, // 下\n 10, // 左\n]\n</code></pre>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.tooltip.textStyle":{desc:'<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.data.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的文本样式。</p>\n'},"data.tooltip.textStyle.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"'#fff'"}},"data.tooltip.textStyle.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.tooltip.textStyle.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.tooltip.textStyle.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.tooltip.textStyle.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"14",min:"1",step:"1"}},"data.tooltip.textStyle.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.tooltip.textStyle.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"data.tooltip.textStyle.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"data.tooltip.textStyle.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"data.tooltip.textStyle.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.tooltip.textStyle.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.tooltip.textStyle.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.tooltip.textStyle.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.tooltip.textStyle.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.tooltip.textStyle.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"data.tooltip.textStyle.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"data.tooltip.textStyle.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"data.tooltip.extraCssText":{desc:'<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.data.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>额外附加到浮层的 css 样式。如下为浮层添加阴影的示例:</p>\n<pre><code class="lang-js">extraCssText: 'box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);'\n</code></pre>\n'},markPoint:{desc:"<p>图表标注。</p>\n"},"markPoint.symbol":{desc:'\n\n<p>标记的图形。</p>\n<p>ECharts 提供的标记类型包括</p>\n<p><code class="codespan">'circle'</code>, <code class="codespan">'rect'</code>, <code class="codespan">'roundRect'</code>, <code class="codespan">'triangle'</code>, <code class="codespan">'diamond'</code>, <code class="codespan">'pin'</code>, <code class="codespan">'arrow'</code>, <code class="codespan">'none'</code></p>\n<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre><p>如果需要每个数据的图形不一样,可以设置为如下格式的回调函数:</p>\n<pre><code class="lang-js">(value: Array|number, params: Object) => string\n</code></pre>\n<p>其中第一个参数 <code class="codespan">value</code> 为 <a href="#series-pie.data">data</a> 中的数据值。第二个参数<code class="codespan">params</code> 是其它的数据项参数。</p>\n',uiControl:{type:"icon",default:"circle"}},"markPoint.symbolSize":{desc:'\n\n<p>标记的大小,可以设置成诸如 <code class="codespan">10</code> 这样单一的数字,也可以用数组分开表示宽和高,例如 <code class="codespan">[20, 10]</code> 表示标记宽为<code class="codespan">20</code>,高为<code class="codespan">10</code>。</p>\n<p>如果需要每个数据的图形大小不一样,可以设置为如下格式的回调函数:</p>\n<pre><code class="lang-js">(value: Array|number, params: Object) => number|Array\n</code></pre>\n<p>其中第一个参数 <code class="codespan">value</code> 为 <a href="#series-pie.data">data</a> 中的数据值。第二个参数<code class="codespan">params</code> 是其它的数据项参数。</p>\n',uiControl:{type:"number",min:"0"}},"markPoint.symbolRotate":{desc:'\n\n<p>标记的旋转角度(而非弧度)。正值表示逆时针旋转。注意在 <code class="codespan">markLine</code> 中当 <code class="codespan">symbol</code> 为 <code class="codespan">'arrow'</code> 时会忽略 <code class="codespan">symbolRotate</code> 强制设置为切线的角度。</p>\n<p>如果需要每个数据的旋转角度不一样,可以设置为如下格式的回调函数:</p>\n<pre><code class="lang-js">(value: Array|number, params: Object) => number\n</code></pre>\n<p>其中第一个参数 <code class="codespan">value</code> 为 <a href="#series-pie.data">data</a> 中的数据值。第二个参数<code class="codespan">params</code> 是其它的数据项参数。</p>\n<blockquote>\n<p>从 4.8.0 开始支持回调函数。</p>\n</blockquote>\n',uiControl:{type:"angle",min:"-180",max:"180",step:"1"}},"markPoint.symbolKeepAspect":{desc:'\n\n<p>如果 <code class="codespan">symbol</code> 是 <code class="codespan">path://</code> 的形式,是否在缩放时保持该图形的长宽比。</p>\n',uiControl:{type:"boolean",clean:"true"}},"markPoint.symbolOffset":{desc:'\n\n<p>标记相对于原本位置的偏移。默认情况下,标记会居中置放在数据对应的位置,但是如果 symbol 是自定义的矢量路径或者图片,就有可能不希望 symbol 居中。这时候可以使用该配置项配置 symbol 相对于原本居中的偏移,可以是绝对的像素值,也可以是相对的百分比。</p>\n<p>例如 <code class="codespan">[0, '50%']</code> 就是把自己向上移动了一半的位置,在 symbol 图形是气泡的时候可以让图形下端的箭头对准数据点。</p>\n',uiControl:{type:"vector",separate:"true",dims:"x,y"}},"markPoint.silent":{desc:"\n\n<p>图形是否不响应和触发鼠标事件,默认为 false,即响应和触发鼠标事件。</p>\n",uiControl:{type:"boolean"}},"markPoint.label":{desc:"<p>标注的文本。</p>\n"},"markPoint.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"true"}},"markPoint.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markPoint.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markPoint.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markPoint.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markPoint.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {@score}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markPoint.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markPoint.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markPoint.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markPoint.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markPoint.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markPoint.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markPoint.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markPoint.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markPoint.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markPoint.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markPoint.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markPoint.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markPoint.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markPoint.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markPoint.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markPoint.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markPoint.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markPoint.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markPoint.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markPoint.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markPoint.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markPoint.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markPoint.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markPoint.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markPoint.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markPoint.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markPoint.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markPoint.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markPoint.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markPoint.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markPoint.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markPoint.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markPoint.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markPoint.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markPoint.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.itemStyle":{desc:"<p>标注的样式。</p>\n"},"markPoint.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markPoint.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markPoint.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markPoint.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markPoint.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markPoint.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markPoint.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markPoint.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markPoint.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markPoint.emphasis":{desc:"<p>标注的高亮样式。</p>\n"},"markPoint.emphasis.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markPoint.emphasis.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markPoint.emphasis.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markPoint.emphasis.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markPoint.emphasis.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markPoint.emphasis.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {@score}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markPoint.emphasis.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markPoint.emphasis.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markPoint.emphasis.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markPoint.emphasis.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markPoint.emphasis.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markPoint.emphasis.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markPoint.emphasis.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markPoint.emphasis.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markPoint.emphasis.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.emphasis.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.emphasis.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.emphasis.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markPoint.emphasis.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markPoint.emphasis.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markPoint.emphasis.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.emphasis.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.emphasis.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.emphasis.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markPoint.emphasis.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markPoint.emphasis.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markPoint.emphasis.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.emphasis.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markPoint.emphasis.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.emphasis.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.emphasis.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.emphasis.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markPoint.emphasis.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markPoint.emphasis.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markPoint.emphasis.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markPoint.emphasis.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markPoint.emphasis.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markPoint.emphasis.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markPoint.emphasis.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markPoint.emphasis.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markPoint.emphasis.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markPoint.emphasis.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markPoint.emphasis.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markPoint.emphasis.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.emphasis.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.emphasis.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.emphasis.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markPoint.emphasis.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markPoint.emphasis.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markPoint.emphasis.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.emphasis.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.emphasis.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.emphasis.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markPoint.emphasis.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markPoint.emphasis.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markPoint.emphasis.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.emphasis.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markPoint.emphasis.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.emphasis.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.emphasis.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.emphasis.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markPoint.emphasis.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markPoint.emphasis.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markPoint.emphasis.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markPoint.emphasis.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markPoint.emphasis.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markPoint.emphasis.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markPoint.emphasis.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markPoint.emphasis.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markPoint.blur":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>标注的淡出样式。淡出的规则跟随所在系列。</p>\n'},"markPoint.blur.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markPoint.blur.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markPoint.blur.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markPoint.blur.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markPoint.blur.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markPoint.blur.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {@score}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markPoint.blur.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markPoint.blur.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markPoint.blur.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markPoint.blur.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markPoint.blur.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markPoint.blur.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markPoint.blur.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markPoint.blur.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markPoint.blur.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.blur.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.blur.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.blur.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markPoint.blur.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markPoint.blur.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markPoint.blur.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.blur.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.blur.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.blur.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markPoint.blur.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markPoint.blur.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markPoint.blur.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.blur.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markPoint.blur.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.blur.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.blur.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.blur.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markPoint.blur.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markPoint.blur.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markPoint.blur.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markPoint.blur.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markPoint.blur.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markPoint.blur.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markPoint.blur.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markPoint.blur.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markPoint.blur.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markPoint.blur.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markPoint.blur.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markPoint.blur.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.blur.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.blur.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.blur.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markPoint.blur.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markPoint.blur.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markPoint.blur.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.blur.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.blur.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.blur.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markPoint.blur.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markPoint.blur.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markPoint.blur.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.blur.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markPoint.blur.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.blur.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.blur.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.blur.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markPoint.blur.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markPoint.blur.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markPoint.blur.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markPoint.blur.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markPoint.blur.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markPoint.blur.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markPoint.blur.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markPoint.blur.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markPoint.data":{desc:'<p>标注的数据数组。每个数组项是一个对象,有下面几种方式指定标注的位置。</p>\n<ol>\n<li>通过 <a href="#series-pie.markPoint.data.x">x</a>, <a href="#series-pie.markPoint.data.y">y</a> 属性指定相对容器的屏幕坐标,单位像素,支持百分比。</li>\n</ol>\n<p>当多个属性同时存在时,优先级按上述的顺序。</p>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">data: [\n\n {\n name: '某个屏幕坐标',\n x: 100,\n y: 100\n }\n]\n</code></pre>\n'},"markPoint.data.name":{desc:"<p>标注名称。</p>\n"},"markPoint.data.x":{desc:"\n\n<p>相对容器的屏幕 x 坐标,单位像素。</p>\n",uiControl:{type:"percent",default:"0"}},"markPoint.data.y":{desc:"\n\n<p>相对容器的屏幕 y 坐标,单位像素。</p>\n",uiControl:{type:"percent",default:"0"}},"markPoint.data.value":{desc:"<p>标注值,可以不设。</p>\n"},"markPoint.data.symbol":{desc:'\n\n<p>标记的图形。</p>\n<p>ECharts 提供的标记类型包括</p>\n<p><code class="codespan">'circle'</code>, <code class="codespan">'rect'</code>, <code class="codespan">'roundRect'</code>, <code class="codespan">'triangle'</code>, <code class="codespan">'diamond'</code>, <code class="codespan">'pin'</code>, <code class="codespan">'arrow'</code>, <code class="codespan">'none'</code></p>\n<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>',uiControl:{type:"icon",default:"circle"}},"markPoint.data.symbolSize":{desc:'\n\n<p>标记的大小,可以设置成诸如 <code class="codespan">10</code> 这样单一的数字,也可以用数组分开表示宽和高,例如 <code class="codespan">[20, 10]</code> 表示标记宽为<code class="codespan">20</code>,高为<code class="codespan">10</code>。</p>\n',uiControl:{type:"number",min:"0"}},"markPoint.data.symbolRotate":{desc:'\n\n<p>标记的旋转角度(而非弧度)。正值表示逆时针旋转。注意在 <code class="codespan">markLine</code> 中当 <code class="codespan">symbol</code> 为 <code class="codespan">'arrow'</code> 时会忽略 <code class="codespan">symbolRotate</code> 强制设置为切线的角度。</p>\n',uiControl:{type:"angle",min:"-180",max:"180",step:"1"}},"markPoint.data.symbolKeepAspect":{desc:'\n\n<p>如果 <code class="codespan">symbol</code> 是 <code class="codespan">path://</code> 的形式,是否在缩放时保持该图形的长宽比。</p>\n',uiControl:{type:"boolean",clean:"true"}},"markPoint.data.symbolOffset":{desc:'\n\n<p>标记相对于原本位置的偏移。默认情况下,标记会居中置放在数据对应的位置,但是如果 symbol 是自定义的矢量路径或者图片,就有可能不希望 symbol 居中。这时候可以使用该配置项配置 symbol 相对于原本居中的偏移,可以是绝对的像素值,也可以是相对的百分比。</p>\n<p>例如 <code class="codespan">[0, '50%']</code> 就是把自己向上移动了一半的位置,在 symbol 图形是气泡的时候可以让图形下端的箭头对准数据点。</p>\n',uiControl:{type:"vector",separate:"true",dims:"x,y"}},"markPoint.data.itemStyle":{desc:"<p>该标注的样式。</p>\n"},"markPoint.data.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markPoint.data.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markPoint.data.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markPoint.data.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markPoint.data.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markPoint.data.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markPoint.data.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markPoint.data.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markPoint.data.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markPoint.data.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markPoint.data.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markPoint.data.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markPoint.data.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markPoint.data.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markPoint.data.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markPoint.data.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markPoint.data.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markPoint.data.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markPoint.data.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markPoint.data.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markPoint.data.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markPoint.data.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markPoint.data.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.data.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.data.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markPoint.data.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markPoint.data.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markPoint.data.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markPoint.data.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markPoint.data.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markPoint.data.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markPoint.data.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markPoint.data.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markPoint.data.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markPoint.data.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markPoint.data.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markPoint.data.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markPoint.data.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markPoint.data.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markPoint.data.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markPoint.data.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markPoint.data.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markPoint.data.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markPoint.data.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.data.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.data.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markPoint.data.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markPoint.data.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markPoint.data.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markPoint.data.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markPoint.data.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markPoint.data.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markPoint.data.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.emphasis.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markPoint.data.emphasis.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markPoint.data.emphasis.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markPoint.data.emphasis.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markPoint.data.emphasis.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markPoint.data.emphasis.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markPoint.data.emphasis.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markPoint.data.emphasis.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markPoint.data.emphasis.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markPoint.data.emphasis.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markPoint.data.emphasis.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markPoint.data.emphasis.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markPoint.data.emphasis.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markPoint.data.emphasis.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.data.emphasis.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.data.emphasis.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.emphasis.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markPoint.data.emphasis.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markPoint.data.emphasis.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markPoint.data.emphasis.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.emphasis.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.emphasis.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.emphasis.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markPoint.data.emphasis.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markPoint.data.emphasis.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markPoint.data.emphasis.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.emphasis.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markPoint.data.emphasis.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.emphasis.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.emphasis.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.emphasis.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markPoint.data.emphasis.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markPoint.data.emphasis.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markPoint.data.emphasis.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markPoint.data.emphasis.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markPoint.data.emphasis.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markPoint.data.emphasis.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markPoint.data.emphasis.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markPoint.data.emphasis.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markPoint.data.emphasis.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markPoint.data.emphasis.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markPoint.data.emphasis.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markPoint.data.emphasis.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.data.emphasis.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.data.emphasis.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.emphasis.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markPoint.data.emphasis.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markPoint.data.emphasis.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markPoint.data.emphasis.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.emphasis.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.emphasis.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.emphasis.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markPoint.data.emphasis.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markPoint.data.emphasis.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markPoint.data.emphasis.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.emphasis.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markPoint.data.emphasis.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.emphasis.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.emphasis.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.emphasis.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markPoint.data.emphasis.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markPoint.data.emphasis.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markPoint.data.emphasis.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markPoint.data.emphasis.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markPoint.data.emphasis.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markPoint.data.emphasis.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markPoint.data.emphasis.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markPoint.data.emphasis.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markPoint.animation":{desc:"\n\n<p>是否开启动画。</p>\n",uiControl:{type:"boolean",default:"true",clean:"true"}},"markPoint.animationThreshold":{desc:"<p>是否开启动画的阈值,当单个系列显示的图形数量大于这个阈值时会关闭动画。</p>\n"},"markPoint.animationDuration":{desc:'\n\n<p>初始动画的时长,支持回调函数,可以通过每个数据返回不同的时长实现更戏剧的初始动画效果:</p>\n<pre><code class="lang-js">animationDuration: function (idx) {\n // 越往后的数据时长越大\n return idx * 100;\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",default:"1000",step:"20",clean:"true"}},"markPoint.animationEasing":{desc:'\n\n<p>初始动画的缓动效果。不同的缓动效果可以参考 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=line-easing" target="_blank">缓动示例</a>。</p>\n',uiControl:{type:"enum",options:"linear,quadraticIn,quadraticOut,quadraticInOut,cubicIn,cubicOut,cubicInOut,quarticIn,quarticOut,quarticInOut,quinticIn,quinticOut,quinticInOut,sinusoidalIn,sinusoidalOut,sinusoidalInOut,exponentialIn,exponentialOut,exponentialInOut,circularIn,circularOut,circularInOut,elasticIn,elasticOut,elasticInOut,backIn,backOut,backInOut,bounceIn,bounceOut,bounceInOut",clean:"true"}},"markPoint.animationDelay":{desc:'<p>初始动画的延迟,支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的初始动画效果。</p>\n<p>如下示例:</p>\n<pre><code class="lang-js">animationDelay: function (idx) {\n // 越往后的数据延迟越大\n return idx * 100;\n}\n</code></pre>\n<p>也可以看<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-animation-delay" target="_blank">该示例</a></p>\n'},"markPoint.animationDurationUpdate":{desc:'\n\n<p>数据更新动画的时长。</p>\n<p>支持回调函数,可以通过每个数据返回不同的时长实现更戏剧的更新动画效果:</p>\n<pre><code class="lang-js">animationDurationUpdate: function (idx) {\n // 越往后的数据时长越大\n return idx * 100;\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",default:"1000",step:"20"}},"markPoint.animationEasingUpdate":{desc:"\n\n<p>数据更新动画的缓动效果。</p>\n",uiControl:{type:"enum",options:"linear,quadraticIn,quadraticOut,quadraticInOut,cubicIn,cubicOut,cubicInOut,quarticIn,quarticOut,quarticInOut,quinticIn,quinticOut,quinticInOut,sinusoidalIn,sinusoidalOut,sinusoidalInOut,exponentialIn,exponentialOut,exponentialInOut,circularIn,circularOut,circularInOut,elasticIn,elasticOut,elasticInOut,backIn,backOut,backInOut,bounceIn,bounceOut,bounceInOut"}},"markPoint.animationDelayUpdate":{desc:'<p>数据更新动画的延迟,支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的更新动画效果。</p>\n<p>如下示例:</p>\n<pre><code class="lang-js">animationDelayUpdate: function (idx) {\n // 越往后的数据延迟越大\n return idx * 100;\n}\n</code></pre>\n<p>也可以看<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-animation-delay" target="_blank">该示例</a></p>\n'},markLine:{desc:"<p>图表标线。</p>\n"},"markLine.silent":{desc:"\n\n<p>图形是否不响应和触发鼠标事件,默认为 false,即响应和触发鼠标事件。</p>\n",uiControl:{type:"boolean"}},"markLine.symbol":{desc:'<p>标线两端的标记类型,可以是一个数组分别指定两端,也可以是单个统一指定,具体格式见 <a href="#series-pie.markLine.data.0.symbol">data.symbol</a>。</p>\n'},"markLine.symbolSize":{desc:'<p>标线两端的标记大小,可以是一个数组分别指定两端,也可以是单个统一指定。</p>\n<p><strong>注意:</strong> 这里无法像一般的 <code class="codespan">symbolSize</code> 那样通过数组分别指定高宽。</p>\n'},"markLine.precision":{desc:"<p>标线数值的精度,在显示平均值线的时候有用。</p>\n"},"markLine.label":{desc:"<p>标线的文本。</p>\n"},"markLine.label.show":{desc:"<p>是否显示标签。</p>\n"},"markLine.label.position":{desc:'<p>标签位置,可选:</p>\n<ul>\n<li><code class="codespan">'start'</code> 线的起始点。</li>\n<li><code class="codespan">'middle'</code> 线的中点。</li>\n<li><code class="codespan">'end'</code> 线的结束点。</li>\n</ul>\n<p>4.7.0 版本起,支持更多标签位置:<code class="codespan">'start'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'end'</code>, <code class="codespan">'insideStartTop'</code>, <code class="codespan">'insideStartBottom'</code>, <code class="codespan">'insideMiddleTop'</code>, <code class="codespan">'insideMiddleBottom'</code>, <code class="codespan">'insideEndTop'</code>, <code class="codespan">'insideEndBottom'</code>。</p>\n<p>其中,<code class="codespan">'insideMiddleBottom'</code> 等同于 <code class="codespan">'middle'</code>。具体位置参见下图。</p>\n<p>文字与线的间距可以通过 <a href="#series-.markLine.label.distance">label.distance</a> 调整。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-markline&reset=1&edit=1" width="800" height="500"><iframe />\n\n'},"markLine.label.distance":{desc:"<p>标签与线之间的间距。如果是数组,第一项为横向间距,第二项为纵向间距。如果是数字,则表示横向纵向使用相同的间距。</p>\n"},"markLine.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markLine.lineStyle":{desc:"<p>标线的样式</p>\n"},"markLine.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markLine.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"markLine.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markLine.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markLine.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markLine.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markLine.lineStyle.curveness":{desc:"\n\n<p>边的曲度,支持从 0 到 1 的值,值越大曲度越大。</p>\n",uiControl:{type:"number",min:"0",max:"1",step:"0.01",default:"0"}},"markLine.emphasis":{desc:"<p>标线的高亮样式。</p>\n"},"markLine.emphasis.label.show":{desc:"<p>是否显示标签。</p>\n"},"markLine.emphasis.label.position":{desc:'<p>标签位置,可选:</p>\n<ul>\n<li><code class="codespan">'start'</code> 线的起始点。</li>\n<li><code class="codespan">'middle'</code> 线的中点。</li>\n<li><code class="codespan">'end'</code> 线的结束点。</li>\n</ul>\n<p>4.7.0 版本起,支持更多标签位置:<code class="codespan">'start'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'end'</code>, <code class="codespan">'insideStartTop'</code>, <code class="codespan">'insideStartBottom'</code>, <code class="codespan">'insideMiddleTop'</code>, <code class="codespan">'insideMiddleBottom'</code>, <code class="codespan">'insideEndTop'</code>, <code class="codespan">'insideEndBottom'</code>。</p>\n<p>其中,<code class="codespan">'insideMiddleBottom'</code> 等同于 <code class="codespan">'middle'</code>。具体位置参见下图。</p>\n<p>文字与线的间距可以通过 <a href="#series-.markLine.label.distance">label.distance</a> 调整。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-markline&reset=1&edit=1" width="800" height="500"><iframe />\n\n'},"markLine.emphasis.label.distance":{desc:"<p>标签与线之间的间距。如果是数组,第一项为横向间距,第二项为纵向间距。如果是数字,则表示横向纵向使用相同的间距。</p>\n"},"markLine.emphasis.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markLine.emphasis.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markLine.emphasis.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"markLine.emphasis.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markLine.emphasis.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markLine.emphasis.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markLine.emphasis.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.emphasis.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.emphasis.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markLine.blur":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>标线的淡出样式。淡出的规则跟随所在系列。</p>\n'},"markLine.blur.label.show":{desc:"<p>是否显示标签。</p>\n"},"markLine.blur.label.position":{desc:'<p>标签位置,可选:</p>\n<ul>\n<li><code class="codespan">'start'</code> 线的起始点。</li>\n<li><code class="codespan">'middle'</code> 线的中点。</li>\n<li><code class="codespan">'end'</code> 线的结束点。</li>\n</ul>\n<p>4.7.0 版本起,支持更多标签位置:<code class="codespan">'start'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'end'</code>, <code class="codespan">'insideStartTop'</code>, <code class="codespan">'insideStartBottom'</code>, <code class="codespan">'insideMiddleTop'</code>, <code class="codespan">'insideMiddleBottom'</code>, <code class="codespan">'insideEndTop'</code>, <code class="codespan">'insideEndBottom'</code>。</p>\n<p>其中,<code class="codespan">'insideMiddleBottom'</code> 等同于 <code class="codespan">'middle'</code>。具体位置参见下图。</p>\n<p>文字与线的间距可以通过 <a href="#series-.markLine.label.distance">label.distance</a> 调整。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-markline&reset=1&edit=1" width="800" height="500"><iframe />\n\n'},"markLine.blur.label.distance":{desc:"<p>标签与线之间的间距。如果是数组,第一项为横向间距,第二项为纵向间距。如果是数字,则表示横向纵向使用相同的间距。</p>\n"},"markLine.blur.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markLine.blur.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markLine.blur.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"markLine.blur.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markLine.blur.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markLine.blur.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markLine.blur.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.blur.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.blur.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markLine.data":{desc:'<p>标线的数据数组。每个数组项可以是一个两个值的数组,分别表示线的起点和终点,每一项是一个对象,有下面几种方式指定起点或终点的位置。</p>\n<ol>\n<li>通过 <a href="#series-pie.markLine.data.0.x">x</a>, <a href="#series-pie.markLine.data.0.y">y</a> 属性指定相对容器的屏幕坐标,单位像素,支持百分比。</li>\n</ol>\n<p>当多个属性同时存在时,优先级按上述的顺序。</p>\n<pre><code>data: [\n\n[\n {\n name: '两个屏幕坐标之间的标线',\n x: 100,\n y: 100\n },\n {\n x: 500,\n y: 200\n }\n ]\n]\n</code></pre>'},"markLine.data.0":{desc:"<p>起点的数据。</p>\n"},"markLine.data.0.name":{desc:"<p>标注名称,将会作为文字显示。</p>\n"},"markLine.data.0.x":{desc:"\n\n<p>相对容器的屏幕 x 坐标,单位像素。</p>\n",uiControl:{type:"percent",default:"0"}},"markLine.data.0.y":{desc:"\n\n<p>相对容器的屏幕 y 坐标,单位像素。</p>\n",uiControl:{type:"percent",default:"0"}},"markLine.data.0.value":{desc:"<p>标注值,可以不设。</p>\n"},"markLine.data.0.symbol":{desc:'\n\n<p>起点标记的图形。</p>\n<p>ECharts 提供的标记类型包括</p>\n<p><code class="codespan">'circle'</code>, <code class="codespan">'rect'</code>, <code class="codespan">'roundRect'</code>, <code class="codespan">'triangle'</code>, <code class="codespan">'diamond'</code>, <code class="codespan">'pin'</code>, <code class="codespan">'arrow'</code>, <code class="codespan">'none'</code></p>\n<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>',uiControl:{type:"icon",default:"circle"}},"markLine.data.0.symbolSize":{desc:'\n\n<p>起点标记的大小,可以设置成诸如 <code class="codespan">10</code> 这样单一的数字,也可以用数组分开表示宽和高,例如 <code class="codespan">[20, 10]</code> 表示标记宽为<code class="codespan">20</code>,高为<code class="codespan">10</code>。</p>\n',uiControl:{type:"number",min:"0"}},"markLine.data.0.symbolRotate":{desc:'\n\n<p>起点标记的旋转角度(而非弧度)。正值表示逆时针旋转。注意在 <code class="codespan">markLine</code> 中当 <code class="codespan">symbol</code> 为 <code class="codespan">'arrow'</code> 时会忽略 <code class="codespan">symbolRotate</code> 强制设置为切线的角度。</p>\n',uiControl:{type:"angle",min:"-180",max:"180",step:"1"}},"markLine.data.0.symbolKeepAspect":{desc:'\n\n<p>如果 <code class="codespan">symbol</code> 是 <code class="codespan">path://</code> 的形式,是否在缩放时保持该图形的长宽比。</p>\n',uiControl:{type:"boolean",clean:"true"}},"markLine.data.0.symbolOffset":{desc:'\n\n<p>起点标记相对于原本位置的偏移。默认情况下,标记会居中置放在数据对应的位置,但是如果 symbol 是自定义的矢量路径或者图片,就有可能不希望 symbol 居中。这时候可以使用该配置项配置 symbol 相对于原本居中的偏移,可以是绝对的像素值,也可以是相对的百分比。</p>\n<p>例如 <code class="codespan">[0, '50%']</code> 就是把自己向上移动了一半的位置,在 symbol 图形是气泡的时候可以让图形下端的箭头对准数据点。</p>\n',uiControl:{type:"vector",separate:"true",dims:"x,y"}},"markLine.data.0.lineStyle":{desc:'<p>该数据项线的样式,起点和终点项的 <code class="codespan">lineStyle</code>会合并到一起。</p>\n'},"markLine.data.0.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markLine.data.0.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"markLine.data.0.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markLine.data.0.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markLine.data.0.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markLine.data.0.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.0.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.0.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markLine.data.0.lineStyle.curveness":{desc:"\n\n<p>边的曲度,支持从 0 到 1 的值,值越大曲度越大。</p>\n",uiControl:{type:"number",min:"0",max:"1",step:"0.01",default:"0"}},"markLine.data.0.label":{desc:'<p>该数据项标签的样式,起点和终点项的 <code class="codespan">label</code>会合并到一起。</p>\n'},"markLine.data.0.label.show":{desc:"<p>是否显示标签。</p>\n"},"markLine.data.0.label.position":{desc:'<p>标签位置,可选:</p>\n<ul>\n<li><code class="codespan">'start'</code> 线的起始点。</li>\n<li><code class="codespan">'middle'</code> 线的中点。</li>\n<li><code class="codespan">'end'</code> 线的结束点。</li>\n</ul>\n<p>4.7.0 版本起,支持更多标签位置:<code class="codespan">'start'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'end'</code>, <code class="codespan">'insideStartTop'</code>, <code class="codespan">'insideStartBottom'</code>, <code class="codespan">'insideMiddleTop'</code>, <code class="codespan">'insideMiddleBottom'</code>, <code class="codespan">'insideEndTop'</code>, <code class="codespan">'insideEndBottom'</code>。</p>\n<p>其中,<code class="codespan">'insideMiddleBottom'</code> 等同于 <code class="codespan">'middle'</code>。具体位置参见下图。</p>\n<p>文字与线的间距可以通过 <a href="#series-.markLine.label.distance">label.distance</a> 调整。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-markline&reset=1&edit=1" width="800" height="500"><iframe />\n\n'},"markLine.data.0.label.distance":{desc:"<p>标签与线之间的间距。如果是数组,第一项为横向间距,第二项为纵向间距。如果是数字,则表示横向纵向使用相同的间距。</p>\n"},"markLine.data.0.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markLine.data.0.emphasis.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markLine.data.0.emphasis.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"markLine.data.0.emphasis.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markLine.data.0.emphasis.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markLine.data.0.emphasis.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markLine.data.0.emphasis.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.0.emphasis.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.0.emphasis.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markLine.data.0.emphasis.lineStyle.curveness":{desc:"\n\n<p>边的曲度,支持从 0 到 1 的值,值越大曲度越大。</p>\n",uiControl:{type:"number",min:"0",max:"1",step:"0.01",default:"0"}},"markLine.data.0.emphasis.label.show":{desc:"<p>是否显示标签。</p>\n"},"markLine.data.0.emphasis.label.position":{desc:'<p>标签位置,可选:</p>\n<ul>\n<li><code class="codespan">'start'</code> 线的起始点。</li>\n<li><code class="codespan">'middle'</code> 线的中点。</li>\n<li><code class="codespan">'end'</code> 线的结束点。</li>\n</ul>\n<p>4.7.0 版本起,支持更多标签位置:<code class="codespan">'start'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'end'</code>, <code class="codespan">'insideStartTop'</code>, <code class="codespan">'insideStartBottom'</code>, <code class="codespan">'insideMiddleTop'</code>, <code class="codespan">'insideMiddleBottom'</code>, <code class="codespan">'insideEndTop'</code>, <code class="codespan">'insideEndBottom'</code>。</p>\n<p>其中,<code class="codespan">'insideMiddleBottom'</code> 等同于 <code class="codespan">'middle'</code>。具体位置参见下图。</p>\n<p>文字与线的间距可以通过 <a href="#series-.markLine.label.distance">label.distance</a> 调整。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-markline&reset=1&edit=1" width="800" height="500"><iframe />\n\n'},"markLine.data.0.emphasis.label.distance":{desc:"<p>标签与线之间的间距。如果是数组,第一项为横向间距,第二项为纵向间距。如果是数字,则表示横向纵向使用相同的间距。</p>\n"},"markLine.data.0.emphasis.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markLine.data.0.blur":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n'},"markLine.data.0.blur.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markLine.data.0.blur.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"markLine.data.0.blur.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markLine.data.0.blur.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markLine.data.0.blur.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markLine.data.0.blur.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.0.blur.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.0.blur.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markLine.data.0.blur.lineStyle.curveness":{desc:"\n\n<p>边的曲度,支持从 0 到 1 的值,值越大曲度越大。</p>\n",uiControl:{type:"number",min:"0",max:"1",step:"0.01",default:"0"}},"markLine.data.0.blur.label.show":{desc:"<p>是否显示标签。</p>\n"},"markLine.data.0.blur.label.position":{desc:'<p>标签位置,可选:</p>\n<ul>\n<li><code class="codespan">'start'</code> 线的起始点。</li>\n<li><code class="codespan">'middle'</code> 线的中点。</li>\n<li><code class="codespan">'end'</code> 线的结束点。</li>\n</ul>\n<p>4.7.0 版本起,支持更多标签位置:<code class="codespan">'start'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'end'</code>, <code class="codespan">'insideStartTop'</code>, <code class="codespan">'insideStartBottom'</code>, <code class="codespan">'insideMiddleTop'</code>, <code class="codespan">'insideMiddleBottom'</code>, <code class="codespan">'insideEndTop'</code>, <code class="codespan">'insideEndBottom'</code>。</p>\n<p>其中,<code class="codespan">'insideMiddleBottom'</code> 等同于 <code class="codespan">'middle'</code>。具体位置参见下图。</p>\n<p>文字与线的间距可以通过 <a href="#series-.markLine.label.distance">label.distance</a> 调整。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-markline&reset=1&edit=1" width="800" height="500"><iframe />\n\n'},"markLine.data.0.blur.label.distance":{desc:"<p>标签与线之间的间距。如果是数组,第一项为横向间距,第二项为纵向间距。如果是数字,则表示横向纵向使用相同的间距。</p>\n"},"markLine.data.0.blur.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markLine.data.1":{desc:"<p>终点的数据。</p>\n"},"markLine.data.1.name":{desc:"<p>标注名称,将会作为文字显示。</p>\n"},"markLine.data.1.x":{desc:"\n\n<p>相对容器的屏幕 x 坐标,单位像素。</p>\n",uiControl:{type:"percent",default:"0"}},"markLine.data.1.y":{desc:"\n\n<p>相对容器的屏幕 y 坐标,单位像素。</p>\n",uiControl:{type:"percent",default:"0"}},"markLine.data.1.value":{desc:"<p>标注值,可以不设。</p>\n"},"markLine.data.1.symbol":{desc:'\n\n<p>终点标记的图形。</p>\n<p>ECharts 提供的标记类型包括</p>\n<p><code class="codespan">'circle'</code>, <code class="codespan">'rect'</code>, <code class="codespan">'roundRect'</code>, <code class="codespan">'triangle'</code>, <code class="codespan">'diamond'</code>, <code class="codespan">'pin'</code>, <code class="codespan">'arrow'</code>, <code class="codespan">'none'</code></p>\n<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>',uiControl:{type:"icon",default:"circle"}},"markLine.data.1.symbolSize":{desc:'\n\n<p>终点标记的大小,可以设置成诸如 <code class="codespan">10</code> 这样单一的数字,也可以用数组分开表示宽和高,例如 <code class="codespan">[20, 10]</code> 表示标记宽为<code class="codespan">20</code>,高为<code class="codespan">10</code>。</p>\n',uiControl:{type:"number",min:"0"}},"markLine.data.1.symbolRotate":{desc:'\n\n<p>终点标记的旋转角度(而非弧度)。正值表示逆时针旋转。注意在 <code class="codespan">markLine</code> 中当 <code class="codespan">symbol</code> 为 <code class="codespan">'arrow'</code> 时会忽略 <code class="codespan">symbolRotate</code> 强制设置为切线的角度。</p>\n',uiControl:{type:"angle",min:"-180",max:"180",step:"1"}},"markLine.data.1.symbolKeepAspect":{desc:'\n\n<p>如果 <code class="codespan">symbol</code> 是 <code class="codespan">path://</code> 的形式,是否在缩放时保持该图形的长宽比。</p>\n',uiControl:{type:"boolean",clean:"true"}},"markLine.data.1.symbolOffset":{desc:'\n\n<p>终点标记相对于原本位置的偏移。默认情况下,标记会居中置放在数据对应的位置,但是如果 symbol 是自定义的矢量路径或者图片,就有可能不希望 symbol 居中。这时候可以使用该配置项配置 symbol 相对于原本居中的偏移,可以是绝对的像素值,也可以是相对的百分比。</p>\n<p>例如 <code class="codespan">[0, '50%']</code> 就是把自己向上移动了一半的位置,在 symbol 图形是气泡的时候可以让图形下端的箭头对准数据点。</p>\n',uiControl:{type:"vector",separate:"true",dims:"x,y"}},"markLine.data.1.lineStyle":{desc:'<p>该数据项线的样式,起点和终点项的 <code class="codespan">lineStyle</code>会合并到一起。</p>\n'},"markLine.data.1.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markLine.data.1.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"markLine.data.1.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markLine.data.1.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markLine.data.1.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markLine.data.1.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.1.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.1.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markLine.data.1.lineStyle.curveness":{desc:"\n\n<p>边的曲度,支持从 0 到 1 的值,值越大曲度越大。</p>\n",uiControl:{type:"number",min:"0",max:"1",step:"0.01",default:"0"}},"markLine.data.1.label":{desc:'<p>该数据项标签的样式,起点和终点项的 <code class="codespan">label</code>会合并到一起。</p>\n'},"markLine.data.1.label.show":{desc:"<p>是否显示标签。</p>\n"},"markLine.data.1.label.position":{desc:'<p>标签位置,可选:</p>\n<ul>\n<li><code class="codespan">'start'</code> 线的起始点。</li>\n<li><code class="codespan">'middle'</code> 线的中点。</li>\n<li><code class="codespan">'end'</code> 线的结束点。</li>\n</ul>\n<p>4.7.0 版本起,支持更多标签位置:<code class="codespan">'start'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'end'</code>, <code class="codespan">'insideStartTop'</code>, <code class="codespan">'insideStartBottom'</code>, <code class="codespan">'insideMiddleTop'</code>, <code class="codespan">'insideMiddleBottom'</code>, <code class="codespan">'insideEndTop'</code>, <code class="codespan">'insideEndBottom'</code>。</p>\n<p>其中,<code class="codespan">'insideMiddleBottom'</code> 等同于 <code class="codespan">'middle'</code>。具体位置参见下图。</p>\n<p>文字与线的间距可以通过 <a href="#series-.markLine.label.distance">label.distance</a> 调整。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-markline&reset=1&edit=1" width="800" height="500"><iframe />\n\n'},"markLine.data.1.label.distance":{desc:"<p>标签与线之间的间距。如果是数组,第一项为横向间距,第二项为纵向间距。如果是数字,则表示横向纵向使用相同的间距。</p>\n"},"markLine.data.1.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markLine.data.1.emphasis.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markLine.data.1.emphasis.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"markLine.data.1.emphasis.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markLine.data.1.emphasis.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markLine.data.1.emphasis.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markLine.data.1.emphasis.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.1.emphasis.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.1.emphasis.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markLine.data.1.emphasis.lineStyle.curveness":{desc:"\n\n<p>边的曲度,支持从 0 到 1 的值,值越大曲度越大。</p>\n",uiControl:{type:"number",min:"0",max:"1",step:"0.01",default:"0"}},"markLine.data.1.emphasis.label.show":{desc:"<p>是否显示标签。</p>\n"},"markLine.data.1.emphasis.label.position":{desc:'<p>标签位置,可选:</p>\n<ul>\n<li><code class="codespan">'start'</code> 线的起始点。</li>\n<li><code class="codespan">'middle'</code> 线的中点。</li>\n<li><code class="codespan">'end'</code> 线的结束点。</li>\n</ul>\n<p>4.7.0 版本起,支持更多标签位置:<code class="codespan">'start'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'end'</code>, <code class="codespan">'insideStartTop'</code>, <code class="codespan">'insideStartBottom'</code>, <code class="codespan">'insideMiddleTop'</code>, <code class="codespan">'insideMiddleBottom'</code>, <code class="codespan">'insideEndTop'</code>, <code class="codespan">'insideEndBottom'</code>。</p>\n<p>其中,<code class="codespan">'insideMiddleBottom'</code> 等同于 <code class="codespan">'middle'</code>。具体位置参见下图。</p>\n<p>文字与线的间距可以通过 <a href="#series-.markLine.label.distance">label.distance</a> 调整。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-markline&reset=1&edit=1" width="800" height="500"><iframe />\n\n'},"markLine.data.1.emphasis.label.distance":{desc:"<p>标签与线之间的间距。如果是数组,第一项为横向间距,第二项为纵向间距。如果是数字,则表示横向纵向使用相同的间距。</p>\n"},"markLine.data.1.emphasis.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markLine.data.1.blur":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n'},"markLine.data.1.blur.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markLine.data.1.blur.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"markLine.data.1.blur.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markLine.data.1.blur.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markLine.data.1.blur.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markLine.data.1.blur.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.1.blur.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.1.blur.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markLine.data.1.blur.lineStyle.curveness":{desc:"\n\n<p>边的曲度,支持从 0 到 1 的值,值越大曲度越大。</p>\n",uiControl:{type:"number",min:"0",max:"1",step:"0.01",default:"0"}},"markLine.data.1.blur.label.show":{desc:"<p>是否显示标签。</p>\n"},"markLine.data.1.blur.label.position":{desc:'<p>标签位置,可选:</p>\n<ul>\n<li><code class="codespan">'start'</code> 线的起始点。</li>\n<li><code class="codespan">'middle'</code> 线的中点。</li>\n<li><code class="codespan">'end'</code> 线的结束点。</li>\n</ul>\n<p>4.7.0 版本起,支持更多标签位置:<code class="codespan">'start'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'end'</code>, <code class="codespan">'insideStartTop'</code>, <code class="codespan">'insideStartBottom'</code>, <code class="codespan">'insideMiddleTop'</code>, <code class="codespan">'insideMiddleBottom'</code>, <code class="codespan">'insideEndTop'</code>, <code class="codespan">'insideEndBottom'</code>。</p>\n<p>其中,<code class="codespan">'insideMiddleBottom'</code> 等同于 <code class="codespan">'middle'</code>。具体位置参见下图。</p>\n<p>文字与线的间距可以通过 <a href="#series-.markLine.label.distance">label.distance</a> 调整。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-markline&reset=1&edit=1" width="800" height="500"><iframe />\n\n'},"markLine.data.1.blur.label.distance":{desc:"<p>标签与线之间的间距。如果是数组,第一项为横向间距,第二项为纵向间距。如果是数字,则表示横向纵向使用相同的间距。</p>\n"},"markLine.data.1.blur.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markLine.animation":{desc:"\n\n<p>是否开启动画。</p>\n",uiControl:{type:"boolean",default:"true",clean:"true"}},"markLine.animationThreshold":{desc:"<p>是否开启动画的阈值,当单个系列显示的图形数量大于这个阈值时会关闭动画。</p>\n"},"markLine.animationDuration":{desc:'\n\n<p>初始动画的时长,支持回调函数,可以通过每个数据返回不同的时长实现更戏剧的初始动画效果:</p>\n<pre><code class="lang-js">animationDuration: function (idx) {\n // 越往后的数据时长越大\n return idx * 100;\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",default:"1000",step:"20",clean:"true"}},"markLine.animationEasing":{desc:'\n\n<p>初始动画的缓动效果。不同的缓动效果可以参考 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=line-easing" target="_blank">缓动示例</a>。</p>\n',uiControl:{type:"enum",options:"linear,quadraticIn,quadraticOut,quadraticInOut,cubicIn,cubicOut,cubicInOut,quarticIn,quarticOut,quarticInOut,quinticIn,quinticOut,quinticInOut,sinusoidalIn,sinusoidalOut,sinusoidalInOut,exponentialIn,exponentialOut,exponentialInOut,circularIn,circularOut,circularInOut,elasticIn,elasticOut,elasticInOut,backIn,backOut,backInOut,bounceIn,bounceOut,bounceInOut",clean:"true"}},"markLine.animationDelay":{desc:'<p>初始动画的延迟,支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的初始动画效果。</p>\n<p>如下示例:</p>\n<pre><code class="lang-js">animationDelay: function (idx) {\n // 越往后的数据延迟越大\n return idx * 100;\n}\n</code></pre>\n<p>也可以看<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-animation-delay" target="_blank">该示例</a></p>\n'},"markLine.animationDurationUpdate":{desc:'\n\n<p>数据更新动画的时长。</p>\n<p>支持回调函数,可以通过每个数据返回不同的时长实现更戏剧的更新动画效果:</p>\n<pre><code class="lang-js">animationDurationUpdate: function (idx) {\n // 越往后的数据时长越大\n return idx * 100;\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",default:"1000",step:"20"}},"markLine.animationEasingUpdate":{desc:"\n\n<p>数据更新动画的缓动效果。</p>\n",uiControl:{type:"enum",options:"linear,quadraticIn,quadraticOut,quadraticInOut,cubicIn,cubicOut,cubicInOut,quarticIn,quarticOut,quarticInOut,quinticIn,quinticOut,quinticInOut,sinusoidalIn,sinusoidalOut,sinusoidalInOut,exponentialIn,exponentialOut,exponentialInOut,circularIn,circularOut,circularInOut,elasticIn,elasticOut,elasticInOut,backIn,backOut,backInOut,bounceIn,bounceOut,bounceInOut"}},"markLine.animationDelayUpdate":{desc:'<p>数据更新动画的延迟,支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的更新动画效果。</p>\n<p>如下示例:</p>\n<pre><code class="lang-js">animationDelayUpdate: function (idx) {\n // 越往后的数据延迟越大\n return idx * 100;\n}\n</code></pre>\n<p>也可以看<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-animation-delay" target="_blank">该示例</a></p>\n'},markArea:{desc:"<p>图表标域,常用于标记图表中某个范围的数据,例如标出某段时间投放了广告。</p>\n"},"markArea.silent":{desc:"\n\n<p>图形是否不响应和触发鼠标事件,默认为 false,即响应和触发鼠标事件。</p>\n",uiControl:{type:"boolean"}},"markArea.label":{desc:"<p>标域文本配置。</p>\n"},"markArea.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markArea.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markArea.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markArea.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markArea.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markArea.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markArea.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markArea.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markArea.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markArea.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markArea.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markArea.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.itemStyle":{desc:"<p>该标域的样式。</p>\n"},"markArea.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markArea.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markArea.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markArea.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markArea.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markArea.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markArea.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markArea.emphasis":{desc:"<p>高亮的标域样式</p>\n"},"markArea.emphasis.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markArea.emphasis.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markArea.emphasis.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markArea.emphasis.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markArea.emphasis.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markArea.emphasis.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.emphasis.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.emphasis.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.emphasis.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.emphasis.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.emphasis.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.emphasis.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.emphasis.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.emphasis.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.emphasis.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.emphasis.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.emphasis.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.emphasis.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.emphasis.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.emphasis.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.emphasis.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.emphasis.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.emphasis.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markArea.emphasis.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markArea.emphasis.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.emphasis.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.emphasis.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.emphasis.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.emphasis.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.emphasis.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.emphasis.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markArea.emphasis.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markArea.emphasis.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markArea.emphasis.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markArea.emphasis.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.emphasis.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.emphasis.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.emphasis.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.emphasis.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.emphasis.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.emphasis.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.emphasis.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.emphasis.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.emphasis.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.emphasis.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.emphasis.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.emphasis.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.emphasis.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.emphasis.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.emphasis.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.emphasis.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.emphasis.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.emphasis.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.emphasis.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.emphasis.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.emphasis.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.emphasis.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.emphasis.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.emphasis.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.emphasis.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markArea.emphasis.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markArea.emphasis.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markArea.emphasis.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markArea.emphasis.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markArea.emphasis.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markArea.emphasis.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.emphasis.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.emphasis.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markArea.blur":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>淡出的标域样式。淡出的规则跟随所在系列。</p>\n'},"markArea.blur.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markArea.blur.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markArea.blur.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markArea.blur.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markArea.blur.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markArea.blur.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.blur.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.blur.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.blur.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.blur.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.blur.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.blur.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.blur.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.blur.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.blur.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.blur.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.blur.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.blur.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.blur.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.blur.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.blur.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.blur.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.blur.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markArea.blur.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markArea.blur.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.blur.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.blur.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.blur.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.blur.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.blur.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.blur.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markArea.blur.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markArea.blur.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markArea.blur.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markArea.blur.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.blur.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.blur.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.blur.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.blur.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.blur.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.blur.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.blur.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.blur.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.blur.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.blur.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.blur.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.blur.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.blur.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.blur.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.blur.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.blur.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.blur.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.blur.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.blur.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.blur.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.blur.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.blur.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.blur.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.blur.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.blur.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markArea.blur.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markArea.blur.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markArea.blur.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markArea.blur.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markArea.blur.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markArea.blur.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.blur.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.blur.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markArea.data":{desc:'<p>标域的数据数组。每个数组项是一个两个项的数组,分别表示标域左上角和右下角的位置,每个项支持通过下面几种方式指定自己的位置</p>\n<ol>\n<li>通过 <a href="#series-pie.markArea.data.0.x">x</a>, <a href="#series-pie.markArea.data.0.y">y</a> 属性指定相对容器的屏幕坐标,单位像素,支持百分比。</li>\n</ol>\n<p>当多个属性同时存在时,优先级按上述的顺序。</p>\n<pre><code>data: [\n\n[\n {\n name: '两个屏幕坐标之间的标域',\n x: 100,\n y: 100\n }, {\n x: '90%',\n y: '10%'\n }\n ]\n]\n</code></pre>'},"markArea.data.0":{desc:"<p>标域左上角的数据</p>\n"},"markArea.data.0.name":{desc:"<p>标注名称,将会作为文字显示。</p>\n"},"markArea.data.0.x":{desc:'\n\n<p>相对容器的屏幕 x 坐标,单位像素,支持百分比形式,例如 <code class="codespan">'20%'</code>。</p>\n',uiControl:{type:"percent",default:"0"}},"markArea.data.0.y":{desc:'\n\n<p>相对容器的屏幕 y 坐标,单位像素,支持百分比形式,例如 <code class="codespan">'20%'</code>。</p>\n',uiControl:{type:"percent",default:"0"}},"markArea.data.0.value":{desc:"<p>标域值,可以不设。</p>\n"},"markArea.data.0.itemStyle":{desc:'<p>该数据项区域的样式,起点和终点项的<code class="codespan">itemStyle</code>会合并到一起。</p>\n'},"markArea.data.0.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markArea.data.0.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markArea.data.0.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markArea.data.0.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markArea.data.0.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markArea.data.0.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markArea.data.0.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.0.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.0.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markArea.data.0.label":{desc:'<p>该数据项标签的样式,起点和终点项的<code class="codespan">label</code>会合并到一起。</p>\n'},"markArea.data.0.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markArea.data.0.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markArea.data.0.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markArea.data.0.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markArea.data.0.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markArea.data.0.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.0.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.0.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.0.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.0.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.0.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.0.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.0.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.0.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.0.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.0.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.0.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markArea.data.0.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markArea.data.0.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.0.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.0.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markArea.data.0.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markArea.data.0.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markArea.data.0.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markArea.data.0.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.0.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.0.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.0.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.0.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.0.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.0.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.0.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.0.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.0.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.0.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.0.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.0.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.0.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.0.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.0.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.emphasis.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markArea.data.0.emphasis.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markArea.data.0.emphasis.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markArea.data.0.emphasis.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markArea.data.0.emphasis.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markArea.data.0.emphasis.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markArea.data.0.emphasis.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.0.emphasis.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.0.emphasis.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markArea.data.0.emphasis.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markArea.data.0.emphasis.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markArea.data.0.emphasis.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markArea.data.0.emphasis.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markArea.data.0.emphasis.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markArea.data.0.emphasis.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.0.emphasis.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.0.emphasis.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.0.emphasis.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.0.emphasis.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.0.emphasis.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.0.emphasis.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.0.emphasis.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.0.emphasis.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.emphasis.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.emphasis.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.emphasis.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.0.emphasis.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.0.emphasis.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.0.emphasis.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.emphasis.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.emphasis.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.emphasis.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markArea.data.0.emphasis.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markArea.data.0.emphasis.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.0.emphasis.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.emphasis.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.0.emphasis.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.emphasis.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.emphasis.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.emphasis.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markArea.data.0.emphasis.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markArea.data.0.emphasis.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markArea.data.0.emphasis.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markArea.data.0.emphasis.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.0.emphasis.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.0.emphasis.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.0.emphasis.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.0.emphasis.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.0.emphasis.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.0.emphasis.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.0.emphasis.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.0.emphasis.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.emphasis.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.emphasis.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.emphasis.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.0.emphasis.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.0.emphasis.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.0.emphasis.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.emphasis.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.emphasis.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.emphasis.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.0.emphasis.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.0.emphasis.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.0.emphasis.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.emphasis.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.0.emphasis.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.emphasis.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.emphasis.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.blur":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n'},"markArea.data.0.blur.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markArea.data.0.blur.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markArea.data.0.blur.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markArea.data.0.blur.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markArea.data.0.blur.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markArea.data.0.blur.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markArea.data.0.blur.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.0.blur.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.0.blur.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markArea.data.0.blur.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markArea.data.0.blur.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markArea.data.0.blur.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markArea.data.0.blur.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markArea.data.0.blur.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markArea.data.0.blur.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.0.blur.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.0.blur.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.0.blur.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.0.blur.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.0.blur.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.0.blur.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.0.blur.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.0.blur.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.blur.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.blur.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.blur.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.0.blur.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.0.blur.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.0.blur.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.blur.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.blur.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.blur.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markArea.data.0.blur.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markArea.data.0.blur.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.0.blur.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.blur.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.0.blur.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.blur.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.blur.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.blur.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markArea.data.0.blur.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markArea.data.0.blur.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markArea.data.0.blur.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markArea.data.0.blur.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.0.blur.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.0.blur.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.0.blur.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.0.blur.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.0.blur.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.0.blur.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.0.blur.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.0.blur.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.blur.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.blur.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.blur.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.0.blur.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.0.blur.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.0.blur.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.blur.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.blur.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.blur.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.0.blur.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.0.blur.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.0.blur.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.blur.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.0.blur.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.blur.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.blur.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1":{desc:"<p>标域右下角的数据</p>\n"},"markArea.data.1.name":{desc:"<p>标注名称,将会作为文字显示。</p>\n"},"markArea.data.1.x":{desc:'\n\n<p>相对容器的屏幕 x 坐标,单位像素,支持百分比形式,例如 <code class="codespan">'20%'</code>。</p>\n',uiControl:{type:"percent",default:"0"}},"markArea.data.1.y":{desc:'\n\n<p>相对容器的屏幕 y 坐标,单位像素,支持百分比形式,例如 <code class="codespan">'20%'</code>。</p>\n',uiControl:{type:"percent",default:"0"}},"markArea.data.1.value":{desc:"<p>标域值,可以不设。</p>\n"},"markArea.data.1.itemStyle":{desc:'<p>该数据项区域的样式,起点和终点项的<code class="codespan">itemStyle</code>会合并到一起。</p>\n'},"markArea.data.1.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markArea.data.1.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markArea.data.1.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markArea.data.1.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markArea.data.1.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markArea.data.1.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markArea.data.1.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.1.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.1.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markArea.data.1.label":{desc:'<p>该数据项标签的样式,起点和终点项的<code class="codespan">label</code>会合并到一起。</p>\n'},"markArea.data.1.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markArea.data.1.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markArea.data.1.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markArea.data.1.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markArea.data.1.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markArea.data.1.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.1.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.1.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.1.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.1.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.1.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.1.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.1.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.1.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.1.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.1.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.1.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markArea.data.1.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markArea.data.1.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.1.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.1.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markArea.data.1.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markArea.data.1.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markArea.data.1.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markArea.data.1.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.1.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.1.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.1.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.1.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.1.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.1.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.1.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.1.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.1.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.1.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.1.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.1.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.1.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.1.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.1.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.emphasis.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markArea.data.1.emphasis.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markArea.data.1.emphasis.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markArea.data.1.emphasis.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markArea.data.1.emphasis.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markArea.data.1.emphasis.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markArea.data.1.emphasis.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.1.emphasis.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.1.emphasis.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markArea.data.1.emphasis.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markArea.data.1.emphasis.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markArea.data.1.emphasis.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markArea.data.1.emphasis.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markArea.data.1.emphasis.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markArea.data.1.emphasis.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.1.emphasis.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.1.emphasis.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.1.emphasis.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.1.emphasis.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.1.emphasis.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.1.emphasis.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.1.emphasis.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.1.emphasis.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.emphasis.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.emphasis.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.emphasis.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.1.emphasis.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.1.emphasis.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.1.emphasis.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.emphasis.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.emphasis.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.emphasis.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markArea.data.1.emphasis.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markArea.data.1.emphasis.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.1.emphasis.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.emphasis.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.1.emphasis.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.emphasis.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.emphasis.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.emphasis.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markArea.data.1.emphasis.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markArea.data.1.emphasis.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markArea.data.1.emphasis.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markArea.data.1.emphasis.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.1.emphasis.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.1.emphasis.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.1.emphasis.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.1.emphasis.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.1.emphasis.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.1.emphasis.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.1.emphasis.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.1.emphasis.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.emphasis.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.emphasis.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.emphasis.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.1.emphasis.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.1.emphasis.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.1.emphasis.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.emphasis.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.emphasis.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.emphasis.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.1.emphasis.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.1.emphasis.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.1.emphasis.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.emphasis.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.1.emphasis.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.emphasis.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.emphasis.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.blur":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n'},"markArea.data.1.blur.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markArea.data.1.blur.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markArea.data.1.blur.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markArea.data.1.blur.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markArea.data.1.blur.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markArea.data.1.blur.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markArea.data.1.blur.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.1.blur.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.1.blur.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markArea.data.1.blur.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markArea.data.1.blur.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markArea.data.1.blur.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markArea.data.1.blur.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markArea.data.1.blur.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markArea.data.1.blur.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.1.blur.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.1.blur.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.1.blur.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.1.blur.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.1.blur.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.1.blur.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.1.blur.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.1.blur.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.blur.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.blur.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.blur.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.1.blur.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.1.blur.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.1.blur.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.blur.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.blur.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.blur.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markArea.data.1.blur.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markArea.data.1.blur.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.1.blur.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.blur.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.1.blur.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.blur.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.blur.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.blur.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markArea.data.1.blur.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markArea.data.1.blur.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markArea.data.1.blur.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markArea.data.1.blur.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.1.blur.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.1.blur.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.1.blur.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.1.blur.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.1.blur.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.1.blur.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.1.blur.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.1.blur.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.blur.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.blur.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.blur.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.1.blur.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.1.blur.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.1.blur.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.blur.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.blur.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.blur.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.1.blur.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.1.blur.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.1.blur.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.blur.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.1.blur.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.blur.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.blur.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.animation":{desc:"\n\n<p>是否开启动画。</p>\n",uiControl:{type:"boolean",default:"false",clean:"true"}},"markArea.animationThreshold":{desc:"<p>是否开启动画的阈值,当单个系列显示的图形数量大于这个阈值时会关闭动画。</p>\n"},"markArea.animationDuration":{desc:'\n\n<p>初始动画的时长,支持回调函数,可以通过每个数据返回不同的时长实现更戏剧的初始动画效果:</p>\n<pre><code class="lang-js">animationDuration: function (idx) {\n // 越往后的数据时长越大\n return idx * 100;\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",default:"1000",step:"20",clean:"true"}},"markArea.animationEasing":{desc:'\n\n<p>初始动画的缓动效果。不同的缓动效果可以参考 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=line-easing" target="_blank">缓动示例</a>。</p>\n',uiControl:{type:"enum",options:"linear,quadraticIn,quadraticOut,quadraticInOut,cubicIn,cubicOut,cubicInOut,quarticIn,quarticOut,quarticInOut,quinticIn,quinticOut,quinticInOut,sinusoidalIn,sinusoidalOut,sinusoidalInOut,exponentialIn,exponentialOut,exponentialInOut,circularIn,circularOut,circularInOut,elasticIn,elasticOut,elasticInOut,backIn,backOut,backInOut,bounceIn,bounceOut,bounceInOut",clean:"true"}},"markArea.animationDelay":{desc:'<p>初始动画的延迟,支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的初始动画效果。</p>\n<p>如下示例:</p>\n<pre><code class="lang-js">animationDelay: function (idx) {\n // 越往后的数据延迟越大\n return idx * 100;\n}\n</code></pre>\n<p>也可以看<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-animation-delay" target="_blank">该示例</a></p>\n'},"markArea.animationDurationUpdate":{desc:'\n\n<p>数据更新动画的时长。</p>\n<p>支持回调函数,可以通过每个数据返回不同的时长实现更戏剧的更新动画效果:</p>\n<pre><code class="lang-js">animationDurationUpdate: function (idx) {\n // 越往后的数据时长越大\n return idx * 100;\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",default:"1000",step:"20"}},"markArea.animationEasingUpdate":{desc:"\n\n<p>数据更新动画的缓动效果。</p>\n",uiControl:{type:"enum",options:"linear,quadraticIn,quadraticOut,quadraticInOut,cubicIn,cubicOut,cubicInOut,quarticIn,quarticOut,quarticInOut,quinticIn,quinticOut,quinticInOut,sinusoidalIn,sinusoidalOut,sinusoidalInOut,exponentialIn,exponentialOut,exponentialInOut,circularIn,circularOut,circularInOut,elasticIn,elasticOut,elasticInOut,backIn,backOut,backInOut,bounceIn,bounceOut,bounceInOut"}},"markArea.animationDelayUpdate":{desc:'<p>数据更新动画的延迟,支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的更新动画效果。</p>\n<p>如下示例:</p>\n<pre><code class="lang-js">animationDelayUpdate: function (idx) {\n // 越往后的数据延迟越大\n return idx * 100;\n}\n</code></pre>\n<p>也可以看<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-animation-delay" target="_blank">该示例</a></p>\n'},silent:{desc:"\n\n<p>图形是否不响应和触发鼠标事件,默认为 false,即响应和触发鼠标事件。</p>\n",uiControl:{type:"boolean"}},animationType:{desc:'\n\n<p>初始动画效果,可选</p>\n<ul>\n<li><code class="codespan">'expansion'</code> 默认沿圆弧展开的效果。</li>\n<li><code class="codespan">'scale'</code> 缩放效果,配合设置 <code class="codespan">animationEasing='elasticOut'</code> 可以做成 popup 的效果。</li>\n</ul>\n',uiControl:{type:"enum",options:"expansion,scale"}},animationTypeUpdate:{desc:'\n\n\n\n<blockquote>\n<p>从 <code class="codespan">v4.4.0</code> 开始支持</p>\n</blockquote>\n<p>更新数据时的动画效果,可选:</p>\n<ul>\n<li><code class="codespan">'transition'</code> 通过改变起始和终止角度,从之前的数据过渡到新的数据。</li>\n<li><code class="codespan">'expansion'</code> 数据将整体重新沿圆弧展开。</li>\n</ul>\n',uiControl:{type:"enum",options:"expansion,transition"}},animation:{desc:"\n\n<p>是否开启动画。</p>\n",uiControl:{type:"boolean",default:"true",clean:"true"}},animationThreshold:{desc:"<p>是否开启动画的阈值,当单个系列显示的图形数量大于这个阈值时会关闭动画。</p>\n"},animationDuration:{desc:'\n\n<p>初始动画的时长,支持回调函数,可以通过每个数据返回不同的时长实现更戏剧的初始动画效果:</p>\n<pre><code class="lang-js">animationDuration: function (idx) {\n // 越往后的数据时长越大\n return idx * 100;\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",default:"1000",step:"20",clean:"true"}},animationEasing:{desc:'\n\n<p>初始动画的缓动效果。不同的缓动效果可以参考 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=line-easing" target="_blank">缓动示例</a>。</p>\n',uiControl:{type:"enum",options:"linear,quadraticIn,quadraticOut,quadraticInOut,cubicIn,cubicOut,cubicInOut,quarticIn,quarticOut,quarticInOut,quinticIn,quinticOut,quinticInOut,sinusoidalIn,sinusoidalOut,sinusoidalInOut,exponentialIn,exponentialOut,exponentialInOut,circularIn,circularOut,circularInOut,elasticIn,elasticOut,elasticInOut,backIn,backOut,backInOut,bounceIn,bounceOut,bounceInOut",clean:"true"}},animationDelay:{desc:'<p>初始动画的延迟,支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的初始动画效果。</p>\n<p>如下示例:</p>\n<pre><code class="lang-js">animationDelay: function (idx) {\n // 越往后的数据延迟越大\n return idx * 100;\n}\n</code></pre>\n<p>也可以看<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-animation-delay" target="_blank">该示例</a></p>\n'},animationDurationUpdate:{desc:'\n\n<p>数据更新动画的时长。</p>\n<p>支持回调函数,可以通过每个数据返回不同的时长实现更戏剧的更新动画效果:</p>\n<pre><code class="lang-js">animationDurationUpdate: function (idx) {\n // 越往后的数据时长越大\n return idx * 100;\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",default:"1000",step:"20"}},animationEasingUpdate:{desc:"\n\n<p>数据更新动画的缓动效果。</p>\n",uiControl:{type:"enum",options:"linear,quadraticIn,quadraticOut,quadraticInOut,cubicIn,cubicOut,cubicInOut,quarticIn,quarticOut,quarticInOut,quinticIn,quinticOut,quinticInOut,sinusoidalIn,sinusoidalOut,sinusoidalInOut,exponentialIn,exponentialOut,exponentialInOut,circularIn,circularOut,circularInOut,elasticIn,elasticOut,elasticInOut,backIn,backOut,backInOut,bounceIn,bounceOut,bounceInOut"}},animationDelayUpdate:{desc:'<p>数据更新动画的延迟,支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的更新动画效果。</p>\n<p>如下示例:</p>\n<pre><code class="lang-js">animationDelayUpdate: function (idx) {\n // 越往后的数据延迟越大\n return idx * 100;\n}\n</code></pre>\n<p>也可以看<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-animation-delay" target="_blank">该示例</a></p>\n'},tooltip:{desc:"<p>本系列特定的 tooltip 设定。</p>\n"},"tooltip.position":{desc:'<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的位置,默认不设置时位置会跟随鼠标的位置。</p>\n<p>可选:</p>\n<ul>\n<li><p><code class="codespan">Array</code></p>\n<p> 通过数组表示提示框浮层的位置,支持数字设置绝对位置,百分比设置相对位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对位置,相对于容器左侧 10px, 上侧 10 px\n position: [10, 10]\n // 相对位置,放置在容器正中间\n position: ['50%', '50%']\n</code></pre>\n</li>\n<li><p><code class="codespan">Function</code></p>\n<p> 回调函数,格式如下:</p>\n<pre><code class="lang-js"> (point: Array, params: Object|Array.<Object>, dom: HTMLDomElement, rect: Object, size: Object) => Array\n</code></pre>\n<p> <strong>参数:</strong><br>\n point: 鼠标位置,如 [20, 40]。<br>\n params: 同 formatter 的参数相同。<br>\n dom: tooltip 的 dom 对象。<br>\n rect: 只有鼠标在图形上时有效,是一个用<code class="codespan">x</code>, <code class="codespan">y</code>, <code class="codespan">width</code>, <code class="codespan">height</code>四个属性表达的图形包围盒。<br>\n size: 包括 dom 的尺寸和 echarts 容器的当前尺寸,例如:<code class="codespan">{contentSize: [width, height], viewSize: [width, height]}</code>。<br></p>\n<p> <strong>返回值:</strong><br>\n 可以是一个表示 tooltip 位置的数组,数组值可以是绝对的像素值,也可以是相 百分比。<br>\n 也可以是一个对象,如:<code class="codespan">{left: 10, top: 30}</code>,或者 <code class="codespan">{right: '20%', bottom: 40}</code>。<br></p>\n<p> 如下示例:</p>\n<pre><code class="lang-js"> position: function (point, params, dom, rect, size) {\n // 固定在顶部\n return [point[0], '10%'];\n }\n</code></pre>\n<p> 或者:</p>\n<pre><code class="lang-js"> position: function (pos, params, dom, rect, size) {\n // 鼠标在左侧时 tooltip 显示到右侧,鼠标在右侧时 tooltip 显示到左侧。\n var obj = {top: 60};\n obj[['left', 'right'][+(pos[0] < size.viewSize[0] / 2)]] = 5;\n return obj;\n }\n</code></pre>\n</li>\n</ul>\n<ul>\n<li><p><code class="codespan">'inside'</code></p>\n<p> 鼠标所在图形的内部中心位置,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'top'</code></p>\n<p> 鼠标所在图形上侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'left'</code></p>\n<p> 鼠标所在图形左侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'right'</code></p>\n<p> 鼠标所在图形右侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'bottom'</code></p>\n<p> 鼠标所在图形底侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n</ul>\n'},"tooltip.formatter":{desc:'<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层内容格式器,支持字符串模板和回调函数两种形式。</p>\n<p><strong>1, 字符串模板</strong></p>\n<p>模板变量有 <code class="codespan">{a}</code>, <code class="codespan">{b}</code>,<code class="codespan">{c}</code>,<code class="codespan">{d}</code>,<code class="codespan">{e}</code>,分别表示系列名,数据名,数据值等。\n在 <a href="#tooltip.trigger">trigger</a> 为 <code class="codespan">'axis'</code> 的时候,会有多个系列的数据,此时可以通过 <code class="codespan">{a0}</code>, <code class="codespan">{a1}</code>, <code class="codespan">{a2}</code> 这种后面加索引的方式表示系列的索引。\n不同图表类型下的 <code class="codespan">{a}</code>,<code class="codespan">{b}</code>,<code class="codespan">{c}</code>,<code class="codespan">{d}</code> 含义不一样。\n其中变量<code class="codespan">{a}</code>, <code class="codespan">{b}</code>, <code class="codespan">{c}</code>, <code class="codespan">{d}</code>在不同图表类型下代表数据含义为:</p>\n<ul>\n<li><p>折线(区域)图、柱状(条形)图、K线图 : <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(类目值),<code class="codespan">{c}</code>(数值), <code class="codespan">{d}</code>(无)</p>\n</li>\n<li><p>散点图(气泡)图 : <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(数据名称),<code class="codespan">{c}</code>(数值数组), <code class="codespan">{d}</code>(无)</p>\n</li>\n<li><p>地图 : <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(区域名称),<code class="codespan">{c}</code>(合并数值), <code class="codespan">{d}</code>(无)</p>\n</li>\n<li><p>饼图、仪表盘、漏斗图: <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(数据项名称),<code class="codespan">{c}</code>(数值), <code class="codespan">{d}</code>(百分比)</p>\n</li>\n</ul>\n<p>更多其它图表模板变量的含义可以见相应的图表的 label.formatter 配置项。</p>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b0}: {c0}<br />{b1}: {c1}'\n</code></pre>\n<p><strong>2, 回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array, ticket: string, callback: (ticket: string, html: string)) => string\n</code></pre>\n<p>第一个参数 <code class="codespan">params</code> 是 formatter 需要的数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n // 饼图的百分比\n percent: number,\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n<p>在 <a href="#tooltip.trigger">trigger</a> 为 <code class="codespan">'axis'</code> 的时候,或者 tooltip 被 <a href="#xAxis.axisPointer">axisPointer</a> 触发的时候,<code class="codespan">params</code> 是多个系列的数据数组。其中每项内容格式同上,并且,</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n<p><strong>注:</strong> ECharts 2.x 使用数组表示各参数的方式不再支持。</p>\n<p>第二个参数 <code class="codespan">ticket</code> 是异步回调标识,配合第三个参数 <code class="codespan">callback</code> 使用。\n第三个参数 <code class="codespan">callback</code> 是异步回调,在提示框浮层内容是异步获取的时候,可以通过 callback 传入上述的 <code class="codespan">ticket</code> 和 <code class="codespan">html</code> 更新提示框浮层内容。</p>\n<p>示例:</p>\n<pre><code class="lang-js">formatter: function (params, ticket, callback) {\n $.get('detail?name=' + params.name, function (content) {\n callback(ticket, toHTML(content));\n });\n return 'Loading';\n}\n</code></pre>\n'},"tooltip.backgroundColor":{desc:'<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的背景颜色。</p>\n'},"tooltip.borderColor":{desc:'\n\n\n\n\n<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的边框颜色。</p>\n',uiControl:{type:"color",default:"#333"}},"tooltip.borderWidth":{desc:'\n\n\n\n\n<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的边框宽。</p>\n',uiControl:{type:"number",default:"0",step:"0.5"}},"tooltip.padding":{desc:'\n\n\n\n\n<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n\n\n<p>提示框浮层内边距,单位px,默认各方向内边距为5,接受数组分别设定上右下左边距。</p>\n<p>使用示例:</p>\n<pre><code class="lang-js">// 设置内边距为 5\npadding: 5\n// 设置上下的内边距为 5,左右的内边距为 10\npadding: [5, 10]\n// 分别设置四个方向的内边距\npadding: [\n 5, // 上\n 10, // 右\n 5, // 下\n 10, // 左\n]\n</code></pre>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"tooltip.textStyle":{desc:'<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的文本样式。</p>\n'},"tooltip.textStyle.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"'#fff'"}},"tooltip.textStyle.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"tooltip.textStyle.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"tooltip.textStyle.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"tooltip.textStyle.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"14",min:"1",step:"1"}},"tooltip.textStyle.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"tooltip.textStyle.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"tooltip.textStyle.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"tooltip.textStyle.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"tooltip.textStyle.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"tooltip.textStyle.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"tooltip.textStyle.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"tooltip.textStyle.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"tooltip.textStyle.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"tooltip.textStyle.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"tooltip.textStyle.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"tooltip.textStyle.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"tooltip.extraCssText":{desc:'<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>额外附加到浮层的 css 样式。如下为浮层添加阴影的示例:</p>\n<pre><code class="lang-js">extraCssText: 'box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);'\n</code></pre>\n'}}),s("funnel",{id:{desc:"<p>组件 ID。默认不指定。指定则可用于在 option 或者 API 中引用组件。</p>\n"},name:{desc:'<p>系列名称,用于<a href="#tooltip">tooltip</a>的显示,<a href="#legend">legend</a> 的图例筛选,在 <code class="codespan">setOption</code> 更新数据和配置项时用于指定对应的系列。</p>\n'},min:{desc:"\n\n<p>指定的数据最小值。</p>\n",uiControl:{type:"number",default:"0",step:"1"}},max:{desc:"\n\n<p>指定的数据最大值。</p>\n",uiControl:{type:"number",default:"100",step:"1"}},minSize:{desc:'\n\n<p>数据最小值 <a href="#series-funnel.min">min</a> 映射的宽度。</p>\n<p>可以是绝对的像素大小,也可以是相对<a href="#series-funnel.width">布局宽度</a>的百分比,如果需要最小值的图形并不是尖端三角,可通过设置该属性实现。</p>\n',uiControl:{type:"percent",default:"0%"}},maxSize:{desc:'\n\n<p>数据最大值 <a href="#series-funnel.max">max</a> 映射的宽度。</p>\n<p>可以是绝对的像素大小,也可以是相对<a href="#series-funnel.width">布局宽度</a>的百分比。</p>\n',uiControl:{type:"percent",default:"100%"}},orient:{desc:'\n\n<p>漏斗图朝向,支持配置为<code class="codespan">'vertical'</code>或者<code class="codespan">'horizontal'</code>。</p>\n<blockquote>\n<p>从 <code class="codespan">v4.9.0</code> 开始支持</p>\n</blockquote>\n',uiControl:{type:"enum",options:"vertical,horizontal"}},sort:{desc:'\n\n<p>数据排序, 可以取 <code class="codespan">'ascending'</code>,<code class="codespan">'descending'</code>,<code class="codespan">'none'</code>(表示按 data 顺序),或者一个函数(即 <code class="codespan">Array.prototype.sort(function (a, b) { ... })</code>)。</p>\n',uiControl:{type:"enum",options:"none,descending,ascending",default:"descending"}},gap:{desc:"\n\n<p>数据图形间距。</p>\n",uiControl:{type:"number",default:"0",min:"0",step:"0.5"}},legendHoverLink:{desc:'\n\n<p>是否启用<a href="#legend">图例</a> hover 时的联动高亮。</p>\n',uiControl:{type:"boolean",default:"true"}},funnelAlign:{desc:"\n\n<p>水平方向对齐布局类型,默认居中对齐,可用选项还有:'left' | 'right' | 'center'</p>\n",uiControl:{type:"enum",options:"left,center,right",default:"center"}},label:{desc:"<p>漏斗图图形上的文本标签,可用于说明图形的一些数据信息,比如值,名称等。</p>\n"},"label.position":{desc:'<p>标签的位置。</p>\n<p><strong>可选:</strong></p>\n<ul>\n<li><code class="codespan">'left'</code> 漏斗图左侧,<a href="#series-funnel.orient">orient</a> 为<code class="codespan">'vertical'</code>时有效。</li>\n<li><code class="codespan">'right'</code> 漏斗图右侧,<a href="#series-funnel.orient">orient</a> 为<code class="codespan">'vertical'</code>时有效。</li>\n<li><code class="codespan">'top'</code> 漏斗图上侧,<a href="#series-funnel.orient">orient</a> 为<code class="codespan">'horizontal'</code>时有效。</li>\n<li><code class="codespan">'bottom'</code> 漏斗图下侧,<a href="#series-funnel.orient">orient</a> 为<code class="codespan">'horizontal'</code>时有效。</li>\n<li><code class="codespan">'inside'</code> 漏斗图梯形内部。</li>\n<li><code class="codespan">'insideRight'</code> 漏斗图梯形内部右侧。</li>\n<li><code class="codespan">'insideLeft'</code> 漏斗图梯形内部左侧。</li>\n<li><code class="codespan">'leftTop'</code> 漏斗图左侧上部。</li>\n<li><code class="codespan">'leftBottom'</code> 漏斗图左侧下部。</li>\n<li><code class="codespan">'rightTop'</code> 漏斗图右侧上部。</li>\n<li><code class="codespan">'rightBottom'</code> 漏斗图右侧下部。</li>\n<li><code class="codespan">'inner'</code> 同 <code class="codespan">'inside'</code>。</li>\n<li><code class="codespan">'center'</code> 同 <code class="codespan">'inside'</code>。</li>\n</ul>\n<p>在不是配置为内部的时候标签可以通过<a href="#series-funnel.labelLine">视觉引导线</a>连到相应的梯形。\n通过<a href="#series-funnel.labelLine">视觉引导线</a>连到相应的梯形。</p>\n'},"label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n // 百分比\n percent: number,\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"label.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"label.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"label.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"label.rich.<style_name>.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"label.rich.<style_name>.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"label.rich.<style_name>.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},labelLine:{desc:'<p>标签的视觉引导线样式,在 <a href="#series-funnel.label.position">label 位置</a> 设置为<code class="codespan">'left'</code>或者<code class="codespan">'right'</code>的时候会显示视觉引导线。</p>\n'},"labelLine.show":{desc:"<p>是否显示视觉引导线。</p>\n"},"labelLine.length":{desc:"<p>视觉引导线的长度。</p>\n"},"labelLine.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"labelLine.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"labelLine.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"labelLine.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"labelLine.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"labelLine.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"labelLine.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"labelLine.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},itemStyle:{desc:"<p> 图形样式。</p>\n"},"itemStyle.color":{desc:'\n\n<p>图形的颜色。 默认从全局调色盘 <a href="#color">option.color</a> 获取颜色 </p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n<p>支持使用回调函数。回调函数格式如下:</p>\n<pre><code class="lang-js">(params: Object) => Color\n</code></pre>\n<p>传入的是数据项 <code class="codespan">seriesIndex</code>, <code class="codespan">dataIndex</code>, <code class="codespan">data</code>, <code class="codespan">value</code> 等各个参数。</p>\n',uiControl:{type:"color"}},"itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"itemStyle.decal(Object | 'none')":{desc:'<p>图形的贴花图案,在 <a href="#aria.enabled">aria.enabled</a> 与 <a href="#aria.decal.show">aria.decal.show</a> 都是 <code class="codespan">true</code> 的情况下才生效。</p>\n<p>如果为 <code class="codespan">'none'</code> 表示不使用贴花图案。</p>\n'},"itemStyle.decal(Object | 'none').symbol(string|string[]) = 'rect'":{desc:'<p>贴花的图案,如果是 <code class="codespan">string[]</code> 表示循环使用数组中的图案。</p>\n<p>ECharts 提供的标记类型包括</p>\n<p><code class="codespan">'circle'</code>, <code class="codespan">'rect'</code>, <code class="codespan">'roundRect'</code>, <code class="codespan">'triangle'</code>, <code class="codespan">'diamond'</code>, <code class="codespan">'pin'</code>, <code class="codespan">'arrow'</code>, <code class="codespan">'none'</code></p>\n<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>'},"itemStyle.decal(Object | 'none').symbolSize":{desc:'<p>取值范围:<code class="codespan">0</code> 到 <code class="codespan">1</code>,表示占图案区域的百分比。</p>\n'},"itemStyle.decal(Object | 'none').symbolKeepAspect":{desc:"<p>是否保持图案的长宽比。</p>\n"},"itemStyle.decal(Object | 'none').color":{desc:"<p>贴花图案的颜色,建议使用半透明色,这样能叠加在系列本身的颜色上。</p>\n"},"itemStyle.decal(Object | 'none').backgroundColor":{desc:"<p>贴花的背景色,将会覆盖在系列本身颜色之上,贴花图案之下。</p>\n"},"itemStyle.decal(Object | 'none').dashArrayX(number | number[] | (number | number[])[]) = 5":{desc:'<p>贴花图案的基本模式是在横向和纵向上分别以<code class="codespan">图案 - 空白 - 图案 - 空白 - 图案 - 空白</code>的形式无限循环。通过设置每个图案和空白的长度,可以实现复杂的图案效果。</p>\n<p><code class="codespan">dashArrayX</code> 控制了横向的图案模式。当其值为 <code class="codespan">number</code> 或 <code class="codespan">number[]</code> 类型时,与 <a href="https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-dasharray" target="_blank">SVG stroke-dasharray</a> 类似。</p>\n<ul>\n<li><p>如果是 <code class="codespan">number</code> 类型,表示图案和空白分别是这个值。如 <code class="codespan">5</code> 表示先显示宽度为 5 的图案,然后空 5 像素,再然后显示宽度为 5 的图案……</p>\n</li>\n<li><p>如果是 <code class="codespan">number[]</code> 类型,则表示图案和空白依次为数组值的循环。如:<code class="codespan">[5, 10, 2, 6]</code> 表示图案宽 5 像素,然后空 10 像素,然后图案宽 2 像素,然后空 6 像素,然后图案宽 5 像素……</p>\n</li>\n<li><p>如果是 <code class="codespan">(number | number[])[]</code> 类型,表示每行的图案和空白依次为数组值的循环。如:<code class="codespan">[10, [2, 5]]</code> 表示第一行以图案 10 像素空 10 像素循环,第二行以图案 2 像素空 5 像素循环,第三行以图案 10 像素空 10 像素循环……</p>\n</li>\n</ul>\n<p>可以结合以下的例子理解本接口:</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/aria-decal&edit=1&reset=1" width="700" height="300"><iframe />\n\n'},"itemStyle.decal(Object | 'none').dashArrayY(number | number[]) = 5":{desc:'<p>贴花图案的基本模式是在横向和纵向上分别以<code class="codespan">图案 - 空白 - 图案 - 空白 - 图案 - 空白</code>的形式无限循环。通过设置每个图案和空白的长度,可以实现复杂的图案效果。</p>\n<p><code class="codespan">dashArrayY</code> 控制了横向的图案模式。与 <a href="https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-dasharray" target="_blank">SVG stroke-dasharray</a> 类似。</p>\n<ul>\n<li><p>如果是 <code class="codespan">number</code> 类型,表示图案和空白分别是这个值。如 <code class="codespan">5</code> 表示先显示高度为 5 的图案,然后空 5 像素,再然后显示高度为 5 的图案……</p>\n</li>\n<li><p>如果是 <code class="codespan">number[]</code> 类型,则表示图案和空白依次为数组值的循环。如:<code class="codespan">[5, 10, 2, 6]</code> 表示图案高 5 像素,然后空 10 像素,然后图案高 2 像素,然后空 6 像素,然后图案高 5 像素……</p>\n</li>\n</ul>\n<p>可以结合以下的例子理解本接口:</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/aria-decal&edit=1&reset=1" width="700" height="300"><iframe />\n\n'},"itemStyle.decal(Object | 'none').rotation":{desc:'<p>图案的整体旋转角度(弧度制),取值范围从 <code class="codespan">-Math.PI</code> 到 <code class="codespan">Math.PI</code>。</p>\n'},"itemStyle.decal(Object | 'none').maxTileWidth":{desc:"<p>生成的图案在未重复之前的宽度上限。通常不需要设置该值,当你发现图案在重复的时候出现不连续的接缝时,可以尝试提高该值。</p>\n"},"itemStyle.decal(Object | 'none').maxTileHeight":{desc:"<p>生成的图案在未重复之前的高度上限。通常不需要设置该值,当你发现图案在重复的时候出现不连续的接缝时,可以尝试提高该值。</p>\n"},labelLayout:{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>标签的统一布局配置。</p>\n<p>该配置项是在每个系列默认的标签布局基础上,统一调整标签的<code class="codespan">(x, y)</code>位置,标签对齐等属性以实现想要的标签布局效果。</p>\n<p>该配置项也可以是一个有如下参数的回调函数</p>\n<pre><code class="lang-js">// 标签对应数据的 dataIndex\ndataIndex: number\n// 标签对应的数据类型,只在关系图中会有 node 和 edge 数据类型的区分\ndataType?: string\n// 标签对应的系列的 index\nseriesIndex: number\n// 标签显示的文本\ntext: string\n// 默认的标签的包围盒,由系列默认的标签布局决定\nlabelRect: {x: number, y: number, width: number, height: number}\n// 默认的标签水平对齐\nalign: 'left' | 'center' | 'right'\n// 默认的标签垂直对齐\nverticalAlign: 'top' | 'middle' | 'bottom'\n// 标签所对应的数据图形的包围盒,可用于定位标签位置\nrect: {x: number, y: number, width: number, height: number}\n// 默认引导线的位置,目前只有饼图(pie)和漏斗图(funnel)有默认标签位置\n// 如果没有该值则为 null\nlabelLinePoints?: number[][]\n</code></pre>\n<p><strong>示例:</strong></p>\n<p>将标签显示在图形右侧 10px 的位置,并且垂直居中:</p>\n<pre><code class="lang-js">labelLayout(params) {\n return {\n x: params.rect.x + 10,\n y: params.rect.y + params.rect.height / 2,\n verticalAlign: 'middle',\n align: 'left'\n }\n}\n</code></pre>\n<p>根据图形的包围盒尺寸决定文本尺寸</p>\n<pre><code class="lang-js">\nlabelLayout(params) {\n return {\n fontSize: Math.max(params.rect.width / 10, 5)\n };\n}\n</code></pre>\n'},"labelLayout.hideOverlap":{desc:'<p>是否隐藏重叠的标签。</p>\n<p>下面示例演示了在关系图中开启该配置后,在缩放时可以实现自动的标签隐藏。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=graph-label-overlap&edit=1&reset=1" width="600" height="400"><iframe />\n\n'},"labelLayout.moveOverlap":{desc:'<p>在标签重叠的时候是否挪动标签位置以防止重叠。</p>\n<p>目前支持配置为:</p>\n<ul>\n<li><code class="codespan">'shiftX'</code> 水平方向依次位移,在水平方向对齐时使用</li>\n<li><code class="codespan">'shiftY'</code> 垂直方向依次位移,在垂直方向对齐时使用</li>\n</ul>\n<p>下面是标签右对齐并配置垂直方向依次位移以防止重叠的示例。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=scatter-label-align-right&edit=1&reset=1" width="600" height="400"><iframe />\n\n'},"labelLayout.x":{desc:'<p>标签的 x 位置。支持绝对的像素值或者<code class="codespan">'20%'</code>这样的相对值。</p>\n'},"labelLayout.y":{desc:'<p>标签的 y 位置。支持绝对的像素值或者<code class="codespan">'20%'</code>这样的相对值。</p>\n'},"labelLayout.dx":{desc:'<p>标签在 x 方向上的像素偏移。可以和<code class="codespan">x</code>一起使用。</p>\n'},"labelLayout.dy":{desc:'<p>标签在 y 方向上的像素偏移。可以和<code class="codespan">y</code>一起使用</p>\n'},"labelLayout.rotate":{desc:"<p>标签旋转角度。</p>\n"},"labelLayout.width":{desc:'<p>标签显示的宽度。可以配合<code class="codespan">overflow</code>使用控制标签显示在固定宽度内</p>\n'},"labelLayout.height":{desc:'<p>标签显示的高度。可以配合<code class="codespan">lineOverflow</code>使用控制标签显示在固定高度内</p>\n'},"labelLayout.align":{desc:'<p>标签水平对齐方式。可以设置<code class="codespan">'left'</code>, <code class="codespan">'center'</code>, <code class="codespan">'right'</code>。</p>\n'},"labelLayout.verticalAlign":{desc:'<p>标签垂直对齐方式。可以设置<code class="codespan">'top'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'bottom'</code>。</p>\n'},"labelLayout.fontSize":{desc:"<p>The text size of the label.</p>\n"},"labelLayout.draggable":{desc:"<p>标签是否可以允许用户通过拖拽二次调整位置。</p>\n"},"labelLayout.labelLinePoints":{desc:'<p>标签引导线三个点的位置。格式为:</p>\n<pre><code class="lang-js">[[x, y], [x, y], [x, y]]\n</code></pre>\n<p>在饼图中常用来微调已经计算好的引导线,其它情况一般不建议设置。</p>\n'},emphasis:{desc:"<p>高亮的标签和图形样式。</p>\n"},"emphasis.focus":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>在高亮图形时,是否淡出其它数据的图形已达到聚焦的效果。支持如下配置:</p>\n<ul>\n<li><code class="codespan">'none'</code> 不淡出其它图形,默认使用该配置。</li>\n<li><code class="codespan">'self'</code> 只聚焦(不淡出)当前高亮的数据的图形。</li>\n<li><code class="codespan">'series'</code> 聚焦当前高亮的数据所在的系列的所有图形。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<p>下面代码配置了柱状图在高亮一个图形的时候,淡出当前直角坐标系所有其它的系列。</p>\n<pre><code class="lang-js">emphasis: {\n focus: 'series',\n blurScope: 'coordinateSystem'\n}\n</code></pre>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-y-category-stack&reset=1&edit=1" width="600" height="400"><iframe />\n\n'},"emphasis.blurScope":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>在开启<code class="codespan">focus</code>的时候,可以通过<code class="codespan">blurScope</code>配置淡出的范围。支持如下配置</p>\n<ul>\n<li><code class="codespan">'coordinateSystem'</code> 淡出范围为坐标系,默认使用该配置。</li>\n<li><code class="codespan">'series'</code> 淡出范围为系列。</li>\n<li><code class="codespan">'global'</code> 淡出范围为全局。</li>\n</ul>\n'},"emphasis.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n // 百分比\n percent: number,\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"emphasis.label.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"emphasis.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"emphasis.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"emphasis.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"emphasis.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"emphasis.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"emphasis.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"emphasis.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"emphasis.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"emphasis.label.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"emphasis.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"emphasis.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"emphasis.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"emphasis.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"emphasis.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"emphasis.label.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"emphasis.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"emphasis.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"emphasis.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"emphasis.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"emphasis.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"emphasis.label.rich.<style_name>.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"emphasis.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"emphasis.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"emphasis.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"emphasis.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"emphasis.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"emphasis.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"emphasis.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"emphasis.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"emphasis.label.rich.<style_name>.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"emphasis.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"emphasis.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"emphasis.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"emphasis.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"emphasis.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"emphasis.label.rich.<style_name>.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"emphasis.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"emphasis.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.labelLine.show":{desc:"<p>是否显示视觉引导线。</p>\n"},"emphasis.labelLine.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"emphasis.labelLine.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"emphasis.labelLine.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"emphasis.labelLine.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"emphasis.labelLine.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"emphasis.labelLine.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"emphasis.labelLine.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"emphasis.labelLine.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"emphasis.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"emphasis.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"emphasis.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"emphasis.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"emphasis.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"emphasis.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"emphasis.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"emphasis.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"emphasis.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},blur:{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>淡出时的图形样式和标签样式。开启 <a href="#series-funnel.emphasis.focus">emphasis.focus</a> 后有效</p>\n'},"blur.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n // 百分比\n percent: number,\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"blur.label.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"blur.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"blur.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"blur.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"blur.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"blur.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"blur.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"blur.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"blur.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"blur.label.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"blur.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"blur.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"blur.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"blur.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"blur.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"blur.label.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"blur.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"blur.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"blur.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"blur.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"blur.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"blur.label.rich.<style_name>.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"blur.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"blur.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"blur.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"blur.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"blur.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"blur.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"blur.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"blur.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"blur.label.rich.<style_name>.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"blur.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"blur.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"blur.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"blur.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"blur.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"blur.label.rich.<style_name>.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"blur.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"blur.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.labelLine.show":{desc:"<p>是否显示视觉引导线。</p>\n"},"blur.labelLine.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"blur.labelLine.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"blur.labelLine.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"blur.labelLine.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"blur.labelLine.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"blur.labelLine.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"blur.labelLine.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"blur.labelLine.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"blur.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"blur.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"blur.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"blur.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"blur.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"blur.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"blur.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"blur.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"blur.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},select:{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>数据选中时的图形样式和标签样式。开启 <a href="#series-funnel.selectedMode">selectedMode</a> 后有效。</p>\n'},"select.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n // 百分比\n percent: number,\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"select.label.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"select.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"select.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"select.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"select.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"select.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"select.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"select.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"select.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"select.label.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"select.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"select.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"select.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"select.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"select.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"select.label.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"select.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"select.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"select.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"select.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"select.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"select.label.rich.<style_name>.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"select.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"select.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"select.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"select.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"select.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"select.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"select.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"select.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"select.label.rich.<style_name>.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"select.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"select.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"select.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"select.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"select.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"select.label.rich.<style_name>.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"select.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"select.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.labelLine.show":{desc:"<p>是否显示视觉引导线。</p>\n"},"select.labelLine.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"select.labelLine.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"select.labelLine.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"select.labelLine.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"select.labelLine.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"select.labelLine.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"select.labelLine.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"select.labelLine.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"select.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"select.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"select.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"select.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"select.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"select.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"select.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"select.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"select.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},selectedMode:{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n\n\n<p>选中模式的配置,表示是否支持多个选中,默认关闭,支持布尔值和字符串,字符串取值可选<code class="codespan">'single'</code>,<code class="codespan">'multiple'</code>,分别表示单选还是多选。</p>\n',uiControl:{type:"enum",options:"false,true,single,multiple"}},zlevel:{desc:'<p>所有图形的 zlevel 值。</p>\n<p><code class="codespan">zlevel</code>用于 Canvas 分层,不同<code class="codespan">zlevel</code>值的图形会放置在不同的 Canvas 中,Canvas 分层是一种常见的优化手段。我们可以把一些图形变化频繁(例如有动画)的组件设置成一个单独的<code class="codespan">zlevel</code>。需要注意的是过多的 Canvas 会引起内存开销的增大,在手机端上需要谨慎使用以防崩溃。</p>\n<p><code class="codespan">zlevel</code> 大的 Canvas 会放在 <code class="codespan">zlevel</code> 小的 Canvas 的上面。</p>\n'},z:{desc:'<p>组件的所有图形的<code class="codespan">z</code>值。控制图形的前后顺序。<code class="codespan">z</code>值小的图形会被<code class="codespan">z</code>值大的图形覆盖。</p>\n<p><code class="codespan">z</code>相比<code class="codespan">zlevel</code>优先级更低,而且不会创建新的 Canvas。</p>\n'},left:{desc:'\n\n<p>漏斗图组件离容器左侧的距离。</p>\n<p><code class="codespan">left</code> 的值可以是像 <code class="codespan">20</code> 这样的具体像素值,可以是像 <code class="codespan">'20%'</code> 这样相对于容器高宽的百分比,也可以是 <code class="codespan">'left'</code>, <code class="codespan">'center'</code>, <code class="codespan">'right'</code>。</p>\n<p>如果 <code class="codespan">left</code> 的值为<code class="codespan">'left'</code>, <code class="codespan">'center'</code>, <code class="codespan">'right'</code>,组件会根据相应的位置自动对齐。</p>\n',uiControl:{type:"percent",default:"0%"}},top:{desc:'\n\n<p>漏斗图组件离容器上侧的距离。</p>\n<p><code class="codespan">top</code> 的值可以是像 <code class="codespan">20</code> 这样的具体像素值,可以是像 <code class="codespan">'20%'</code> 这样相对于容器高宽的百分比,也可以是 <code class="codespan">'top'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'bottom'</code>。</p>\n<p>如果 <code class="codespan">top</code> 的值为<code class="codespan">'top'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'bottom'</code>,组件会根据相应的位置自动对齐。</p>\n',uiControl:{type:"percent",default:"0%"}},right:{desc:'\n\n<p>漏斗图组件离容器右侧的距离。</p>\n<p><code class="codespan">right</code> 的值可以是像 <code class="codespan">20</code> 这样的具体像素值,可以是像 <code class="codespan">'20%'</code> 这样相对于容器高宽的百分比。</p>\n',uiControl:{type:"percent",default:"0%"}},bottom:{desc:'\n\n<p>漏斗图组件离容器下侧的距离。</p>\n<p>bottom 的值可以是像 <code class="codespan">20</code> 这样的具体像素值,可以是像 <code class="codespan">'20%'</code> 这样相对于容器高宽的百分比。</p>\n',uiControl:{type:"percent",default:"0%"}},width:{desc:"\n\n<p>漏斗图组件的宽度。默认自适应。</p>\n",uiControl:{type:"percent",default:"50%"}},height:{desc:"\n\n<p>漏斗图组件的高度。默认自适应。</p>\n",uiControl:{type:"percent",default:"50%"}},seriesLayoutBy:{desc:'<p>当使用 <a href="#dataset">dataset</a> 时,<code class="codespan">seriesLayoutBy</code> 指定了 <code class="codespan">dataset</code> 中用行还是列对应到系列上,也就是说,系列“排布”到 <code class="codespan">dataset</code> 的行还是列上。可取值:</p>\n<ul>\n<li>'column':默认,<code class="codespan">dataset</code> 的列对应于系列,从而 <code class="codespan">dataset</code> 中每一列是一个维度(dimension)。</li>\n<li>'row':<code class="codespan">dataset</code> 的行对应于系列,从而 <code class="codespan">dataset</code> 中每一行是一个维度(dimension)。</li>\n</ul>\n<p>参见这个 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=dataset-series-layout-by&theme=lite" target="_blank">示例</a></p>\n'},datasetIndex:{desc:'<p>如果 <a href="#series.data">series.data</a> 没有指定,并且 <a href="#dataset">dataset</a> 存在,那么就会使用 <a href="#dataset">dataset</a>。<code class="codespan">datasetIndex</code> 指定本系列使用那个 <a href="#dataset">dataset</a>。</p>\n'},dimensions:{desc:'<p>使用 dimensions 定义 <code class="codespan">series.data</code> 或者 <code class="codespan">dataset.source</code> 的每个维度的信息。</p>\n<p>注意:如果使用了 <a href="#dataset">dataset</a>,那么可以在 <a href="#dataset.dimensions">dataset.dimensions</a> 中定义 dimension ,或者在 <a href="#dataset.source">dataset.source</a> 的第一行/列中给出 dimension 名称。于是就不用在这里指定 dimension。但如果在这里指定了 <code class="codespan">dimensions</code>,那么优先使用这里的。</p>\n<p>例如:</p>\n<pre><code class="lang-js">option = {\n dataset: {\n source: [\n // 有了上面 dimensions 定义后,下面这五个维度的名称分别为:\n // 'date', 'open', 'close', 'highest', 'lowest'\n [12, 44, 55, 66, 2],\n [23, 6, 16, 23, 1],\n ...\n ]\n },\n series: {\n type: 'xxx',\n // 定义了每个维度的名称。这个名称会被显示到默认的 tooltip 中。\n dimensions: ['date', 'open', 'close', 'highest', 'lowest']\n }\n}\n</code></pre>\n<pre><code class="lang-js">series: {\n type: 'xxx',\n dimensions: [\n null, // 如果此维度不想给出定义,则使用 null 即可\n {type: 'ordinal'}, // 只定义此维度的类型。\n // 'ordinal' 表示离散型,一般文本使用这种类型。\n // 如果类型没有被定义,会自动猜测类型。\n {name: 'good', type: 'number'},\n 'bad' // 等同于 {name: 'bad'}\n ]\n}\n</code></pre>\n<p><code class="codespan">dimensions</code> 数组中的每一项可以是:</p>\n<ul>\n<li><code class="codespan">string</code>,如 <code class="codespan">'someName'</code>,等同于 <code class="codespan">{name: 'someName'}</code></li>\n<li><code class="codespan">Object</code>,属性可以有:<ul>\n<li>name: <code class="codespan">string</code>。</li>\n<li>type: <code class="codespan">string</code>,支持<ul>\n<li><code class="codespan">number</code>,默认,表示普通数据。</li>\n<li><code class="codespan">ordinal</code>,对于类目、文本这些 string 类型的数据,如果需要能在数轴上使用,须是 'ordinal' 类型。ECharts 默认会自动判断这个类型。但是自动判断也是不可能很完备的,所以使用者也可以手动强制指定。</li>\n<li><code class="codespan">float</code>,即 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Float64Array" target="_blank">Float64Array</a>。</li>\n<li><code class="codespan">int</code>,即 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Int32Array" target="_blank">Int32Array</a>。</li>\n<li><code class="codespan">time</code>,表示时间类型。设置成 'time' 则能支持自动解析数据成时间戳(timestamp),比如该维度的数据是 '2017-05-10',会自动被解析。时间类型的支持参见 <a href="#series.data">data</a>。</li>\n</ul>\n</li>\n<li>displayName: 一般用于 tooltip 中维度名的展示。<code class="codespan">string</code> 如果没有指定,默认使用 name 来展示。</li>\n</ul>\n</li>\n</ul>\n<p>值得一提的是,当定义了 <code class="codespan">dimensions</code> 后,默认 <code class="codespan">tooltip</code> 中对个维度的显示,会变为『竖排』,从而方便显示每个维度的名称。如果没有定义 <code class="codespan">dimensions</code>,则默认 <code class="codespan">tooltip</code> 会横排显示,且只显示数值没有维度名称可显示。</p>\n'},encode:{desc:'<p>可以定义 <code class="codespan">data</code> 的哪个维度被编码成什么。比如:</p>\n<pre><code class="lang-js">option = {\n dataset: {\n source: [\n // 每一列称为一个『维度』。\n // 这里分别是维度 0、1、2、3、4。\n [12, 44, 55, 66, 2],\n [23, 6, 16, 23, 1],\n ...\n ]\n },\n series: {\n type: 'xxx',\n encode: {\n x: [3, 1, 5], // 表示维度 3、1、5 映射到 x 轴。\n y: 2, // 表示维度 2 映射到 y 轴。\n tooltip: [3, 2, 4] // 表示维度 3、2、4 会在 tooltip 中显示。\n }\n }\n}\n</code></pre>\n<p>当使用 <a href="#series.dimensions">dimensions</a> 给维度定义名称后,<code class="codespan">encode</code> 中可直接引用名称,例如:</p>\n<pre><code class="lang-js">series: {\n type: 'xxx',\n dimensions: ['date', 'open', 'close', 'highest', 'lowest'],\n encode: {\n x: 'date',\n y: ['open', 'close', 'highest', 'lowest']\n }\n}\n</code></pre>\n<p><code class="codespan">encode</code> 声明的基本结构如下,其中冒号左边是坐标系、标签等特定名称,如 <code class="codespan">'x'</code>, <code class="codespan">'y'</code>, <code class="codespan">'tooltip'</code> 等,冒号右边是数据中的维度名(string 格式)或者维度的序号(number 格式,从 0 开始计数),可以指定一个或多个维度(使用数组)。通常情况下,下面各种信息不需要所有的都写,按需写即可。</p>\n<p>下面是 encode 支持的属性:</p>\n<pre><code class="lang-js">// 在任何坐标系和系列中,都支持:\nencode: {\n // 使用 “名为 product 的维度” 和 “名为 score 的维度” 的值在 tooltip 中显示\n tooltip: ['product', 'score']\n // 使用 “维度 1” 和 “维度 3” 的维度名连起来作为系列名。(有时候名字比较长,这可以避免在 series.name 重复输入这些名字)\n seriesName: [1, 3],\n // 表示使用 “维度2” 中的值作为 id。这在使用 setOption 动态更新数据时有用处,可以使新老数据用 id 对应起来,从而能够产生合适的数据更新动画。\n itemId: 2,\n // 指定数据项的名称使用 “维度3” 在饼图等图表中有用,可以使这个名字显示在图例(legend)中。\n itemName: 3\n}\n\n// 直角坐标系(grid/cartesian)特有的属性:\nencode: {\n // 把 “维度1”、“维度5”、“名为 score 的维度” 映射到 X 轴:\n x: [1, 5, 'score'],\n // 把“维度0”映射到 Y 轴。\n y: 0\n}\n\n// 单轴(singleAxis)特有的属性:\nencode: {\n single: 3\n}\n\n// 极坐标系(polar)特有的属性:\nencode: {\n radius: 3,\n angle: 2\n}\n\n// 地理坐标系(geo)特有的属性:\nencode: {\n lng: 3,\n lat: 2\n}\n\n// 对于一些没有坐标系的图表,例如饼图、漏斗图等,可以是:\nencode: {\n value: 3\n}\n</code></pre>\n<p>这是个更丰富的 <code class="codespan">encode</code> 的<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=dataset-encode1&edit=1&reset=1" target="_blank">示例</a>:</p>\n<p>特殊地,在 <a href="#series-custom">自定义系列(custom series)</a> 中,<code class="codespan">encode</code> 中轴可以不指定或设置为 <code class="codespan">null/undefined</code>,从而使系列免于受这个轴控制,也就是说,轴的范围(extent)不会受此系列数值的影响,轴被 <a href="#dataZoom">dataZoom</a> 控制时也不会过滤掉这个系列:</p>\n<pre><code class="lang-js">var option = {\n xAxis: {},\n yAxis: {},\n dataZoom: [{\n xAxisIndex: 0\n }, {\n yAxisIndex: 0\n }],\n series: {\n type: 'custom',\n renderItem: function (params, api) {\n return {\n type: 'circle',\n shape: {\n cx: 100, // x 位置永远为 100\n cy: api.coord([0, api.value(0)])[1],\n r: 30\n },\n style: {\n fill: 'blue'\n }\n };\n },\n encode: {\n // 这样这个系列就不会被 x 轴以及 x\n // 轴上的 dataZoom 控制了。\n x: -1,\n y: 1\n },\n data: [ ... ]\n }\n};\n</code></pre>\n'},data:{desc:'<p>系列中的数据内容数组。数组项可以为单个数值,如:</p>\n<pre><code class="lang-js">[12, 34, 56, 10, 23]\n</code></pre>\n<p>如果需要在数据中加入其它维度给 <a href="#visualMap">visualMap</a> 组件用来映射到颜色等其它图形属性。每个数据项也可以是数组,如:</p>\n<pre><code class="lang-js">[[12, 14], [34, 50], [56, 30], [10, 15], [23, 10]]\n</code></pre>\n<p>这时候可以将每项数组中的第二个值指定给 <a href="#visualMap">visualMap</a> 组件。</p>\n<p>更多时候我们需要指定每个数据项的名称,这时候需要每个项为一个对象:</p>\n<pre><code class="lang-js">[{\n // 数据项的名称\n name: '数据1',\n // 数据项值8\n value: 10\n}, {\n name: '数据2',\n value: 20\n}]\n</code></pre>\n<p>需要对个别内容指定进行个性化定义时:</p>\n<pre><code class="lang-js">[{\n name: '数据1',\n value: 10\n}, {\n // 数据项名称\n name: '数据2',\n value : 56,\n //自定义特殊 tooltip,仅对该数据项有效\n tooltip:{},\n //自定义特殊itemStyle,仅对该item有效\n itemStyle:{}\n}]\n</code></pre>\n'},"data.name":{desc:"<p>数据项名称。</p>\n"},"data.value":{desc:"<p>数据值。</p>\n"},"data.itemStyle":{desc:"<p> 图形样式。</p>\n"},"data.itemStyle.height":{desc:'<p>该数据项的高度。默认平均分配高度,如果需要修改,可以将其设为百分比(如:<code class="codespan">'10%'</code>)或像素值(如:<code class="codespan">20px</code>)。需要注意总和应为 100%。</p>\n'},"data.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"data.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"data.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"data.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"data.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"data.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"data.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"data.itemStyle.decal(Object | 'none')":{desc:'<p>图形的贴花图案,在 <a href="#aria.enabled">aria.enabled</a> 与 <a href="#aria.decal.show">aria.decal.show</a> 都是 <code class="codespan">true</code> 的情况下才生效。</p>\n<p>如果为 <code class="codespan">'none'</code> 表示不使用贴花图案。</p>\n'},"data.itemStyle.decal(Object | 'none').symbol(string|string[]) = 'rect'":{desc:'<p>贴花的图案,如果是 <code class="codespan">string[]</code> 表示循环使用数组中的图案。</p>\n<p>ECharts 提供的标记类型包括</p>\n<p><code class="codespan">'circle'</code>, <code class="codespan">'rect'</code>, <code class="codespan">'roundRect'</code>, <code class="codespan">'triangle'</code>, <code class="codespan">'diamond'</code>, <code class="codespan">'pin'</code>, <code class="codespan">'arrow'</code>, <code class="codespan">'none'</code></p>\n<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>'},"data.itemStyle.decal(Object | 'none').symbolSize":{desc:'<p>取值范围:<code class="codespan">0</code> 到 <code class="codespan">1</code>,表示占图案区域的百分比。</p>\n'},"data.itemStyle.decal(Object | 'none').symbolKeepAspect":{desc:"<p>是否保持图案的长宽比。</p>\n"},"data.itemStyle.decal(Object | 'none').color":{desc:"<p>贴花图案的颜色,建议使用半透明色,这样能叠加在系列本身的颜色上。</p>\n"},"data.itemStyle.decal(Object | 'none').backgroundColor":{desc:"<p>贴花的背景色,将会覆盖在系列本身颜色之上,贴花图案之下。</p>\n"},"data.itemStyle.decal(Object | 'none').dashArrayX(number | number[] | (number | number[])[]) = 5":{desc:'<p>贴花图案的基本模式是在横向和纵向上分别以<code class="codespan">图案 - 空白 - 图案 - 空白 - 图案 - 空白</code>的形式无限循环。通过设置每个图案和空白的长度,可以实现复杂的图案效果。</p>\n<p><code class="codespan">dashArrayX</code> 控制了横向的图案模式。当其值为 <code class="codespan">number</code> 或 <code class="codespan">number[]</code> 类型时,与 <a href="https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-dasharray" target="_blank">SVG stroke-dasharray</a> 类似。</p>\n<ul>\n<li><p>如果是 <code class="codespan">number</code> 类型,表示图案和空白分别是这个值。如 <code class="codespan">5</code> 表示先显示宽度为 5 的图案,然后空 5 像素,再然后显示宽度为 5 的图案……</p>\n</li>\n<li><p>如果是 <code class="codespan">number[]</code> 类型,则表示图案和空白依次为数组值的循环。如:<code class="codespan">[5, 10, 2, 6]</code> 表示图案宽 5 像素,然后空 10 像素,然后图案宽 2 像素,然后空 6 像素,然后图案宽 5 像素……</p>\n</li>\n<li><p>如果是 <code class="codespan">(number | number[])[]</code> 类型,表示每行的图案和空白依次为数组值的循环。如:<code class="codespan">[10, [2, 5]]</code> 表示第一行以图案 10 像素空 10 像素循环,第二行以图案 2 像素空 5 像素循环,第三行以图案 10 像素空 10 像素循环……</p>\n</li>\n</ul>\n<p>可以结合以下的例子理解本接口:</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/aria-decal&edit=1&reset=1" width="700" height="300"><iframe />\n\n'},"data.itemStyle.decal(Object | 'none').dashArrayY(number | number[]) = 5":{desc:'<p>贴花图案的基本模式是在横向和纵向上分别以<code class="codespan">图案 - 空白 - 图案 - 空白 - 图案 - 空白</code>的形式无限循环。通过设置每个图案和空白的长度,可以实现复杂的图案效果。</p>\n<p><code class="codespan">dashArrayY</code> 控制了横向的图案模式。与 <a href="https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-dasharray" target="_blank">SVG stroke-dasharray</a> 类似。</p>\n<ul>\n<li><p>如果是 <code class="codespan">number</code> 类型,表示图案和空白分别是这个值。如 <code class="codespan">5</code> 表示先显示高度为 5 的图案,然后空 5 像素,再然后显示高度为 5 的图案……</p>\n</li>\n<li><p>如果是 <code class="codespan">number[]</code> 类型,则表示图案和空白依次为数组值的循环。如:<code class="codespan">[5, 10, 2, 6]</code> 表示图案高 5 像素,然后空 10 像素,然后图案高 2 像素,然后空 6 像素,然后图案高 5 像素……</p>\n</li>\n</ul>\n<p>可以结合以下的例子理解本接口:</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/aria-decal&edit=1&reset=1" width="700" height="300"><iframe />\n\n'},"data.itemStyle.decal(Object | 'none').rotation":{desc:'<p>图案的整体旋转角度(弧度制),取值范围从 <code class="codespan">-Math.PI</code> 到 <code class="codespan">Math.PI</code>。</p>\n'},"data.itemStyle.decal(Object | 'none').maxTileWidth":{desc:"<p>生成的图案在未重复之前的宽度上限。通常不需要设置该值,当你发现图案在重复的时候出现不连续的接缝时,可以尝试提高该值。</p>\n"},"data.itemStyle.decal(Object | 'none').maxTileHeight":{desc:"<p>生成的图案在未重复之前的高度上限。通常不需要设置该值,当你发现图案在重复的时候出现不连续的接缝时,可以尝试提高该值。</p>\n"},"data.label":{desc:"<p>单个数据的标签配置。</p>\n"},"data.label.position":{desc:'<p>标签的位置。</p>\n<p><strong>可选:</strong></p>\n<ul>\n<li><code class="codespan">'left'</code> 漏斗图左侧,<a href="#series-funnel.orient">orient</a> 为<code class="codespan">'vertical'</code>时有效。</li>\n<li><code class="codespan">'right'</code> 漏斗图右侧,<a href="#series-funnel.orient">orient</a> 为<code class="codespan">'vertical'</code>时有效。</li>\n<li><code class="codespan">'top'</code> 漏斗图上侧,<a href="#series-funnel.orient">orient</a> 为<code class="codespan">'horizontal'</code>时有效。</li>\n<li><code class="codespan">'bottom'</code> 漏斗图下侧,<a href="#series-funnel.orient">orient</a> 为<code class="codespan">'horizontal'</code>时有效。</li>\n<li><code class="codespan">'inside'</code> 漏斗图梯形内部。</li>\n<li><code class="codespan">'insideRight'</code> 漏斗图梯形内部右侧。</li>\n<li><code class="codespan">'insideLeft'</code> 漏斗图梯形内部左侧。</li>\n<li><code class="codespan">'leftTop'</code> 漏斗图左侧上部。</li>\n<li><code class="codespan">'leftBottom'</code> 漏斗图左侧下部。</li>\n<li><code class="codespan">'rightTop'</code> 漏斗图右侧上部。</li>\n<li><code class="codespan">'rightBottom'</code> 漏斗图右侧下部。</li>\n<li><code class="codespan">'inner'</code> 同 <code class="codespan">'inside'</code>。</li>\n<li><code class="codespan">'center'</code> 同 <code class="codespan">'inside'</code>。</li>\n</ul>\n<p>在不是配置为内部的时候标签可以通过<a href="#series-funnel.labelLine">视觉引导线</a>连到相应的梯形。\n通过<a href="#series-funnel.labelLine">视觉引导线</a>连到相应的梯形。</p>\n'},"data.label.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"data.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.label.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"data.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"data.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"data.label.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"data.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"data.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"data.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"data.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"data.label.rich.<style_name>.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"data.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.label.rich.<style_name>.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"data.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.label.rich.<style_name>.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"data.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.labelLine.show":{desc:"<p>是否显示视觉引导线。</p>\n"},"data.labelLine.length":{desc:"<p>视觉引导线的长度。</p>\n"},"data.labelLine.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"data.labelLine.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"data.labelLine.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"data.labelLine.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"data.labelLine.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"data.labelLine.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.labelLine.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.labelLine.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"data.emphasis.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n // 百分比\n percent: number,\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"data.emphasis.label.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"data.emphasis.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.emphasis.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.emphasis.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.emphasis.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.emphasis.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.emphasis.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.emphasis.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.emphasis.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.emphasis.label.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"data.emphasis.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.emphasis.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.emphasis.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.emphasis.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.emphasis.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.emphasis.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.emphasis.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.emphasis.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"data.emphasis.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"data.emphasis.label.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"data.emphasis.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.emphasis.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.emphasis.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.emphasis.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.emphasis.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.emphasis.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"data.emphasis.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"data.emphasis.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"data.emphasis.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"data.emphasis.label.rich.<style_name>.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"data.emphasis.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.emphasis.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.emphasis.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.emphasis.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.emphasis.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.emphasis.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.emphasis.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.emphasis.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.emphasis.label.rich.<style_name>.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"data.emphasis.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.emphasis.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.emphasis.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.emphasis.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.emphasis.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.emphasis.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.emphasis.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.emphasis.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.emphasis.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.emphasis.label.rich.<style_name>.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"data.emphasis.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.emphasis.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.emphasis.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.emphasis.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.emphasis.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.emphasis.labelLine.show":{desc:"<p>是否显示视觉引导线。</p>\n"},"data.emphasis.labelLine.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"data.emphasis.labelLine.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"data.emphasis.labelLine.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"data.emphasis.labelLine.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"data.emphasis.labelLine.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"data.emphasis.labelLine.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.emphasis.labelLine.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.emphasis.labelLine.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"data.emphasis.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"data.emphasis.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"data.emphasis.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"data.emphasis.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"data.emphasis.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"data.emphasis.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"data.emphasis.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.emphasis.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.emphasis.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"data.blur":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n'},"data.blur.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n // 百分比\n percent: number,\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"data.blur.label.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"data.blur.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.blur.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.blur.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.blur.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.blur.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.blur.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.blur.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.blur.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.blur.label.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"data.blur.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.blur.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.blur.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.blur.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.blur.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.blur.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.blur.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.blur.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"data.blur.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"data.blur.label.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"data.blur.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.blur.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.blur.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.blur.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.blur.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.blur.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"data.blur.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"data.blur.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"data.blur.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"data.blur.label.rich.<style_name>.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"data.blur.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.blur.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.blur.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.blur.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.blur.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.blur.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.blur.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.blur.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.blur.label.rich.<style_name>.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"data.blur.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.blur.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.blur.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.blur.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.blur.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.blur.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.blur.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.blur.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.blur.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.blur.label.rich.<style_name>.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"data.blur.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.blur.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.blur.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.blur.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.blur.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.blur.labelLine.show":{desc:"<p>是否显示视觉引导线。</p>\n"},"data.blur.labelLine.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"data.blur.labelLine.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"data.blur.labelLine.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"data.blur.labelLine.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"data.blur.labelLine.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"data.blur.labelLine.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.blur.labelLine.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.blur.labelLine.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"data.blur.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"data.blur.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"data.blur.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"data.blur.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"data.blur.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"data.blur.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"data.blur.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.blur.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.blur.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"data.select":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n'},"data.select.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n // 百分比\n percent: number,\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"data.select.label.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"data.select.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.select.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.select.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.select.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.select.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.select.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.select.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.select.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.select.label.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"data.select.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.select.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.select.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.select.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.select.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.select.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.select.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.select.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"data.select.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"data.select.label.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"data.select.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.select.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.select.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.select.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.select.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.select.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"data.select.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"data.select.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"data.select.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"data.select.label.rich.<style_name>.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"data.select.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.select.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.select.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.select.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.select.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.select.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.select.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.select.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.select.label.rich.<style_name>.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"data.select.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.select.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.select.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.select.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.select.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.select.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.select.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.select.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.select.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.select.label.rich.<style_name>.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"data.select.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.select.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.select.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.select.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.select.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.select.labelLine.show":{desc:"<p>是否显示视觉引导线。</p>\n"},"data.select.labelLine.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"data.select.labelLine.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"data.select.labelLine.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"data.select.labelLine.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"data.select.labelLine.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"data.select.labelLine.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.select.labelLine.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.select.labelLine.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"data.select.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"data.select.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"data.select.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"data.select.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"data.select.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"data.select.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"data.select.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.select.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.select.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"data.tooltip":{desc:"<p>本系列每个数据项中特定的 tooltip 设定。</p>\n"},"data.tooltip.position":{desc:'<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.data.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的位置,默认不设置时位置会跟随鼠标的位置。</p>\n<p>可选:</p>\n<ul>\n<li><p><code class="codespan">Array</code></p>\n<p> 通过数组表示提示框浮层的位置,支持数字设置绝对位置,百分比设置相对位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对位置,相对于容器左侧 10px, 上侧 10 px\n position: [10, 10]\n // 相对位置,放置在容器正中间\n position: ['50%', '50%']\n</code></pre>\n</li>\n<li><p><code class="codespan">Function</code></p>\n<p> 回调函数,格式如下:</p>\n<pre><code class="lang-js"> (point: Array, params: Object|Array.<Object>, dom: HTMLDomElement, rect: Object, size: Object) => Array\n</code></pre>\n<p> <strong>参数:</strong><br>\n point: 鼠标位置,如 [20, 40]。<br>\n params: 同 formatter 的参数相同。<br>\n dom: tooltip 的 dom 对象。<br>\n rect: 只有鼠标在图形上时有效,是一个用<code class="codespan">x</code>, <code class="codespan">y</code>, <code class="codespan">width</code>, <code class="codespan">height</code>四个属性表达的图形包围盒。<br>\n size: 包括 dom 的尺寸和 echarts 容器的当前尺寸,例如:<code class="codespan">{contentSize: [width, height], viewSize: [width, height]}</code>。<br></p>\n<p> <strong>返回值:</strong><br>\n 可以是一个表示 tooltip 位置的数组,数组值可以是绝对的像素值,也可以是相 百分比。<br>\n 也可以是一个对象,如:<code class="codespan">{left: 10, top: 30}</code>,或者 <code class="codespan">{right: '20%', bottom: 40}</code>。<br></p>\n<p> 如下示例:</p>\n<pre><code class="lang-js"> position: function (point, params, dom, rect, size) {\n // 固定在顶部\n return [point[0], '10%'];\n }\n</code></pre>\n<p> 或者:</p>\n<pre><code class="lang-js"> position: function (pos, params, dom, rect, size) {\n // 鼠标在左侧时 tooltip 显示到右侧,鼠标在右侧时 tooltip 显示到左侧。\n var obj = {top: 60};\n obj[['left', 'right'][+(pos[0] < size.viewSize[0] / 2)]] = 5;\n return obj;\n }\n</code></pre>\n</li>\n</ul>\n<ul>\n<li><p><code class="codespan">'inside'</code></p>\n<p> 鼠标所在图形的内部中心位置,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'top'</code></p>\n<p> 鼠标所在图形上侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'left'</code></p>\n<p> 鼠标所在图形左侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'right'</code></p>\n<p> 鼠标所在图形右侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'bottom'</code></p>\n<p> 鼠标所在图形底侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n</ul>\n'},"data.tooltip.formatter":{desc:'<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.data.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层内容格式器,支持字符串模板和回调函数两种形式。</p>\n<p><strong>1, 字符串模板</strong></p>\n<p>模板变量有 <code class="codespan">{a}</code>, <code class="codespan">{b}</code>,<code class="codespan">{c}</code>,<code class="codespan">{d}</code>,<code class="codespan">{e}</code>,分别表示系列名,数据名,数据值等。\n在 <a href="#tooltip.trigger">trigger</a> 为 <code class="codespan">'axis'</code> 的时候,会有多个系列的数据,此时可以通过 <code class="codespan">{a0}</code>, <code class="codespan">{a1}</code>, <code class="codespan">{a2}</code> 这种后面加索引的方式表示系列的索引。\n不同图表类型下的 <code class="codespan">{a}</code>,<code class="codespan">{b}</code>,<code class="codespan">{c}</code>,<code class="codespan">{d}</code> 含义不一样。\n其中变量<code class="codespan">{a}</code>, <code class="codespan">{b}</code>, <code class="codespan">{c}</code>, <code class="codespan">{d}</code>在不同图表类型下代表数据含义为:</p>\n<ul>\n<li><p>折线(区域)图、柱状(条形)图、K线图 : <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(类目值),<code class="codespan">{c}</code>(数值), <code class="codespan">{d}</code>(无)</p>\n</li>\n<li><p>散点图(气泡)图 : <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(数据名称),<code class="codespan">{c}</code>(数值数组), <code class="codespan">{d}</code>(无)</p>\n</li>\n<li><p>地图 : <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(区域名称),<code class="codespan">{c}</code>(合并数值), <code class="codespan">{d}</code>(无)</p>\n</li>\n<li><p>饼图、仪表盘、漏斗图: <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(数据项名称),<code class="codespan">{c}</code>(数值), <code class="codespan">{d}</code>(百分比)</p>\n</li>\n</ul>\n<p>更多其它图表模板变量的含义可以见相应的图表的 label.formatter 配置项。</p>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b0}: {c0}<br />{b1}: {c1}'\n</code></pre>\n<p><strong>2, 回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array, ticket: string, callback: (ticket: string, html: string)) => string\n</code></pre>\n<p>第一个参数 <code class="codespan">params</code> 是 formatter 需要的数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n // 饼图的百分比\n percent: number,\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n<p>在 <a href="#tooltip.trigger">trigger</a> 为 <code class="codespan">'axis'</code> 的时候,或者 tooltip 被 <a href="#xAxis.axisPointer">axisPointer</a> 触发的时候,<code class="codespan">params</code> 是多个系列的数据数组。其中每项内容格式同上,并且,</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n<p><strong>注:</strong> ECharts 2.x 使用数组表示各参数的方式不再支持。</p>\n<p>第二个参数 <code class="codespan">ticket</code> 是异步回调标识,配合第三个参数 <code class="codespan">callback</code> 使用。\n第三个参数 <code class="codespan">callback</code> 是异步回调,在提示框浮层内容是异步获取的时候,可以通过 callback 传入上述的 <code class="codespan">ticket</code> 和 <code class="codespan">html</code> 更新提示框浮层内容。</p>\n<p>示例:</p>\n<pre><code class="lang-js">formatter: function (params, ticket, callback) {\n $.get('detail?name=' + params.name, function (content) {\n callback(ticket, toHTML(content));\n });\n return 'Loading';\n}\n</code></pre>\n'},"data.tooltip.backgroundColor":{desc:'<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.data.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的背景颜色。</p>\n'},"data.tooltip.borderColor":{desc:'\n\n\n\n\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.data.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的边框颜色。</p>\n',uiControl:{type:"color",default:"#333"}},"data.tooltip.borderWidth":{desc:'\n\n\n\n\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.data.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的边框宽。</p>\n',uiControl:{type:"number",default:"0",step:"0.5"}},"data.tooltip.padding":{desc:'\n\n\n\n\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.data.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n\n\n<p>提示框浮层内边距,单位px,默认各方向内边距为5,接受数组分别设定上右下左边距。</p>\n<p>使用示例:</p>\n<pre><code class="lang-js">// 设置内边距为 5\npadding: 5\n// 设置上下的内边距为 5,左右的内边距为 10\npadding: [5, 10]\n// 分别设置四个方向的内边距\npadding: [\n 5, // 上\n 10, // 右\n 5, // 下\n 10, // 左\n]\n</code></pre>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.tooltip.textStyle":{desc:'<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.data.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的文本样式。</p>\n'},"data.tooltip.textStyle.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"'#fff'"}},"data.tooltip.textStyle.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.tooltip.textStyle.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.tooltip.textStyle.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.tooltip.textStyle.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"14",min:"1",step:"1"}},"data.tooltip.textStyle.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.tooltip.textStyle.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"data.tooltip.textStyle.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"data.tooltip.textStyle.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"data.tooltip.textStyle.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.tooltip.textStyle.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.tooltip.textStyle.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.tooltip.textStyle.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.tooltip.textStyle.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.tooltip.textStyle.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"data.tooltip.textStyle.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"data.tooltip.textStyle.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"data.tooltip.extraCssText":{desc:'<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.data.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>额外附加到浮层的 css 样式。如下为浮层添加阴影的示例:</p>\n<pre><code class="lang-js">extraCssText: 'box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);'\n</code></pre>\n'},markPoint:{desc:"<p>图表标注。</p>\n"},"markPoint.symbol":{desc:'\n\n<p>标记的图形。</p>\n<p>ECharts 提供的标记类型包括</p>\n<p><code class="codespan">'circle'</code>, <code class="codespan">'rect'</code>, <code class="codespan">'roundRect'</code>, <code class="codespan">'triangle'</code>, <code class="codespan">'diamond'</code>, <code class="codespan">'pin'</code>, <code class="codespan">'arrow'</code>, <code class="codespan">'none'</code></p>\n<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre><p>如果需要每个数据的图形不一样,可以设置为如下格式的回调函数:</p>\n<pre><code class="lang-js">(value: Array|number, params: Object) => string\n</code></pre>\n<p>其中第一个参数 <code class="codespan">value</code> 为 <a href="#series-funnel.data">data</a> 中的数据值。第二个参数<code class="codespan">params</code> 是其它的数据项参数。</p>\n',uiControl:{type:"icon",default:"circle"}},"markPoint.symbolSize":{desc:'\n\n<p>标记的大小,可以设置成诸如 <code class="codespan">10</code> 这样单一的数字,也可以用数组分开表示宽和高,例如 <code class="codespan">[20, 10]</code> 表示标记宽为<code class="codespan">20</code>,高为<code class="codespan">10</code>。</p>\n<p>如果需要每个数据的图形大小不一样,可以设置为如下格式的回调函数:</p>\n<pre><code class="lang-js">(value: Array|number, params: Object) => number|Array\n</code></pre>\n<p>其中第一个参数 <code class="codespan">value</code> 为 <a href="#series-funnel.data">data</a> 中的数据值。第二个参数<code class="codespan">params</code> 是其它的数据项参数。</p>\n',uiControl:{type:"number",min:"0"}},"markPoint.symbolRotate":{desc:'\n\n<p>标记的旋转角度(而非弧度)。正值表示逆时针旋转。注意在 <code class="codespan">markLine</code> 中当 <code class="codespan">symbol</code> 为 <code class="codespan">'arrow'</code> 时会忽略 <code class="codespan">symbolRotate</code> 强制设置为切线的角度。</p>\n<p>如果需要每个数据的旋转角度不一样,可以设置为如下格式的回调函数:</p>\n<pre><code class="lang-js">(value: Array|number, params: Object) => number\n</code></pre>\n<p>其中第一个参数 <code class="codespan">value</code> 为 <a href="#series-funnel.data">data</a> 中的数据值。第二个参数<code class="codespan">params</code> 是其它的数据项参数。</p>\n<blockquote>\n<p>从 4.8.0 开始支持回调函数。</p>\n</blockquote>\n',uiControl:{type:"angle",min:"-180",max:"180",step:"1"}},"markPoint.symbolKeepAspect":{desc:'\n\n<p>如果 <code class="codespan">symbol</code> 是 <code class="codespan">path://</code> 的形式,是否在缩放时保持该图形的长宽比。</p>\n',uiControl:{type:"boolean",clean:"true"}},"markPoint.symbolOffset":{desc:'\n\n<p>标记相对于原本位置的偏移。默认情况下,标记会居中置放在数据对应的位置,但是如果 symbol 是自定义的矢量路径或者图片,就有可能不希望 symbol 居中。这时候可以使用该配置项配置 symbol 相对于原本居中的偏移,可以是绝对的像素值,也可以是相对的百分比。</p>\n<p>例如 <code class="codespan">[0, '50%']</code> 就是把自己向上移动了一半的位置,在 symbol 图形是气泡的时候可以让图形下端的箭头对准数据点。</p>\n',uiControl:{type:"vector",separate:"true",dims:"x,y"}},"markPoint.silent":{desc:"\n\n<p>图形是否不响应和触发鼠标事件,默认为 false,即响应和触发鼠标事件。</p>\n",uiControl:{type:"boolean"}},"markPoint.label":{desc:"<p>标注的文本。</p>\n"},"markPoint.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"true"}},"markPoint.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markPoint.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markPoint.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markPoint.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markPoint.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {@score}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markPoint.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markPoint.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markPoint.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markPoint.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markPoint.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markPoint.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markPoint.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markPoint.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markPoint.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markPoint.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markPoint.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markPoint.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markPoint.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markPoint.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markPoint.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markPoint.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markPoint.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markPoint.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markPoint.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markPoint.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markPoint.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markPoint.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markPoint.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markPoint.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markPoint.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markPoint.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markPoint.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markPoint.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markPoint.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markPoint.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markPoint.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markPoint.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markPoint.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markPoint.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markPoint.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.itemStyle":{desc:"<p>标注的样式。</p>\n"},"markPoint.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markPoint.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markPoint.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markPoint.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markPoint.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markPoint.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markPoint.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markPoint.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markPoint.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markPoint.emphasis":{desc:"<p>标注的高亮样式。</p>\n"},"markPoint.emphasis.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markPoint.emphasis.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markPoint.emphasis.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markPoint.emphasis.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markPoint.emphasis.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markPoint.emphasis.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {@score}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markPoint.emphasis.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markPoint.emphasis.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markPoint.emphasis.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markPoint.emphasis.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markPoint.emphasis.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markPoint.emphasis.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markPoint.emphasis.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markPoint.emphasis.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markPoint.emphasis.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.emphasis.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.emphasis.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.emphasis.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markPoint.emphasis.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markPoint.emphasis.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markPoint.emphasis.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.emphasis.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.emphasis.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.emphasis.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markPoint.emphasis.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markPoint.emphasis.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markPoint.emphasis.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.emphasis.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markPoint.emphasis.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.emphasis.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.emphasis.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.emphasis.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markPoint.emphasis.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markPoint.emphasis.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markPoint.emphasis.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markPoint.emphasis.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markPoint.emphasis.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markPoint.emphasis.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markPoint.emphasis.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markPoint.emphasis.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markPoint.emphasis.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markPoint.emphasis.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markPoint.emphasis.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markPoint.emphasis.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.emphasis.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.emphasis.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.emphasis.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markPoint.emphasis.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markPoint.emphasis.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markPoint.emphasis.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.emphasis.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.emphasis.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.emphasis.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markPoint.emphasis.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markPoint.emphasis.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markPoint.emphasis.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.emphasis.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markPoint.emphasis.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.emphasis.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.emphasis.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.emphasis.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markPoint.emphasis.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markPoint.emphasis.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markPoint.emphasis.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markPoint.emphasis.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markPoint.emphasis.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markPoint.emphasis.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markPoint.emphasis.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markPoint.emphasis.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markPoint.blur":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>标注的淡出样式。淡出的规则跟随所在系列。</p>\n'},"markPoint.blur.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markPoint.blur.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markPoint.blur.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markPoint.blur.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markPoint.blur.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markPoint.blur.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {@score}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markPoint.blur.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markPoint.blur.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markPoint.blur.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markPoint.blur.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markPoint.blur.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markPoint.blur.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markPoint.blur.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markPoint.blur.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markPoint.blur.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.blur.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.blur.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.blur.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markPoint.blur.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markPoint.blur.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markPoint.blur.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.blur.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.blur.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.blur.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markPoint.blur.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markPoint.blur.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markPoint.blur.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.blur.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markPoint.blur.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.blur.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.blur.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.blur.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markPoint.blur.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markPoint.blur.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markPoint.blur.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markPoint.blur.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markPoint.blur.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markPoint.blur.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markPoint.blur.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markPoint.blur.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markPoint.blur.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markPoint.blur.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markPoint.blur.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markPoint.blur.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.blur.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.blur.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.blur.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markPoint.blur.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markPoint.blur.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markPoint.blur.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.blur.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.blur.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.blur.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markPoint.blur.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markPoint.blur.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markPoint.blur.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.blur.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markPoint.blur.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.blur.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.blur.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.blur.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markPoint.blur.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markPoint.blur.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markPoint.blur.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markPoint.blur.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markPoint.blur.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markPoint.blur.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markPoint.blur.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markPoint.blur.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markPoint.data":{desc:'<p>标注的数据数组。每个数组项是一个对象,有下面几种方式指定标注的位置。</p>\n<ol>\n<li>通过 <a href="#series-funnel.markPoint.data.x">x</a>, <a href="#series-funnel.markPoint.data.y">y</a> 属性指定相对容器的屏幕坐标,单位像素,支持百分比。</li>\n</ol>\n<p>当多个属性同时存在时,优先级按上述的顺序。</p>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">data: [\n\n {\n name: '某个屏幕坐标',\n x: 100,\n y: 100\n }\n]\n</code></pre>\n'},"markPoint.data.name":{desc:"<p>标注名称。</p>\n"},"markPoint.data.x":{desc:"\n\n<p>相对容器的屏幕 x 坐标,单位像素。</p>\n",uiControl:{type:"percent",default:"0"}},"markPoint.data.y":{desc:"\n\n<p>相对容器的屏幕 y 坐标,单位像素。</p>\n",uiControl:{type:"percent",default:"0"}},"markPoint.data.value":{desc:"<p>标注值,可以不设。</p>\n"},"markPoint.data.symbol":{desc:'\n\n<p>标记的图形。</p>\n<p>ECharts 提供的标记类型包括</p>\n<p><code class="codespan">'circle'</code>, <code class="codespan">'rect'</code>, <code class="codespan">'roundRect'</code>, <code class="codespan">'triangle'</code>, <code class="codespan">'diamond'</code>, <code class="codespan">'pin'</code>, <code class="codespan">'arrow'</code>, <code class="codespan">'none'</code></p>\n<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>',uiControl:{type:"icon",default:"circle"}},"markPoint.data.symbolSize":{desc:'\n\n<p>标记的大小,可以设置成诸如 <code class="codespan">10</code> 这样单一的数字,也可以用数组分开表示宽和高,例如 <code class="codespan">[20, 10]</code> 表示标记宽为<code class="codespan">20</code>,高为<code class="codespan">10</code>。</p>\n',uiControl:{type:"number",min:"0"}},"markPoint.data.symbolRotate":{desc:'\n\n<p>标记的旋转角度(而非弧度)。正值表示逆时针旋转。注意在 <code class="codespan">markLine</code> 中当 <code class="codespan">symbol</code> 为 <code class="codespan">'arrow'</code> 时会忽略 <code class="codespan">symbolRotate</code> 强制设置为切线的角度。</p>\n',uiControl:{type:"angle",min:"-180",max:"180",step:"1"}},"markPoint.data.symbolKeepAspect":{desc:'\n\n<p>如果 <code class="codespan">symbol</code> 是 <code class="codespan">path://</code> 的形式,是否在缩放时保持该图形的长宽比。</p>\n',uiControl:{type:"boolean",clean:"true"}},"markPoint.data.symbolOffset":{desc:'\n\n<p>标记相对于原本位置的偏移。默认情况下,标记会居中置放在数据对应的位置,但是如果 symbol 是自定义的矢量路径或者图片,就有可能不希望 symbol 居中。这时候可以使用该配置项配置 symbol 相对于原本居中的偏移,可以是绝对的像素值,也可以是相对的百分比。</p>\n<p>例如 <code class="codespan">[0, '50%']</code> 就是把自己向上移动了一半的位置,在 symbol 图形是气泡的时候可以让图形下端的箭头对准数据点。</p>\n',uiControl:{type:"vector",separate:"true",dims:"x,y"}},"markPoint.data.itemStyle":{desc:"<p>该标注的样式。</p>\n"},"markPoint.data.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markPoint.data.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markPoint.data.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markPoint.data.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markPoint.data.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markPoint.data.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markPoint.data.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markPoint.data.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markPoint.data.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markPoint.data.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markPoint.data.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markPoint.data.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markPoint.data.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markPoint.data.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markPoint.data.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markPoint.data.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markPoint.data.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markPoint.data.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markPoint.data.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markPoint.data.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markPoint.data.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markPoint.data.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markPoint.data.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.data.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.data.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markPoint.data.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markPoint.data.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markPoint.data.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markPoint.data.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markPoint.data.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markPoint.data.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markPoint.data.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markPoint.data.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markPoint.data.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markPoint.data.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markPoint.data.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markPoint.data.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markPoint.data.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markPoint.data.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markPoint.data.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markPoint.data.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markPoint.data.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markPoint.data.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markPoint.data.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.data.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.data.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markPoint.data.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markPoint.data.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markPoint.data.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markPoint.data.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markPoint.data.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markPoint.data.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markPoint.data.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.emphasis.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markPoint.data.emphasis.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markPoint.data.emphasis.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markPoint.data.emphasis.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markPoint.data.emphasis.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markPoint.data.emphasis.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markPoint.data.emphasis.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markPoint.data.emphasis.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markPoint.data.emphasis.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markPoint.data.emphasis.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markPoint.data.emphasis.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markPoint.data.emphasis.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markPoint.data.emphasis.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markPoint.data.emphasis.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.data.emphasis.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.data.emphasis.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.emphasis.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markPoint.data.emphasis.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markPoint.data.emphasis.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markPoint.data.emphasis.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.emphasis.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.emphasis.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.emphasis.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markPoint.data.emphasis.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markPoint.data.emphasis.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markPoint.data.emphasis.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.emphasis.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markPoint.data.emphasis.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.emphasis.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.emphasis.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.emphasis.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markPoint.data.emphasis.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markPoint.data.emphasis.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markPoint.data.emphasis.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markPoint.data.emphasis.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markPoint.data.emphasis.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markPoint.data.emphasis.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markPoint.data.emphasis.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markPoint.data.emphasis.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markPoint.data.emphasis.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markPoint.data.emphasis.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markPoint.data.emphasis.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markPoint.data.emphasis.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.data.emphasis.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.data.emphasis.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.emphasis.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markPoint.data.emphasis.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markPoint.data.emphasis.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markPoint.data.emphasis.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.emphasis.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.emphasis.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.emphasis.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markPoint.data.emphasis.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markPoint.data.emphasis.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markPoint.data.emphasis.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.emphasis.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markPoint.data.emphasis.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.emphasis.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.emphasis.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.emphasis.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markPoint.data.emphasis.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markPoint.data.emphasis.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markPoint.data.emphasis.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markPoint.data.emphasis.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markPoint.data.emphasis.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markPoint.data.emphasis.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markPoint.data.emphasis.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markPoint.data.emphasis.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markPoint.animation":{desc:"\n\n<p>是否开启动画。</p>\n",uiControl:{type:"boolean",default:"true",clean:"true"}},"markPoint.animationThreshold":{desc:"<p>是否开启动画的阈值,当单个系列显示的图形数量大于这个阈值时会关闭动画。</p>\n"},"markPoint.animationDuration":{desc:'\n\n<p>初始动画的时长,支持回调函数,可以通过每个数据返回不同的时长实现更戏剧的初始动画效果:</p>\n<pre><code class="lang-js">animationDuration: function (idx) {\n // 越往后的数据时长越大\n return idx * 100;\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",default:"1000",step:"20",clean:"true"}},"markPoint.animationEasing":{desc:'\n\n<p>初始动画的缓动效果。不同的缓动效果可以参考 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=line-easing" target="_blank">缓动示例</a>。</p>\n',uiControl:{type:"enum",options:"linear,quadraticIn,quadraticOut,quadraticInOut,cubicIn,cubicOut,cubicInOut,quarticIn,quarticOut,quarticInOut,quinticIn,quinticOut,quinticInOut,sinusoidalIn,sinusoidalOut,sinusoidalInOut,exponentialIn,exponentialOut,exponentialInOut,circularIn,circularOut,circularInOut,elasticIn,elasticOut,elasticInOut,backIn,backOut,backInOut,bounceIn,bounceOut,bounceInOut",clean:"true"}},"markPoint.animationDelay":{desc:'<p>初始动画的延迟,支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的初始动画效果。</p>\n<p>如下示例:</p>\n<pre><code class="lang-js">animationDelay: function (idx) {\n // 越往后的数据延迟越大\n return idx * 100;\n}\n</code></pre>\n<p>也可以看<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-animation-delay" target="_blank">该示例</a></p>\n'},"markPoint.animationDurationUpdate":{desc:'\n\n<p>数据更新动画的时长。</p>\n<p>支持回调函数,可以通过每个数据返回不同的时长实现更戏剧的更新动画效果:</p>\n<pre><code class="lang-js">animationDurationUpdate: function (idx) {\n // 越往后的数据时长越大\n return idx * 100;\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",default:"1000",step:"20"}},"markPoint.animationEasingUpdate":{desc:"\n\n<p>数据更新动画的缓动效果。</p>\n",uiControl:{type:"enum",options:"linear,quadraticIn,quadraticOut,quadraticInOut,cubicIn,cubicOut,cubicInOut,quarticIn,quarticOut,quarticInOut,quinticIn,quinticOut,quinticInOut,sinusoidalIn,sinusoidalOut,sinusoidalInOut,exponentialIn,exponentialOut,exponentialInOut,circularIn,circularOut,circularInOut,elasticIn,elasticOut,elasticInOut,backIn,backOut,backInOut,bounceIn,bounceOut,bounceInOut"}},"markPoint.animationDelayUpdate":{desc:'<p>数据更新动画的延迟,支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的更新动画效果。</p>\n<p>如下示例:</p>\n<pre><code class="lang-js">animationDelayUpdate: function (idx) {\n // 越往后的数据延迟越大\n return idx * 100;\n}\n</code></pre>\n<p>也可以看<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-animation-delay" target="_blank">该示例</a></p>\n'},markLine:{desc:"<p>图表标线。</p>\n"},"markLine.silent":{desc:"\n\n<p>图形是否不响应和触发鼠标事件,默认为 false,即响应和触发鼠标事件。</p>\n",uiControl:{type:"boolean"}},"markLine.symbol":{desc:'<p>标线两端的标记类型,可以是一个数组分别指定两端,也可以是单个统一指定,具体格式见 <a href="#series-funnel.markLine.data.0.symbol">data.symbol</a>。</p>\n'},"markLine.symbolSize":{desc:'<p>标线两端的标记大小,可以是一个数组分别指定两端,也可以是单个统一指定。</p>\n<p><strong>注意:</strong> 这里无法像一般的 <code class="codespan">symbolSize</code> 那样通过数组分别指定高宽。</p>\n'},"markLine.precision":{desc:"<p>标线数值的精度,在显示平均值线的时候有用。</p>\n"},"markLine.label":{desc:"<p>标线的文本。</p>\n"},"markLine.label.show":{desc:"<p>是否显示标签。</p>\n"},"markLine.label.position":{desc:'<p>标签位置,可选:</p>\n<ul>\n<li><code class="codespan">'start'</code> 线的起始点。</li>\n<li><code class="codespan">'middle'</code> 线的中点。</li>\n<li><code class="codespan">'end'</code> 线的结束点。</li>\n</ul>\n<p>4.7.0 版本起,支持更多标签位置:<code class="codespan">'start'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'end'</code>, <code class="codespan">'insideStartTop'</code>, <code class="codespan">'insideStartBottom'</code>, <code class="codespan">'insideMiddleTop'</code>, <code class="codespan">'insideMiddleBottom'</code>, <code class="codespan">'insideEndTop'</code>, <code class="codespan">'insideEndBottom'</code>。</p>\n<p>其中,<code class="codespan">'insideMiddleBottom'</code> 等同于 <code class="codespan">'middle'</code>。具体位置参见下图。</p>\n<p>文字与线的间距可以通过 <a href="#series-.markLine.label.distance">label.distance</a> 调整。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-markline&reset=1&edit=1" width="800" height="500"><iframe />\n\n'},"markLine.label.distance":{desc:"<p>标签与线之间的间距。如果是数组,第一项为横向间距,第二项为纵向间距。如果是数字,则表示横向纵向使用相同的间距。</p>\n"},"markLine.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markLine.lineStyle":{desc:"<p>标线的样式</p>\n"},"markLine.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markLine.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"markLine.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markLine.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markLine.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markLine.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markLine.lineStyle.curveness":{desc:"\n\n<p>边的曲度,支持从 0 到 1 的值,值越大曲度越大。</p>\n",uiControl:{type:"number",min:"0",max:"1",step:"0.01",default:"0"}},"markLine.emphasis":{desc:"<p>标线的高亮样式。</p>\n"},"markLine.emphasis.label.show":{desc:"<p>是否显示标签。</p>\n"},"markLine.emphasis.label.position":{desc:'<p>标签位置,可选:</p>\n<ul>\n<li><code class="codespan">'start'</code> 线的起始点。</li>\n<li><code class="codespan">'middle'</code> 线的中点。</li>\n<li><code class="codespan">'end'</code> 线的结束点。</li>\n</ul>\n<p>4.7.0 版本起,支持更多标签位置:<code class="codespan">'start'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'end'</code>, <code class="codespan">'insideStartTop'</code>, <code class="codespan">'insideStartBottom'</code>, <code class="codespan">'insideMiddleTop'</code>, <code class="codespan">'insideMiddleBottom'</code>, <code class="codespan">'insideEndTop'</code>, <code class="codespan">'insideEndBottom'</code>。</p>\n<p>其中,<code class="codespan">'insideMiddleBottom'</code> 等同于 <code class="codespan">'middle'</code>。具体位置参见下图。</p>\n<p>文字与线的间距可以通过 <a href="#series-.markLine.label.distance">label.distance</a> 调整。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-markline&reset=1&edit=1" width="800" height="500"><iframe />\n\n'},"markLine.emphasis.label.distance":{desc:"<p>标签与线之间的间距。如果是数组,第一项为横向间距,第二项为纵向间距。如果是数字,则表示横向纵向使用相同的间距。</p>\n"},"markLine.emphasis.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markLine.emphasis.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markLine.emphasis.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"markLine.emphasis.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markLine.emphasis.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markLine.emphasis.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markLine.emphasis.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.emphasis.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.emphasis.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markLine.blur":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>标线的淡出样式。淡出的规则跟随所在系列。</p>\n'},"markLine.blur.label.show":{desc:"<p>是否显示标签。</p>\n"},"markLine.blur.label.position":{desc:'<p>标签位置,可选:</p>\n<ul>\n<li><code class="codespan">'start'</code> 线的起始点。</li>\n<li><code class="codespan">'middle'</code> 线的中点。</li>\n<li><code class="codespan">'end'</code> 线的结束点。</li>\n</ul>\n<p>4.7.0 版本起,支持更多标签位置:<code class="codespan">'start'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'end'</code>, <code class="codespan">'insideStartTop'</code>, <code class="codespan">'insideStartBottom'</code>, <code class="codespan">'insideMiddleTop'</code>, <code class="codespan">'insideMiddleBottom'</code>, <code class="codespan">'insideEndTop'</code>, <code class="codespan">'insideEndBottom'</code>。</p>\n<p>其中,<code class="codespan">'insideMiddleBottom'</code> 等同于 <code class="codespan">'middle'</code>。具体位置参见下图。</p>\n<p>文字与线的间距可以通过 <a href="#series-.markLine.label.distance">label.distance</a> 调整。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-markline&reset=1&edit=1" width="800" height="500"><iframe />\n\n'},"markLine.blur.label.distance":{desc:"<p>标签与线之间的间距。如果是数组,第一项为横向间距,第二项为纵向间距。如果是数字,则表示横向纵向使用相同的间距。</p>\n"},"markLine.blur.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markLine.blur.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markLine.blur.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"markLine.blur.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markLine.blur.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markLine.blur.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markLine.blur.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.blur.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.blur.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markLine.data":{desc:'<p>标线的数据数组。每个数组项可以是一个两个值的数组,分别表示线的起点和终点,每一项是一个对象,有下面几种方式指定起点或终点的位置。</p>\n<ol>\n<li>通过 <a href="#series-funnel.markLine.data.0.x">x</a>, <a href="#series-funnel.markLine.data.0.y">y</a> 属性指定相对容器的屏幕坐标,单位像素,支持百分比。</li>\n</ol>\n<p>当多个属性同时存在时,优先级按上述的顺序。</p>\n<pre><code>data: [\n\n[\n {\n name: '两个屏幕坐标之间的标线',\n x: 100,\n y: 100\n },\n {\n x: 500,\n y: 200\n }\n ]\n]\n</code></pre>'},"markLine.data.0":{desc:"<p>起点的数据。</p>\n"},"markLine.data.0.name":{desc:"<p>标注名称,将会作为文字显示。</p>\n"},"markLine.data.0.x":{desc:"\n\n<p>相对容器的屏幕 x 坐标,单位像素。</p>\n",uiControl:{type:"percent",default:"0"}},"markLine.data.0.y":{desc:"\n\n<p>相对容器的屏幕 y 坐标,单位像素。</p>\n",uiControl:{type:"percent",default:"0"}},"markLine.data.0.value":{desc:"<p>标注值,可以不设。</p>\n"},"markLine.data.0.symbol":{desc:'\n\n<p>起点标记的图形。</p>\n<p>ECharts 提供的标记类型包括</p>\n<p><code class="codespan">'circle'</code>, <code class="codespan">'rect'</code>, <code class="codespan">'roundRect'</code>, <code class="codespan">'triangle'</code>, <code class="codespan">'diamond'</code>, <code class="codespan">'pin'</code>, <code class="codespan">'arrow'</code>, <code class="codespan">'none'</code></p>\n<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>',uiControl:{type:"icon",default:"circle"}},"markLine.data.0.symbolSize":{desc:'\n\n<p>起点标记的大小,可以设置成诸如 <code class="codespan">10</code> 这样单一的数字,也可以用数组分开表示宽和高,例如 <code class="codespan">[20, 10]</code> 表示标记宽为<code class="codespan">20</code>,高为<code class="codespan">10</code>。</p>\n',uiControl:{type:"number",min:"0"}},"markLine.data.0.symbolRotate":{desc:'\n\n<p>起点标记的旋转角度(而非弧度)。正值表示逆时针旋转。注意在 <code class="codespan">markLine</code> 中当 <code class="codespan">symbol</code> 为 <code class="codespan">'arrow'</code> 时会忽略 <code class="codespan">symbolRotate</code> 强制设置为切线的角度。</p>\n',uiControl:{type:"angle",min:"-180",max:"180",step:"1"}},"markLine.data.0.symbolKeepAspect":{desc:'\n\n<p>如果 <code class="codespan">symbol</code> 是 <code class="codespan">path://</code> 的形式,是否在缩放时保持该图形的长宽比。</p>\n',uiControl:{type:"boolean",clean:"true"}},"markLine.data.0.symbolOffset":{desc:'\n\n<p>起点标记相对于原本位置的偏移。默认情况下,标记会居中置放在数据对应的位置,但是如果 symbol 是自定义的矢量路径或者图片,就有可能不希望 symbol 居中。这时候可以使用该配置项配置 symbol 相对于原本居中的偏移,可以是绝对的像素值,也可以是相对的百分比。</p>\n<p>例如 <code class="codespan">[0, '50%']</code> 就是把自己向上移动了一半的位置,在 symbol 图形是气泡的时候可以让图形下端的箭头对准数据点。</p>\n',uiControl:{type:"vector",separate:"true",dims:"x,y"}},"markLine.data.0.lineStyle":{desc:'<p>该数据项线的样式,起点和终点项的 <code class="codespan">lineStyle</code>会合并到一起。</p>\n'},"markLine.data.0.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markLine.data.0.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"markLine.data.0.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markLine.data.0.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markLine.data.0.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markLine.data.0.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.0.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.0.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markLine.data.0.lineStyle.curveness":{desc:"\n\n<p>边的曲度,支持从 0 到 1 的值,值越大曲度越大。</p>\n",uiControl:{type:"number",min:"0",max:"1",step:"0.01",default:"0"}},"markLine.data.0.label":{desc:'<p>该数据项标签的样式,起点和终点项的 <code class="codespan">label</code>会合并到一起。</p>\n'},"markLine.data.0.label.show":{desc:"<p>是否显示标签。</p>\n"},"markLine.data.0.label.position":{desc:'<p>标签位置,可选:</p>\n<ul>\n<li><code class="codespan">'start'</code> 线的起始点。</li>\n<li><code class="codespan">'middle'</code> 线的中点。</li>\n<li><code class="codespan">'end'</code> 线的结束点。</li>\n</ul>\n<p>4.7.0 版本起,支持更多标签位置:<code class="codespan">'start'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'end'</code>, <code class="codespan">'insideStartTop'</code>, <code class="codespan">'insideStartBottom'</code>, <code class="codespan">'insideMiddleTop'</code>, <code class="codespan">'insideMiddleBottom'</code>, <code class="codespan">'insideEndTop'</code>, <code class="codespan">'insideEndBottom'</code>。</p>\n<p>其中,<code class="codespan">'insideMiddleBottom'</code> 等同于 <code class="codespan">'middle'</code>。具体位置参见下图。</p>\n<p>文字与线的间距可以通过 <a href="#series-.markLine.label.distance">label.distance</a> 调整。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-markline&reset=1&edit=1" width="800" height="500"><iframe />\n\n'},"markLine.data.0.label.distance":{desc:"<p>标签与线之间的间距。如果是数组,第一项为横向间距,第二项为纵向间距。如果是数字,则表示横向纵向使用相同的间距。</p>\n"},"markLine.data.0.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markLine.data.0.emphasis.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markLine.data.0.emphasis.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"markLine.data.0.emphasis.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markLine.data.0.emphasis.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markLine.data.0.emphasis.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markLine.data.0.emphasis.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.0.emphasis.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.0.emphasis.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markLine.data.0.emphasis.lineStyle.curveness":{desc:"\n\n<p>边的曲度,支持从 0 到 1 的值,值越大曲度越大。</p>\n",uiControl:{type:"number",min:"0",max:"1",step:"0.01",default:"0"}},"markLine.data.0.emphasis.label.show":{desc:"<p>是否显示标签。</p>\n"},"markLine.data.0.emphasis.label.position":{desc:'<p>标签位置,可选:</p>\n<ul>\n<li><code class="codespan">'start'</code> 线的起始点。</li>\n<li><code class="codespan">'middle'</code> 线的中点。</li>\n<li><code class="codespan">'end'</code> 线的结束点。</li>\n</ul>\n<p>4.7.0 版本起,支持更多标签位置:<code class="codespan">'start'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'end'</code>, <code class="codespan">'insideStartTop'</code>, <code class="codespan">'insideStartBottom'</code>, <code class="codespan">'insideMiddleTop'</code>, <code class="codespan">'insideMiddleBottom'</code>, <code class="codespan">'insideEndTop'</code>, <code class="codespan">'insideEndBottom'</code>。</p>\n<p>其中,<code class="codespan">'insideMiddleBottom'</code> 等同于 <code class="codespan">'middle'</code>。具体位置参见下图。</p>\n<p>文字与线的间距可以通过 <a href="#series-.markLine.label.distance">label.distance</a> 调整。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-markline&reset=1&edit=1" width="800" height="500"><iframe />\n\n'},"markLine.data.0.emphasis.label.distance":{desc:"<p>标签与线之间的间距。如果是数组,第一项为横向间距,第二项为纵向间距。如果是数字,则表示横向纵向使用相同的间距。</p>\n"},"markLine.data.0.emphasis.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markLine.data.0.blur":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n'},"markLine.data.0.blur.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markLine.data.0.blur.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"markLine.data.0.blur.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markLine.data.0.blur.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markLine.data.0.blur.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markLine.data.0.blur.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.0.blur.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.0.blur.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markLine.data.0.blur.lineStyle.curveness":{desc:"\n\n<p>边的曲度,支持从 0 到 1 的值,值越大曲度越大。</p>\n",uiControl:{type:"number",min:"0",max:"1",step:"0.01",default:"0"}},"markLine.data.0.blur.label.show":{desc:"<p>是否显示标签。</p>\n"},"markLine.data.0.blur.label.position":{desc:'<p>标签位置,可选:</p>\n<ul>\n<li><code class="codespan">'start'</code> 线的起始点。</li>\n<li><code class="codespan">'middle'</code> 线的中点。</li>\n<li><code class="codespan">'end'</code> 线的结束点。</li>\n</ul>\n<p>4.7.0 版本起,支持更多标签位置:<code class="codespan">'start'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'end'</code>, <code class="codespan">'insideStartTop'</code>, <code class="codespan">'insideStartBottom'</code>, <code class="codespan">'insideMiddleTop'</code>, <code class="codespan">'insideMiddleBottom'</code>, <code class="codespan">'insideEndTop'</code>, <code class="codespan">'insideEndBottom'</code>。</p>\n<p>其中,<code class="codespan">'insideMiddleBottom'</code> 等同于 <code class="codespan">'middle'</code>。具体位置参见下图。</p>\n<p>文字与线的间距可以通过 <a href="#series-.markLine.label.distance">label.distance</a> 调整。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-markline&reset=1&edit=1" width="800" height="500"><iframe />\n\n'},"markLine.data.0.blur.label.distance":{desc:"<p>标签与线之间的间距。如果是数组,第一项为横向间距,第二项为纵向间距。如果是数字,则表示横向纵向使用相同的间距。</p>\n"},"markLine.data.0.blur.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markLine.data.1":{desc:"<p>终点的数据。</p>\n"},"markLine.data.1.name":{desc:"<p>标注名称,将会作为文字显示。</p>\n"},"markLine.data.1.x":{desc:"\n\n<p>相对容器的屏幕 x 坐标,单位像素。</p>\n",uiControl:{type:"percent",default:"0"}},"markLine.data.1.y":{desc:"\n\n<p>相对容器的屏幕 y 坐标,单位像素。</p>\n",uiControl:{type:"percent",default:"0"}},"markLine.data.1.value":{desc:"<p>标注值,可以不设。</p>\n"},"markLine.data.1.symbol":{desc:'\n\n<p>终点标记的图形。</p>\n<p>ECharts 提供的标记类型包括</p>\n<p><code class="codespan">'circle'</code>, <code class="codespan">'rect'</code>, <code class="codespan">'roundRect'</code>, <code class="codespan">'triangle'</code>, <code class="codespan">'diamond'</code>, <code class="codespan">'pin'</code>, <code class="codespan">'arrow'</code>, <code class="codespan">'none'</code></p>\n<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>',uiControl:{type:"icon",default:"circle"}},"markLine.data.1.symbolSize":{desc:'\n\n<p>终点标记的大小,可以设置成诸如 <code class="codespan">10</code> 这样单一的数字,也可以用数组分开表示宽和高,例如 <code class="codespan">[20, 10]</code> 表示标记宽为<code class="codespan">20</code>,高为<code class="codespan">10</code>。</p>\n',uiControl:{type:"number",min:"0"}},"markLine.data.1.symbolRotate":{desc:'\n\n<p>终点标记的旋转角度(而非弧度)。正值表示逆时针旋转。注意在 <code class="codespan">markLine</code> 中当 <code class="codespan">symbol</code> 为 <code class="codespan">'arrow'</code> 时会忽略 <code class="codespan">symbolRotate</code> 强制设置为切线的角度。</p>\n',uiControl:{type:"angle",min:"-180",max:"180",step:"1"}},"markLine.data.1.symbolKeepAspect":{desc:'\n\n<p>如果 <code class="codespan">symbol</code> 是 <code class="codespan">path://</code> 的形式,是否在缩放时保持该图形的长宽比。</p>\n',uiControl:{type:"boolean",clean:"true"}},"markLine.data.1.symbolOffset":{desc:'\n\n<p>终点标记相对于原本位置的偏移。默认情况下,标记会居中置放在数据对应的位置,但是如果 symbol 是自定义的矢量路径或者图片,就有可能不希望 symbol 居中。这时候可以使用该配置项配置 symbol 相对于原本居中的偏移,可以是绝对的像素值,也可以是相对的百分比。</p>\n<p>例如 <code class="codespan">[0, '50%']</code> 就是把自己向上移动了一半的位置,在 symbol 图形是气泡的时候可以让图形下端的箭头对准数据点。</p>\n',uiControl:{type:"vector",separate:"true",dims:"x,y"}},"markLine.data.1.lineStyle":{desc:'<p>该数据项线的样式,起点和终点项的 <code class="codespan">lineStyle</code>会合并到一起。</p>\n'},"markLine.data.1.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markLine.data.1.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"markLine.data.1.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markLine.data.1.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markLine.data.1.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markLine.data.1.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.1.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.1.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markLine.data.1.lineStyle.curveness":{desc:"\n\n<p>边的曲度,支持从 0 到 1 的值,值越大曲度越大。</p>\n",uiControl:{type:"number",min:"0",max:"1",step:"0.01",default:"0"}},"markLine.data.1.label":{desc:'<p>该数据项标签的样式,起点和终点项的 <code class="codespan">label</code>会合并到一起。</p>\n'},"markLine.data.1.label.show":{desc:"<p>是否显示标签。</p>\n"},"markLine.data.1.label.position":{desc:'<p>标签位置,可选:</p>\n<ul>\n<li><code class="codespan">'start'</code> 线的起始点。</li>\n<li><code class="codespan">'middle'</code> 线的中点。</li>\n<li><code class="codespan">'end'</code> 线的结束点。</li>\n</ul>\n<p>4.7.0 版本起,支持更多标签位置:<code class="codespan">'start'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'end'</code>, <code class="codespan">'insideStartTop'</code>, <code class="codespan">'insideStartBottom'</code>, <code class="codespan">'insideMiddleTop'</code>, <code class="codespan">'insideMiddleBottom'</code>, <code class="codespan">'insideEndTop'</code>, <code class="codespan">'insideEndBottom'</code>。</p>\n<p>其中,<code class="codespan">'insideMiddleBottom'</code> 等同于 <code class="codespan">'middle'</code>。具体位置参见下图。</p>\n<p>文字与线的间距可以通过 <a href="#series-.markLine.label.distance">label.distance</a> 调整。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-markline&reset=1&edit=1" width="800" height="500"><iframe />\n\n'},"markLine.data.1.label.distance":{desc:"<p>标签与线之间的间距。如果是数组,第一项为横向间距,第二项为纵向间距。如果是数字,则表示横向纵向使用相同的间距。</p>\n"},"markLine.data.1.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markLine.data.1.emphasis.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markLine.data.1.emphasis.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"markLine.data.1.emphasis.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markLine.data.1.emphasis.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markLine.data.1.emphasis.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markLine.data.1.emphasis.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.1.emphasis.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.1.emphasis.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markLine.data.1.emphasis.lineStyle.curveness":{desc:"\n\n<p>边的曲度,支持从 0 到 1 的值,值越大曲度越大。</p>\n",uiControl:{type:"number",min:"0",max:"1",step:"0.01",default:"0"}},"markLine.data.1.emphasis.label.show":{desc:"<p>是否显示标签。</p>\n"},"markLine.data.1.emphasis.label.position":{desc:'<p>标签位置,可选:</p>\n<ul>\n<li><code class="codespan">'start'</code> 线的起始点。</li>\n<li><code class="codespan">'middle'</code> 线的中点。</li>\n<li><code class="codespan">'end'</code> 线的结束点。</li>\n</ul>\n<p>4.7.0 版本起,支持更多标签位置:<code class="codespan">'start'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'end'</code>, <code class="codespan">'insideStartTop'</code>, <code class="codespan">'insideStartBottom'</code>, <code class="codespan">'insideMiddleTop'</code>, <code class="codespan">'insideMiddleBottom'</code>, <code class="codespan">'insideEndTop'</code>, <code class="codespan">'insideEndBottom'</code>。</p>\n<p>其中,<code class="codespan">'insideMiddleBottom'</code> 等同于 <code class="codespan">'middle'</code>。具体位置参见下图。</p>\n<p>文字与线的间距可以通过 <a href="#series-.markLine.label.distance">label.distance</a> 调整。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-markline&reset=1&edit=1" width="800" height="500"><iframe />\n\n'},"markLine.data.1.emphasis.label.distance":{desc:"<p>标签与线之间的间距。如果是数组,第一项为横向间距,第二项为纵向间距。如果是数字,则表示横向纵向使用相同的间距。</p>\n"},"markLine.data.1.emphasis.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markLine.data.1.blur":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n'},"markLine.data.1.blur.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markLine.data.1.blur.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"markLine.data.1.blur.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markLine.data.1.blur.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markLine.data.1.blur.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markLine.data.1.blur.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.1.blur.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.1.blur.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markLine.data.1.blur.lineStyle.curveness":{desc:"\n\n<p>边的曲度,支持从 0 到 1 的值,值越大曲度越大。</p>\n",uiControl:{type:"number",min:"0",max:"1",step:"0.01",default:"0"}},"markLine.data.1.blur.label.show":{desc:"<p>是否显示标签。</p>\n"},"markLine.data.1.blur.label.position":{desc:'<p>标签位置,可选:</p>\n<ul>\n<li><code class="codespan">'start'</code> 线的起始点。</li>\n<li><code class="codespan">'middle'</code> 线的中点。</li>\n<li><code class="codespan">'end'</code> 线的结束点。</li>\n</ul>\n<p>4.7.0 版本起,支持更多标签位置:<code class="codespan">'start'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'end'</code>, <code class="codespan">'insideStartTop'</code>, <code class="codespan">'insideStartBottom'</code>, <code class="codespan">'insideMiddleTop'</code>, <code class="codespan">'insideMiddleBottom'</code>, <code class="codespan">'insideEndTop'</code>, <code class="codespan">'insideEndBottom'</code>。</p>\n<p>其中,<code class="codespan">'insideMiddleBottom'</code> 等同于 <code class="codespan">'middle'</code>。具体位置参见下图。</p>\n<p>文字与线的间距可以通过 <a href="#series-.markLine.label.distance">label.distance</a> 调整。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-markline&reset=1&edit=1" width="800" height="500"><iframe />\n\n'},"markLine.data.1.blur.label.distance":{desc:"<p>标签与线之间的间距。如果是数组,第一项为横向间距,第二项为纵向间距。如果是数字,则表示横向纵向使用相同的间距。</p>\n"},"markLine.data.1.blur.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markLine.animation":{desc:"\n\n<p>是否开启动画。</p>\n",uiControl:{type:"boolean",default:"true",clean:"true"}},"markLine.animationThreshold":{desc:"<p>是否开启动画的阈值,当单个系列显示的图形数量大于这个阈值时会关闭动画。</p>\n"},"markLine.animationDuration":{desc:'\n\n<p>初始动画的时长,支持回调函数,可以通过每个数据返回不同的时长实现更戏剧的初始动画效果:</p>\n<pre><code class="lang-js">animationDuration: function (idx) {\n // 越往后的数据时长越大\n return idx * 100;\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",default:"1000",step:"20",clean:"true"}},"markLine.animationEasing":{desc:'\n\n<p>初始动画的缓动效果。不同的缓动效果可以参考 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=line-easing" target="_blank">缓动示例</a>。</p>\n',uiControl:{type:"enum",options:"linear,quadraticIn,quadraticOut,quadraticInOut,cubicIn,cubicOut,cubicInOut,quarticIn,quarticOut,quarticInOut,quinticIn,quinticOut,quinticInOut,sinusoidalIn,sinusoidalOut,sinusoidalInOut,exponentialIn,exponentialOut,exponentialInOut,circularIn,circularOut,circularInOut,elasticIn,elasticOut,elasticInOut,backIn,backOut,backInOut,bounceIn,bounceOut,bounceInOut",clean:"true"}},"markLine.animationDelay":{desc:'<p>初始动画的延迟,支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的初始动画效果。</p>\n<p>如下示例:</p>\n<pre><code class="lang-js">animationDelay: function (idx) {\n // 越往后的数据延迟越大\n return idx * 100;\n}\n</code></pre>\n<p>也可以看<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-animation-delay" target="_blank">该示例</a></p>\n'},"markLine.animationDurationUpdate":{desc:'\n\n<p>数据更新动画的时长。</p>\n<p>支持回调函数,可以通过每个数据返回不同的时长实现更戏剧的更新动画效果:</p>\n<pre><code class="lang-js">animationDurationUpdate: function (idx) {\n // 越往后的数据时长越大\n return idx * 100;\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",default:"1000",step:"20"}},"markLine.animationEasingUpdate":{desc:"\n\n<p>数据更新动画的缓动效果。</p>\n",uiControl:{type:"enum",options:"linear,quadraticIn,quadraticOut,quadraticInOut,cubicIn,cubicOut,cubicInOut,quarticIn,quarticOut,quarticInOut,quinticIn,quinticOut,quinticInOut,sinusoidalIn,sinusoidalOut,sinusoidalInOut,exponentialIn,exponentialOut,exponentialInOut,circularIn,circularOut,circularInOut,elasticIn,elasticOut,elasticInOut,backIn,backOut,backInOut,bounceIn,bounceOut,bounceInOut"}},"markLine.animationDelayUpdate":{desc:'<p>数据更新动画的延迟,支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的更新动画效果。</p>\n<p>如下示例:</p>\n<pre><code class="lang-js">animationDelayUpdate: function (idx) {\n // 越往后的数据延迟越大\n return idx * 100;\n}\n</code></pre>\n<p>也可以看<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-animation-delay" target="_blank">该示例</a></p>\n'},markArea:{desc:"<p>图表标域,常用于标记图表中某个范围的数据,例如标出某段时间投放了广告。</p>\n"},"markArea.silent":{desc:"\n\n<p>图形是否不响应和触发鼠标事件,默认为 false,即响应和触发鼠标事件。</p>\n",uiControl:{type:"boolean"}},"markArea.label":{desc:"<p>标域文本配置。</p>\n"},"markArea.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markArea.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markArea.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markArea.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markArea.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markArea.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markArea.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markArea.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markArea.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markArea.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markArea.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markArea.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.itemStyle":{desc:"<p>该标域的样式。</p>\n"},"markArea.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markArea.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markArea.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markArea.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markArea.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markArea.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markArea.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markArea.emphasis":{desc:"<p>高亮的标域样式</p>\n"},"markArea.emphasis.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markArea.emphasis.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markArea.emphasis.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markArea.emphasis.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markArea.emphasis.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markArea.emphasis.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.emphasis.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.emphasis.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.emphasis.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.emphasis.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.emphasis.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.emphasis.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.emphasis.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.emphasis.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.emphasis.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.emphasis.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.emphasis.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.emphasis.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.emphasis.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.emphasis.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.emphasis.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.emphasis.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.emphasis.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markArea.emphasis.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markArea.emphasis.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.emphasis.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.emphasis.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.emphasis.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.emphasis.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.emphasis.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.emphasis.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markArea.emphasis.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markArea.emphasis.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markArea.emphasis.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markArea.emphasis.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.emphasis.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.emphasis.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.emphasis.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.emphasis.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.emphasis.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.emphasis.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.emphasis.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.emphasis.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.emphasis.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.emphasis.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.emphasis.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.emphasis.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.emphasis.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.emphasis.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.emphasis.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.emphasis.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.emphasis.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.emphasis.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.emphasis.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.emphasis.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.emphasis.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.emphasis.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.emphasis.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.emphasis.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.emphasis.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markArea.emphasis.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markArea.emphasis.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markArea.emphasis.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markArea.emphasis.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markArea.emphasis.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markArea.emphasis.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.emphasis.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.emphasis.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markArea.blur":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>淡出的标域样式。淡出的规则跟随所在系列。</p>\n'},"markArea.blur.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markArea.blur.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markArea.blur.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markArea.blur.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markArea.blur.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markArea.blur.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.blur.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.blur.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.blur.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.blur.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.blur.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.blur.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.blur.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.blur.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.blur.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.blur.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.blur.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.blur.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.blur.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.blur.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.blur.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.blur.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.blur.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markArea.blur.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markArea.blur.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.blur.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.blur.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.blur.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.blur.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.blur.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.blur.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markArea.blur.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markArea.blur.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markArea.blur.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markArea.blur.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.blur.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.blur.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.blur.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.blur.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.blur.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.blur.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.blur.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.blur.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.blur.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.blur.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.blur.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.blur.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.blur.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.blur.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.blur.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.blur.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.blur.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.blur.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.blur.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.blur.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.blur.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.blur.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.blur.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.blur.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.blur.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markArea.blur.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markArea.blur.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markArea.blur.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markArea.blur.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markArea.blur.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markArea.blur.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.blur.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.blur.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markArea.data":{desc:'<p>标域的数据数组。每个数组项是一个两个项的数组,分别表示标域左上角和右下角的位置,每个项支持通过下面几种方式指定自己的位置</p>\n<ol>\n<li>通过 <a href="#series-funnel.markArea.data.0.x">x</a>, <a href="#series-funnel.markArea.data.0.y">y</a> 属性指定相对容器的屏幕坐标,单位像素,支持百分比。</li>\n</ol>\n<p>当多个属性同时存在时,优先级按上述的顺序。</p>\n<pre><code>data: [\n\n[\n {\n name: '两个屏幕坐标之间的标域',\n x: 100,\n y: 100\n }, {\n x: '90%',\n y: '10%'\n }\n ]\n]\n</code></pre>'},"markArea.data.0":{desc:"<p>标域左上角的数据</p>\n"},"markArea.data.0.name":{desc:"<p>标注名称,将会作为文字显示。</p>\n"},"markArea.data.0.x":{desc:'\n\n<p>相对容器的屏幕 x 坐标,单位像素,支持百分比形式,例如 <code class="codespan">'20%'</code>。</p>\n',uiControl:{type:"percent",default:"0"}},"markArea.data.0.y":{desc:'\n\n<p>相对容器的屏幕 y 坐标,单位像素,支持百分比形式,例如 <code class="codespan">'20%'</code>。</p>\n',uiControl:{type:"percent",default:"0"}},"markArea.data.0.value":{desc:"<p>标域值,可以不设。</p>\n"},"markArea.data.0.itemStyle":{desc:'<p>该数据项区域的样式,起点和终点项的<code class="codespan">itemStyle</code>会合并到一起。</p>\n'},"markArea.data.0.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markArea.data.0.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markArea.data.0.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markArea.data.0.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markArea.data.0.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markArea.data.0.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markArea.data.0.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.0.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.0.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markArea.data.0.label":{desc:'<p>该数据项标签的样式,起点和终点项的<code class="codespan">label</code>会合并到一起。</p>\n'},"markArea.data.0.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markArea.data.0.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markArea.data.0.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markArea.data.0.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markArea.data.0.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markArea.data.0.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.0.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.0.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.0.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.0.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.0.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.0.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.0.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.0.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.0.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.0.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.0.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markArea.data.0.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markArea.data.0.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.0.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.0.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markArea.data.0.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markArea.data.0.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markArea.data.0.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markArea.data.0.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.0.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.0.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.0.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.0.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.0.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.0.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.0.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.0.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.0.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.0.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.0.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.0.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.0.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.0.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.0.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.emphasis.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markArea.data.0.emphasis.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markArea.data.0.emphasis.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markArea.data.0.emphasis.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markArea.data.0.emphasis.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markArea.data.0.emphasis.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markArea.data.0.emphasis.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.0.emphasis.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.0.emphasis.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markArea.data.0.emphasis.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markArea.data.0.emphasis.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markArea.data.0.emphasis.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markArea.data.0.emphasis.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markArea.data.0.emphasis.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markArea.data.0.emphasis.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.0.emphasis.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.0.emphasis.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.0.emphasis.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.0.emphasis.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.0.emphasis.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.0.emphasis.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.0.emphasis.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.0.emphasis.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.emphasis.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.emphasis.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.emphasis.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.0.emphasis.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.0.emphasis.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.0.emphasis.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.emphasis.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.emphasis.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.emphasis.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markArea.data.0.emphasis.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markArea.data.0.emphasis.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.0.emphasis.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.emphasis.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.0.emphasis.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.emphasis.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.emphasis.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.emphasis.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markArea.data.0.emphasis.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markArea.data.0.emphasis.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markArea.data.0.emphasis.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markArea.data.0.emphasis.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.0.emphasis.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.0.emphasis.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.0.emphasis.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.0.emphasis.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.0.emphasis.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.0.emphasis.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.0.emphasis.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.0.emphasis.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.emphasis.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.emphasis.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.emphasis.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.0.emphasis.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.0.emphasis.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.0.emphasis.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.emphasis.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.emphasis.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.emphasis.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.0.emphasis.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.0.emphasis.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.0.emphasis.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.emphasis.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.0.emphasis.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.emphasis.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.emphasis.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.blur":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n'},"markArea.data.0.blur.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markArea.data.0.blur.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markArea.data.0.blur.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markArea.data.0.blur.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markArea.data.0.blur.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markArea.data.0.blur.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markArea.data.0.blur.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.0.blur.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.0.blur.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markArea.data.0.blur.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markArea.data.0.blur.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markArea.data.0.blur.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markArea.data.0.blur.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markArea.data.0.blur.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markArea.data.0.blur.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.0.blur.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.0.blur.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.0.blur.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.0.blur.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.0.blur.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.0.blur.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.0.blur.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.0.blur.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.blur.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.blur.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.blur.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.0.blur.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.0.blur.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.0.blur.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.blur.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.blur.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.blur.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markArea.data.0.blur.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markArea.data.0.blur.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.0.blur.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.blur.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.0.blur.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.blur.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.blur.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.blur.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markArea.data.0.blur.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markArea.data.0.blur.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markArea.data.0.blur.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markArea.data.0.blur.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.0.blur.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.0.blur.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.0.blur.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.0.blur.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.0.blur.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.0.blur.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.0.blur.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.0.blur.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.blur.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.blur.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.blur.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.0.blur.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.0.blur.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.0.blur.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.blur.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.blur.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.blur.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.0.blur.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.0.blur.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.0.blur.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.blur.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.0.blur.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.blur.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.blur.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1":{desc:"<p>标域右下角的数据</p>\n"},"markArea.data.1.name":{desc:"<p>标注名称,将会作为文字显示。</p>\n"},"markArea.data.1.x":{desc:'\n\n<p>相对容器的屏幕 x 坐标,单位像素,支持百分比形式,例如 <code class="codespan">'20%'</code>。</p>\n',uiControl:{type:"percent",default:"0"}},"markArea.data.1.y":{desc:'\n\n<p>相对容器的屏幕 y 坐标,单位像素,支持百分比形式,例如 <code class="codespan">'20%'</code>。</p>\n',uiControl:{type:"percent",default:"0"}},"markArea.data.1.value":{desc:"<p>标域值,可以不设。</p>\n"},"markArea.data.1.itemStyle":{desc:'<p>该数据项区域的样式,起点和终点项的<code class="codespan">itemStyle</code>会合并到一起。</p>\n'},"markArea.data.1.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markArea.data.1.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markArea.data.1.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markArea.data.1.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markArea.data.1.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markArea.data.1.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markArea.data.1.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.1.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.1.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markArea.data.1.label":{desc:'<p>该数据项标签的样式,起点和终点项的<code class="codespan">label</code>会合并到一起。</p>\n'},"markArea.data.1.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markArea.data.1.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markArea.data.1.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markArea.data.1.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markArea.data.1.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markArea.data.1.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.1.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.1.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.1.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.1.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.1.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.1.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.1.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.1.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.1.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.1.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.1.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markArea.data.1.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markArea.data.1.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.1.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.1.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markArea.data.1.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markArea.data.1.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markArea.data.1.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markArea.data.1.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.1.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.1.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.1.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.1.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.1.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.1.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.1.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.1.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.1.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.1.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.1.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.1.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.1.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.1.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.1.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.emphasis.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markArea.data.1.emphasis.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markArea.data.1.emphasis.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markArea.data.1.emphasis.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markArea.data.1.emphasis.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markArea.data.1.emphasis.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markArea.data.1.emphasis.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.1.emphasis.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.1.emphasis.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markArea.data.1.emphasis.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markArea.data.1.emphasis.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markArea.data.1.emphasis.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markArea.data.1.emphasis.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markArea.data.1.emphasis.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markArea.data.1.emphasis.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.1.emphasis.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.1.emphasis.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.1.emphasis.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.1.emphasis.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.1.emphasis.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.1.emphasis.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.1.emphasis.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.1.emphasis.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.emphasis.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.emphasis.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.emphasis.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.1.emphasis.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.1.emphasis.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.1.emphasis.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.emphasis.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.emphasis.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.emphasis.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markArea.data.1.emphasis.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markArea.data.1.emphasis.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.1.emphasis.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.emphasis.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.1.emphasis.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.emphasis.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.emphasis.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.emphasis.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markArea.data.1.emphasis.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markArea.data.1.emphasis.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markArea.data.1.emphasis.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markArea.data.1.emphasis.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.1.emphasis.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.1.emphasis.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.1.emphasis.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.1.emphasis.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.1.emphasis.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.1.emphasis.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.1.emphasis.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.1.emphasis.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.emphasis.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.emphasis.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.emphasis.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.1.emphasis.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.1.emphasis.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.1.emphasis.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.emphasis.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.emphasis.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.emphasis.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.1.emphasis.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.1.emphasis.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.1.emphasis.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.emphasis.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.1.emphasis.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.emphasis.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.emphasis.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.blur":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n'},"markArea.data.1.blur.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markArea.data.1.blur.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markArea.data.1.blur.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markArea.data.1.blur.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markArea.data.1.blur.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markArea.data.1.blur.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markArea.data.1.blur.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.1.blur.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.1.blur.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markArea.data.1.blur.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markArea.data.1.blur.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markArea.data.1.blur.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markArea.data.1.blur.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markArea.data.1.blur.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markArea.data.1.blur.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.1.blur.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.1.blur.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.1.blur.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.1.blur.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.1.blur.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.1.blur.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.1.blur.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.1.blur.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.blur.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.blur.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.blur.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.1.blur.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.1.blur.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.1.blur.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.blur.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.blur.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.blur.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markArea.data.1.blur.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markArea.data.1.blur.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.1.blur.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.blur.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.1.blur.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.blur.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.blur.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.blur.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markArea.data.1.blur.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markArea.data.1.blur.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markArea.data.1.blur.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markArea.data.1.blur.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.1.blur.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.1.blur.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.1.blur.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.1.blur.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.1.blur.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.1.blur.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.1.blur.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.1.blur.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.blur.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.blur.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.blur.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.1.blur.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.1.blur.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.1.blur.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.blur.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.blur.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.blur.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.1.blur.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.1.blur.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.1.blur.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.blur.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.1.blur.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.blur.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.blur.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.animation":{desc:"\n\n<p>是否开启动画。</p>\n",uiControl:{type:"boolean",default:"false",clean:"true"}},"markArea.animationThreshold":{desc:"<p>是否开启动画的阈值,当单个系列显示的图形数量大于这个阈值时会关闭动画。</p>\n"},"markArea.animationDuration":{desc:'\n\n<p>初始动画的时长,支持回调函数,可以通过每个数据返回不同的时长实现更戏剧的初始动画效果:</p>\n<pre><code class="lang-js">animationDuration: function (idx) {\n // 越往后的数据时长越大\n return idx * 100;\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",default:"1000",step:"20",clean:"true"}},"markArea.animationEasing":{desc:'\n\n<p>初始动画的缓动效果。不同的缓动效果可以参考 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=line-easing" target="_blank">缓动示例</a>。</p>\n',uiControl:{type:"enum",options:"linear,quadraticIn,quadraticOut,quadraticInOut,cubicIn,cubicOut,cubicInOut,quarticIn,quarticOut,quarticInOut,quinticIn,quinticOut,quinticInOut,sinusoidalIn,sinusoidalOut,sinusoidalInOut,exponentialIn,exponentialOut,exponentialInOut,circularIn,circularOut,circularInOut,elasticIn,elasticOut,elasticInOut,backIn,backOut,backInOut,bounceIn,bounceOut,bounceInOut",clean:"true"}},"markArea.animationDelay":{desc:'<p>初始动画的延迟,支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的初始动画效果。</p>\n<p>如下示例:</p>\n<pre><code class="lang-js">animationDelay: function (idx) {\n // 越往后的数据延迟越大\n return idx * 100;\n}\n</code></pre>\n<p>也可以看<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-animation-delay" target="_blank">该示例</a></p>\n'},"markArea.animationDurationUpdate":{desc:'\n\n<p>数据更新动画的时长。</p>\n<p>支持回调函数,可以通过每个数据返回不同的时长实现更戏剧的更新动画效果:</p>\n<pre><code class="lang-js">animationDurationUpdate: function (idx) {\n // 越往后的数据时长越大\n return idx * 100;\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",default:"1000",step:"20"}},"markArea.animationEasingUpdate":{desc:"\n\n<p>数据更新动画的缓动效果。</p>\n",uiControl:{type:"enum",options:"linear,quadraticIn,quadraticOut,quadraticInOut,cubicIn,cubicOut,cubicInOut,quarticIn,quarticOut,quarticInOut,quinticIn,quinticOut,quinticInOut,sinusoidalIn,sinusoidalOut,sinusoidalInOut,exponentialIn,exponentialOut,exponentialInOut,circularIn,circularOut,circularInOut,elasticIn,elasticOut,elasticInOut,backIn,backOut,backInOut,bounceIn,bounceOut,bounceInOut"}},"markArea.animationDelayUpdate":{desc:'<p>数据更新动画的延迟,支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的更新动画效果。</p>\n<p>如下示例:</p>\n<pre><code class="lang-js">animationDelayUpdate: function (idx) {\n // 越往后的数据延迟越大\n return idx * 100;\n}\n</code></pre>\n<p>也可以看<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-animation-delay" target="_blank">该示例</a></p>\n'},silent:{desc:"\n\n<p>图形是否不响应和触发鼠标事件,默认为 false,即响应和触发鼠标事件。</p>\n",uiControl:{type:"boolean"}},animation:{desc:"\n\n<p>是否开启动画。</p>\n",uiControl:{type:"boolean",default:"true",clean:"true"}},animationThreshold:{desc:"<p>是否开启动画的阈值,当单个系列显示的图形数量大于这个阈值时会关闭动画。</p>\n"},animationDuration:{desc:'\n\n<p>初始动画的时长,支持回调函数,可以通过每个数据返回不同的时长实现更戏剧的初始动画效果:</p>\n<pre><code class="lang-js">animationDuration: function (idx) {\n // 越往后的数据时长越大\n return idx * 100;\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",default:"1000",step:"20",clean:"true"}},animationEasing:{desc:'\n\n<p>初始动画的缓动效果。不同的缓动效果可以参考 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=line-easing" target="_blank">缓动示例</a>。</p>\n',uiControl:{type:"enum",options:"linear,quadraticIn,quadraticOut,quadraticInOut,cubicIn,cubicOut,cubicInOut,quarticIn,quarticOut,quarticInOut,quinticIn,quinticOut,quinticInOut,sinusoidalIn,sinusoidalOut,sinusoidalInOut,exponentialIn,exponentialOut,exponentialInOut,circularIn,circularOut,circularInOut,elasticIn,elasticOut,elasticInOut,backIn,backOut,backInOut,bounceIn,bounceOut,bounceInOut",clean:"true"}},animationDelay:{desc:'<p>初始动画的延迟,支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的初始动画效果。</p>\n<p>如下示例:</p>\n<pre><code class="lang-js">animationDelay: function (idx) {\n // 越往后的数据延迟越大\n return idx * 100;\n}\n</code></pre>\n<p>也可以看<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-animation-delay" target="_blank">该示例</a></p>\n'},animationDurationUpdate:{desc:'\n\n<p>数据更新动画的时长。</p>\n<p>支持回调函数,可以通过每个数据返回不同的时长实现更戏剧的更新动画效果:</p>\n<pre><code class="lang-js">animationDurationUpdate: function (idx) {\n // 越往后的数据时长越大\n return idx * 100;\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",default:"1000",step:"20"}},animationEasingUpdate:{desc:"\n\n<p>数据更新动画的缓动效果。</p>\n",uiControl:{type:"enum",options:"linear,quadraticIn,quadraticOut,quadraticInOut,cubicIn,cubicOut,cubicInOut,quarticIn,quarticOut,quarticInOut,quinticIn,quinticOut,quinticInOut,sinusoidalIn,sinusoidalOut,sinusoidalInOut,exponentialIn,exponentialOut,exponentialInOut,circularIn,circularOut,circularInOut,elasticIn,elasticOut,elasticInOut,backIn,backOut,backInOut,bounceIn,bounceOut,bounceInOut"}},animationDelayUpdate:{desc:'<p>数据更新动画的延迟,支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的更新动画效果。</p>\n<p>如下示例:</p>\n<pre><code class="lang-js">animationDelayUpdate: function (idx) {\n // 越往后的数据延迟越大\n return idx * 100;\n}\n</code></pre>\n<p>也可以看<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-animation-delay" target="_blank">该示例</a></p>\n'},tooltip:{desc:"<p>本系列特定的 tooltip 设定。</p>\n"},"tooltip.position":{desc:'<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的位置,默认不设置时位置会跟随鼠标的位置。</p>\n<p>可选:</p>\n<ul>\n<li><p><code class="codespan">Array</code></p>\n<p> 通过数组表示提示框浮层的位置,支持数字设置绝对位置,百分比设置相对位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对位置,相对于容器左侧 10px, 上侧 10 px\n position: [10, 10]\n // 相对位置,放置在容器正中间\n position: ['50%', '50%']\n</code></pre>\n</li>\n<li><p><code class="codespan">Function</code></p>\n<p> 回调函数,格式如下:</p>\n<pre><code class="lang-js"> (point: Array, params: Object|Array.<Object>, dom: HTMLDomElement, rect: Object, size: Object) => Array\n</code></pre>\n<p> <strong>参数:</strong><br>\n point: 鼠标位置,如 [20, 40]。<br>\n params: 同 formatter 的参数相同。<br>\n dom: tooltip 的 dom 对象。<br>\n rect: 只有鼠标在图形上时有效,是一个用<code class="codespan">x</code>, <code class="codespan">y</code>, <code class="codespan">width</code>, <code class="codespan">height</code>四个属性表达的图形包围盒。<br>\n size: 包括 dom 的尺寸和 echarts 容器的当前尺寸,例如:<code class="codespan">{contentSize: [width, height], viewSize: [width, height]}</code>。<br></p>\n<p> <strong>返回值:</strong><br>\n 可以是一个表示 tooltip 位置的数组,数组值可以是绝对的像素值,也可以是相 百分比。<br>\n 也可以是一个对象,如:<code class="codespan">{left: 10, top: 30}</code>,或者 <code class="codespan">{right: '20%', bottom: 40}</code>。<br></p>\n<p> 如下示例:</p>\n<pre><code class="lang-js"> position: function (point, params, dom, rect, size) {\n // 固定在顶部\n return [point[0], '10%'];\n }\n</code></pre>\n<p> 或者:</p>\n<pre><code class="lang-js"> position: function (pos, params, dom, rect, size) {\n // 鼠标在左侧时 tooltip 显示到右侧,鼠标在右侧时 tooltip 显示到左侧。\n var obj = {top: 60};\n obj[['left', 'right'][+(pos[0] < size.viewSize[0] / 2)]] = 5;\n return obj;\n }\n</code></pre>\n</li>\n</ul>\n<ul>\n<li><p><code class="codespan">'inside'</code></p>\n<p> 鼠标所在图形的内部中心位置,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'top'</code></p>\n<p> 鼠标所在图形上侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'left'</code></p>\n<p> 鼠标所在图形左侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'right'</code></p>\n<p> 鼠标所在图形右侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'bottom'</code></p>\n<p> 鼠标所在图形底侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n</ul>\n'},"tooltip.formatter":{desc:'<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层内容格式器,支持字符串模板和回调函数两种形式。</p>\n<p><strong>1, 字符串模板</strong></p>\n<p>模板变量有 <code class="codespan">{a}</code>, <code class="codespan">{b}</code>,<code class="codespan">{c}</code>,<code class="codespan">{d}</code>,<code class="codespan">{e}</code>,分别表示系列名,数据名,数据值等。\n在 <a href="#tooltip.trigger">trigger</a> 为 <code class="codespan">'axis'</code> 的时候,会有多个系列的数据,此时可以通过 <code class="codespan">{a0}</code>, <code class="codespan">{a1}</code>, <code class="codespan">{a2}</code> 这种后面加索引的方式表示系列的索引。\n不同图表类型下的 <code class="codespan">{a}</code>,<code class="codespan">{b}</code>,<code class="codespan">{c}</code>,<code class="codespan">{d}</code> 含义不一样。\n其中变量<code class="codespan">{a}</code>, <code class="codespan">{b}</code>, <code class="codespan">{c}</code>, <code class="codespan">{d}</code>在不同图表类型下代表数据含义为:</p>\n<ul>\n<li><p>折线(区域)图、柱状(条形)图、K线图 : <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(类目值),<code class="codespan">{c}</code>(数值), <code class="codespan">{d}</code>(无)</p>\n</li>\n<li><p>散点图(气泡)图 : <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(数据名称),<code class="codespan">{c}</code>(数值数组), <code class="codespan">{d}</code>(无)</p>\n</li>\n<li><p>地图 : <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(区域名称),<code class="codespan">{c}</code>(合并数值), <code class="codespan">{d}</code>(无)</p>\n</li>\n<li><p>饼图、仪表盘、漏斗图: <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(数据项名称),<code class="codespan">{c}</code>(数值), <code class="codespan">{d}</code>(百分比)</p>\n</li>\n</ul>\n<p>更多其它图表模板变量的含义可以见相应的图表的 label.formatter 配置项。</p>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b0}: {c0}<br />{b1}: {c1}'\n</code></pre>\n<p><strong>2, 回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array, ticket: string, callback: (ticket: string, html: string)) => string\n</code></pre>\n<p>第一个参数 <code class="codespan">params</code> 是 formatter 需要的数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n // 饼图的百分比\n percent: number,\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n<p>在 <a href="#tooltip.trigger">trigger</a> 为 <code class="codespan">'axis'</code> 的时候,或者 tooltip 被 <a href="#xAxis.axisPointer">axisPointer</a> 触发的时候,<code class="codespan">params</code> 是多个系列的数据数组。其中每项内容格式同上,并且,</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n<p><strong>注:</strong> ECharts 2.x 使用数组表示各参数的方式不再支持。</p>\n<p>第二个参数 <code class="codespan">ticket</code> 是异步回调标识,配合第三个参数 <code class="codespan">callback</code> 使用。\n第三个参数 <code class="codespan">callback</code> 是异步回调,在提示框浮层内容是异步获取的时候,可以通过 callback 传入上述的 <code class="codespan">ticket</code> 和 <code class="codespan">html</code> 更新提示框浮层内容。</p>\n<p>示例:</p>\n<pre><code class="lang-js">formatter: function (params, ticket, callback) {\n $.get('detail?name=' + params.name, function (content) {\n callback(ticket, toHTML(content));\n });\n return 'Loading';\n}\n</code></pre>\n'},"tooltip.backgroundColor":{desc:'<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的背景颜色。</p>\n'},"tooltip.borderColor":{desc:'\n\n\n\n\n<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的边框颜色。</p>\n',uiControl:{type:"color",default:"#333"}},"tooltip.borderWidth":{desc:'\n\n\n\n\n<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的边框宽。</p>\n',uiControl:{type:"number",default:"0",step:"0.5"}},"tooltip.padding":{desc:'\n\n\n\n\n<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n\n\n<p>提示框浮层内边距,单位px,默认各方向内边距为5,接受数组分别设定上右下左边距。</p>\n<p>使用示例:</p>\n<pre><code class="lang-js">// 设置内边距为 5\npadding: 5\n// 设置上下的内边距为 5,左右的内边距为 10\npadding: [5, 10]\n// 分别设置四个方向的内边距\npadding: [\n 5, // 上\n 10, // 右\n 5, // 下\n 10, // 左\n]\n</code></pre>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"tooltip.textStyle":{desc:'<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的文本样式。</p>\n'},"tooltip.textStyle.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"'#fff'"}},"tooltip.textStyle.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"tooltip.textStyle.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"tooltip.textStyle.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"tooltip.textStyle.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"14",min:"1",step:"1"}},"tooltip.textStyle.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"tooltip.textStyle.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"tooltip.textStyle.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"tooltip.textStyle.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"tooltip.textStyle.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"tooltip.textStyle.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"tooltip.textStyle.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"tooltip.textStyle.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"tooltip.textStyle.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"tooltip.textStyle.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"tooltip.textStyle.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"tooltip.textStyle.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"tooltip.extraCssText":{desc:'<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>额外附加到浮层的 css 样式。如下为浮层添加阴影的示例:</p>\n<pre><code class="lang-js">extraCssText: 'box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);'\n</code></pre>\n'}}),s("gauge",{id:{desc:"<p>组件 ID。默认不指定。指定则可用于在 option 或者 API 中引用组件。</p>\n"},name:{desc:'<p>系列名称,用于<a href="#tooltip">tooltip</a>的显示,<a href="#legend">legend</a> 的图例筛选,在 <code class="codespan">setOption</code> 更新数据和配置项时用于指定对应的系列。</p>\n'},zlevel:{desc:'<p>所有图形的 zlevel 值。</p>\n<p><code class="codespan">zlevel</code>用于 Canvas 分层,不同<code class="codespan">zlevel</code>值的图形会放置在不同的 Canvas 中,Canvas 分层是一种常见的优化手段。我们可以把一些图形变化频繁(例如有动画)的组件设置成一个单独的<code class="codespan">zlevel</code>。需要注意的是过多的 Canvas 会引起内存开销的增大,在手机端上需要谨慎使用以防崩溃。</p>\n<p><code class="codespan">zlevel</code> 大的 Canvas 会放在 <code class="codespan">zlevel</code> 小的 Canvas 的上面。</p>\n'},z:{desc:'<p>组件的所有图形的<code class="codespan">z</code>值。控制图形的前后顺序。<code class="codespan">z</code>值小的图形会被<code class="codespan">z</code>值大的图形覆盖。</p>\n<p><code class="codespan">z</code>相比<code class="codespan">zlevel</code>优先级更低,而且不会创建新的 Canvas。</p>\n'},center:{desc:"\n\n<p>的中心(圆心)坐标,数组的第一项是横坐标,第二项是纵坐标。</p>\n<p>支持设置成百分比,设置成百分比时第一项是相对于容器宽度,第二项是相对于容器高度。</p>\n<p><strong>使用示例:</strong></p>\n<pre><code>// 设置成绝对的像素值\ncenter: [400, 300]\n// 设置成相对的百分比\ncenter: ['50%', '50%']\n</code></pre>",uiControl:{type:"percentvector",dims:"x,y"}},radius:{desc:"\n\n<p>仪表盘半径,可以是相对于容器高宽中较小的一项的一半的百分比,也可以是绝对的数值。</p>\n",uiControl:{type:"percent",default:"75%"}},legendHoverLink:{desc:'\n\n<p>是否启用<a href="#legend">图例</a> hover 时的联动高亮。</p>\n',uiControl:{type:"boolean",default:"true"}},startAngle:{desc:'\n\n<p>仪表盘起始角度。<a href="#series-gauge.center">圆心</a> 正右手侧为<code class="codespan">0</code>度,正上方为<code class="codespan">90</code>度,正左手侧为<code class="codespan">180</code>度。</p>\n',uiControl:{type:"angle",min:"-360",max:"360",default:"225",step:"1"}},endAngle:{desc:"\n\n<p>仪表盘结束角度。</p>\n",uiControl:{type:"angle",min:"-360",max:"360",default:"-45",step:"1"}},clockwise:{desc:"\n\n<p>仪表盘刻度是否是顺时针增长。</p>\n",uiControl:{type:"boolean",default:"true"}},data:{desc:'<p>系列中的数据内容数组。数组项可以为单个数值,如:</p>\n<pre><code class="lang-js">[12, 34, 56, 10, 23]\n</code></pre>\n<p>如果需要在数据中加入其它维度给 <a href="#visualMap">visualMap</a> 组件用来映射到颜色等其它图形属性。每个数据项也可以是数组,如:</p>\n<pre><code class="lang-js">[[12, 14], [34, 50], [56, 30], [10, 15], [23, 10]]\n</code></pre>\n<p>这时候可以将每项数组中的第二个值指定给 <a href="#visualMap">visualMap</a> 组件。</p>\n<p>更多时候我们需要指定每个数据项的名称,这时候需要每个项为一个对象:</p>\n<pre><code class="lang-js">[{\n // 数据项的名称\n name: '数据1',\n // 数据项值8\n value: 10\n}, {\n name: '数据2',\n value: 20\n}]\n</code></pre>\n<p>需要对个别内容指定进行个性化定义时:</p>\n<pre><code class="lang-js">[{\n name: '数据1',\n value: 10\n}, {\n // 数据项名称\n name: '数据2',\n value : 56,\n //自定义特殊 tooltip,仅对该数据项有效\n tooltip:{},\n //自定义特殊itemStyle,仅对该item有效\n itemStyle:{}\n}]\n</code></pre>\n'},"data.title":{desc:"<p>仪表盘标题。</p>\n"},"data.title.show":{desc:"\n\n<p>是否显示标题。</p>\n",uiControl:{type:"boolean",default:"true"}},"data.title.offsetCenter":{desc:"\n\n<p>相对于仪表盘中心的偏移位置,数组第一项是水平方向的偏移,第二项是垂直方向的偏移。可以是绝对的数值,也可以是相对于仪表盘半径的百分比。</p>\n",uiControl:{type:"percentvector",default:"0,20%",dims:"x,y"}},"data.title.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"'#464646'"}},"data.title.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.title.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.title.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.title.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"16",min:"1",step:"1"}},"data.title.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.title.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.title.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"data.title.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.title.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.title.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.title.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.title.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.title.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.title.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.title.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"data.title.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"data.title.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"data.title.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.title.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.title.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.title.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.title.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.title.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"data.title.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"data.title.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"data.title.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"data.title.rich.<style_name>.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"data.title.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.title.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.title.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.title.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.title.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.title.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.title.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.title.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.title.rich.<style_name>.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"data.title.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.title.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.title.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.title.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.title.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.title.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.title.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.title.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.title.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.title.rich.<style_name>.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"data.title.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.title.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.title.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.title.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.title.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.title.valueAnimation":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>是否开启标签的数字动画。</p>\n'},"data.detail":{desc:"<p>仪表盘详情,用于显示数据。</p>\n"},"data.detail.show":{desc:"\n\n<p>是否显示详情。</p>\n",uiControl:{type:"boolean",default:"true"}},"data.detail.color":{desc:'\n\n<p>文本颜色,默认取数值所在的<a href="#series-gauge.axisLine.lineStyle.color">区间的颜色</a>。</p>\n',uiControl:{type:"color"}},"data.detail.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.detail.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.detail.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.detail.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"30",min:"1",step:"1"}},"data.detail.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.detail.backgroundColor":{desc:"\n\n<p>详情背景色。</p>\n",uiControl:{type:"color"}},"data.detail.borderColor":{desc:"\n\n<p>详情边框颜色。</p>\n",uiControl:{type:"color",default:"#ccc"}},"data.detail.borderWidth":{desc:"\n\n<p>详情边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.detail.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.detail.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.detail.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.detail.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.detail.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.detail.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.detail.width":{desc:"\n\n<p>详情宽度。</p>\n",uiControl:{type:"percent",default:"100",min:"0",step:"1"}},"data.detail.height":{desc:"\n\n<p>详情高度。</p>\n",uiControl:{type:"percent",default:"40",min:"0",step:"1"}},"data.detail.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"data.detail.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.detail.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.detail.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.detail.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.detail.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.detail.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"data.detail.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"data.detail.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"data.detail.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"data.detail.rich.<style_name>.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"data.detail.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.detail.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.detail.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.detail.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.detail.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.detail.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.detail.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.detail.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.detail.rich.<style_name>.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"data.detail.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.detail.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.detail.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.detail.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.detail.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.detail.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.detail.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.detail.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.detail.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.detail.rich.<style_name>.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"data.detail.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.detail.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.detail.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.detail.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.detail.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.detail.valueAnimation":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>是否开启标签的数字动画。</p>\n'},"data.detail.offsetCenter":{desc:"\n\n<p>相对于仪表盘中心的偏移位置,数组第一项是水平方向的偏移,第二项是垂直方向的偏移。可以是绝对的数值,也可以是相对于仪表盘半径的百分比。</p>\n",uiControl:{type:"percentvector",default:"0,-40%",dims:"x,y"}},"data.detail.formatter":{desc:'<p>格式化函数或者字符串</p>\n<pre><code class="lang-js">formatter: function (value) {\n return value.toFixed(0);\n}\n</code></pre>\n'},"data.name":{desc:"<p>数据项名称。</p>\n"},"data.value":{desc:"\n\n<p>数据值。</p>\n",uiControl:{type:"number",default:"0",step:"1"}},"data.itemStyle":{desc:"<p>数据项的指针样式。</p>\n"},"data.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"data.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"data.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"data.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"data.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"data.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"data.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"data.itemStyle.decal(Object | 'none')":{desc:'<p>图形的贴花图案,在 <a href="#aria.enabled">aria.enabled</a> 与 <a href="#aria.decal.show">aria.decal.show</a> 都是 <code class="codespan">true</code> 的情况下才生效。</p>\n<p>如果为 <code class="codespan">'none'</code> 表示不使用贴花图案。</p>\n'},"data.itemStyle.decal(Object | 'none').symbol(string|string[]) = 'rect'":{desc:'<p>贴花的图案,如果是 <code class="codespan">string[]</code> 表示循环使用数组中的图案。</p>\n<p>ECharts 提供的标记类型包括</p>\n<p><code class="codespan">'circle'</code>, <code class="codespan">'rect'</code>, <code class="codespan">'roundRect'</code>, <code class="codespan">'triangle'</code>, <code class="codespan">'diamond'</code>, <code class="codespan">'pin'</code>, <code class="codespan">'arrow'</code>, <code class="codespan">'none'</code></p>\n<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>'},"data.itemStyle.decal(Object | 'none').symbolSize":{desc:'<p>取值范围:<code class="codespan">0</code> 到 <code class="codespan">1</code>,表示占图案区域的百分比。</p>\n'},"data.itemStyle.decal(Object | 'none').symbolKeepAspect":{desc:"<p>是否保持图案的长宽比。</p>\n"},"data.itemStyle.decal(Object | 'none').color":{desc:"<p>贴花图案的颜色,建议使用半透明色,这样能叠加在系列本身的颜色上。</p>\n"},"data.itemStyle.decal(Object | 'none').backgroundColor":{desc:"<p>贴花的背景色,将会覆盖在系列本身颜色之上,贴花图案之下。</p>\n"},"data.itemStyle.decal(Object | 'none').dashArrayX(number | number[] | (number | number[])[]) = 5":{desc:'<p>贴花图案的基本模式是在横向和纵向上分别以<code class="codespan">图案 - 空白 - 图案 - 空白 - 图案 - 空白</code>的形式无限循环。通过设置每个图案和空白的长度,可以实现复杂的图案效果。</p>\n<p><code class="codespan">dashArrayX</code> 控制了横向的图案模式。当其值为 <code class="codespan">number</code> 或 <code class="codespan">number[]</code> 类型时,与 <a href="https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-dasharray" target="_blank">SVG stroke-dasharray</a> 类似。</p>\n<ul>\n<li><p>如果是 <code class="codespan">number</code> 类型,表示图案和空白分别是这个值。如 <code class="codespan">5</code> 表示先显示宽度为 5 的图案,然后空 5 像素,再然后显示宽度为 5 的图案……</p>\n</li>\n<li><p>如果是 <code class="codespan">number[]</code> 类型,则表示图案和空白依次为数组值的循环。如:<code class="codespan">[5, 10, 2, 6]</code> 表示图案宽 5 像素,然后空 10 像素,然后图案宽 2 像素,然后空 6 像素,然后图案宽 5 像素……</p>\n</li>\n<li><p>如果是 <code class="codespan">(number | number[])[]</code> 类型,表示每行的图案和空白依次为数组值的循环。如:<code class="codespan">[10, [2, 5]]</code> 表示第一行以图案 10 像素空 10 像素循环,第二行以图案 2 像素空 5 像素循环,第三行以图案 10 像素空 10 像素循环……</p>\n</li>\n</ul>\n<p>可以结合以下的例子理解本接口:</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/aria-decal&edit=1&reset=1" width="700" height="300"><iframe />\n\n'},"data.itemStyle.decal(Object | 'none').dashArrayY(number | number[]) = 5":{desc:'<p>贴花图案的基本模式是在横向和纵向上分别以<code class="codespan">图案 - 空白 - 图案 - 空白 - 图案 - 空白</code>的形式无限循环。通过设置每个图案和空白的长度,可以实现复杂的图案效果。</p>\n<p><code class="codespan">dashArrayY</code> 控制了横向的图案模式。与 <a href="https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-dasharray" target="_blank">SVG stroke-dasharray</a> 类似。</p>\n<ul>\n<li><p>如果是 <code class="codespan">number</code> 类型,表示图案和空白分别是这个值。如 <code class="codespan">5</code> 表示先显示高度为 5 的图案,然后空 5 像素,再然后显示高度为 5 的图案……</p>\n</li>\n<li><p>如果是 <code class="codespan">number[]</code> 类型,则表示图案和空白依次为数组值的循环。如:<code class="codespan">[5, 10, 2, 6]</code> 表示图案高 5 像素,然后空 10 像素,然后图案高 2 像素,然后空 6 像素,然后图案高 5 像素……</p>\n</li>\n</ul>\n<p>可以结合以下的例子理解本接口:</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/aria-decal&edit=1&reset=1" width="700" height="300"><iframe />\n\n'},"data.itemStyle.decal(Object | 'none').rotation":{desc:'<p>图案的整体旋转角度(弧度制),取值范围从 <code class="codespan">-Math.PI</code> 到 <code class="codespan">Math.PI</code>。</p>\n'},"data.itemStyle.decal(Object | 'none').maxTileWidth":{desc:"<p>生成的图案在未重复之前的宽度上限。通常不需要设置该值,当你发现图案在重复的时候出现不连续的接缝时,可以尝试提高该值。</p>\n"},"data.itemStyle.decal(Object | 'none').maxTileHeight":{desc:"<p>生成的图案在未重复之前的高度上限。通常不需要设置该值,当你发现图案在重复的时候出现不连续的接缝时,可以尝试提高该值。</p>\n"},min:{desc:'\n\n<p>最小的数据值,映射到 <a href="#series-gauge.minAngle">minAngle</a>。</p>\n',uiControl:{type:"number",default:"0",step:"1"}},max:{desc:'\n\n<p>最大的数据值,映射到 <a href="#series-gauge.maxAngle">maxAngle</a>。</p>\n',uiControl:{type:"number",default:"100",step:"1"}},splitNumber:{desc:"\n\n<p>仪表盘刻度的分割段数。</p>\n",uiControl:{type:"number",min:"1",default:"10",step:"1"}},axisLine:{desc:"<p>仪表盘轴线相关配置。</p>\n"},"axisLine.show":{desc:"\n\n<p>是否显示仪表盘轴线。</p>\n",uiControl:{type:"boolean",default:"true"}},"axisLine.roundCap":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>是否在两端显示成圆形。</p>\n'},"axisLine.lineStyle":{desc:"<p>仪表盘轴线样式。</p>\n"},"axisLine.lineStyle.color":{desc:'<p>仪表盘的轴线可以被分成不同颜色的多段。每段的结束位置和颜色可以通过一个数组来表示。</p>\n<p>默认取值:</p>\n<pre><code class="lang-js">[[1, '#E6EBF8']]\n</code></pre>\n'},"axisLine.lineStyle.width":{desc:"<p>轴线宽度。</p>\n"},"axisLine.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"axisLine.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"axisLine.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisLine.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisLine.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},progress:{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0</code> 开始支持</p>\n</blockquote>\n<p>展示当前进度。</p>\n'},"progress.show":{desc:"\n\n<p>是否显示进度条。</p>\n",uiControl:{type:"boolean",default:"true"}},"progress.overlap":{desc:"\n\n<p>多组数据时进度条是否重叠。</p>\n",uiControl:{type:"boolean",default:"true"}},"progress.width":{desc:"\n\n<p>进度条宽度。</p>\n",uiControl:{type:"boolean",default:"true"}},"progress.roundCap":{desc:"<p>是否在两端显示成圆形。</p>\n"},"progress.clip":{desc:"<p>是否裁掉超出部分。</p>\n"},"progress.itemStyle":{desc:"<p>进度条样式。</p>\n"},"progress.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"progress.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"progress.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"progress.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"progress.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"progress.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"progress.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"progress.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"progress.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},splitLine:{desc:"<p>分隔线样式。</p>\n"},"splitLine.show":{desc:"\n\n<p>是否显示分隔线。</p>\n",uiControl:{type:"boolean",default:"true"}},"splitLine.length":{desc:"\n\n<p>分隔线线长。支持相对半径的百分比。</p>\n",uiControl:{type:"percent",default:"10",min:"0",step:"0.5"}},"splitLine.distance":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0</code> 开始支持</p>\n</blockquote>\n\n\n<p>分隔线与轴线的距离。</p>\n',uiControl:{type:"number",default:"10",min:"0",step:"0.5"}},"splitLine.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"splitLine.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"3",min:"0",step:"0.5"}},"splitLine.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"splitLine.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"splitLine.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"splitLine.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"splitLine.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"splitLine.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},axisTick:{desc:"<p>刻度样式。</p>\n"},"axisTick.show":{desc:"\n\n<p>是否显示刻度。</p>\n",uiControl:{type:"boolean",default:"true"}},"axisTick.splitNumber":{desc:"\n\n<p>分隔线之间分割的刻度数。</p>\n",uiControl:{type:"number",min:"1",default:"5",step:"1"}},"axisTick.length":{desc:"\n\n<p>刻度线长。支持相对半径的百分比。</p>\n",uiControl:{type:"percent",default:"6",min:"0",step:"0.5"}},"axisTick.distance":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0</code> 开始支持</p>\n</blockquote>\n\n\n<p>刻度线与轴线的距离。</p>\n',uiControl:{type:"number",default:"10",min:"0",step:"0.5"}},"axisTick.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"axisTick.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"axisTick.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"axisTick.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"axisTick.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"axisTick.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisTick.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"axisTick.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},axisLabel:{desc:"<p>刻度标签。</p>\n"},"axisLabel.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"true"}},"axisLabel.distance":{desc:"\n\n<p>标签与刻度线的距离。</p>\n",uiControl:{type:"number",default:"15",min:"0",step:"0.5"}},"axisLabel.formatter":{desc:'<p>刻度标签的内容格式器,支持字符串模板和回调函数两种形式。\n示例:</p>\n<pre><code class="lang-js">// 使用字符串模板,模板变量为刻度默认标签 {value}\nformatter: '{value} kg'\n\n// 使用函数模板,函数参数分别为刻度数值\nformatter: function (value) {\n return value + 'km/h';\n}\n</code></pre>\n'},"axisLabel.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"'#464646'"}},"axisLabel.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"axisLabel.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"axisLabel.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"axisLabel.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"axisLabel.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"axisLabel.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"axisLabel.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"axisLabel.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisLabel.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"axisLabel.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"axisLabel.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"axisLabel.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisLabel.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisLabel.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisLabel.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"axisLabel.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"axisLabel.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"axisLabel.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisLabel.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"axisLabel.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisLabel.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisLabel.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisLabel.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"axisLabel.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"axisLabel.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"axisLabel.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"axisLabel.rich.<style_name>.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"axisLabel.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"axisLabel.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"axisLabel.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"axisLabel.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"axisLabel.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"axisLabel.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"axisLabel.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"axisLabel.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"axisLabel.rich.<style_name>.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"axisLabel.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisLabel.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"axisLabel.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"axisLabel.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"axisLabel.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisLabel.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisLabel.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisLabel.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"axisLabel.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"axisLabel.rich.<style_name>.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"axisLabel.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisLabel.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"axisLabel.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"axisLabel.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"axisLabel.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},pointer:{desc:"<p>仪表盘指针。</p>\n"},"pointer.show":{desc:"\n\n<p>是否显示指针。</p>\n",uiControl:{type:"boolean",default:"true"}},"pointer.icon":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0</code> 开始支持</p>\n</blockquote>\n<p>ECharts 提供的标记类型包括</p>\n<p><code class="codespan">'circle'</code>, <code class="codespan">'rect'</code>, <code class="codespan">'roundRect'</code>, <code class="codespan">'triangle'</code>, <code class="codespan">'diamond'</code>, <code class="codespan">'pin'</code>, <code class="codespan">'arrow'</code>, <code class="codespan">'none'</code></p>\n<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>'},"pointer.offsetCenter":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0</code> 开始支持</p>\n</blockquote>\n\n\n<p>相对于仪表盘中心的偏移位置,数组第一项是水平方向的偏移,第二项是垂直方向的偏移。可以是绝对的数值,也可以是相对于仪表盘半径的百分比。</p>\n',uiControl:{type:"percentvector",default:"0,0",dims:"x,y"}},"pointer.length":{desc:'\n\n<p>指针长度,可以是绝对数值,也可以是相对于<a href="#series-gauge.radius">半径</a>的半分比。</p>\n',uiControl:{type:"percent",default:"60%",min:"0",step:"0.5"}},"pointer.width":{desc:"\n\n<p>指针宽度。</p>\n",uiControl:{type:"number",default:"6",min:"0",step:"0.5"}},"pointer.keepAspect":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0</code> 开始支持</p>\n</blockquote>\n\n\n<p>如果图标是 <code class="codespan">path://</code> 的形式,是否在缩放时保持该图形的长宽比。</p>\n',uiControl:{type:"boolean",default:"false"}},"pointer.itemStyle":{desc:"<p>指针样式。</p>\n"},"pointer.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"pointer.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"pointer.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"pointer.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"pointer.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"pointer.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"pointer.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"pointer.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"pointer.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},anchor:{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0</code> 开始支持</p>\n</blockquote>\n<p>表盘中指针的固定点。</p>\n'},"anchor.show":{desc:"\n\n<p>是否显示固定点。</p>\n",uiControl:{type:"boolean",default:"true"}},"anchor.showAbove":{desc:"\n\n<p>固定点是否显示在指针上面。</p>\n",uiControl:{type:"boolean",default:"false"}},"anchor.size":{desc:"\n\n<p>固定点大小。</p>\n",uiControl:{type:"number",default:"6",min:"0",step:"0.5"}},"anchor.icon":{desc:'<p>ECharts 提供的标记类型包括</p>\n<p><code class="codespan">'circle'</code>, <code class="codespan">'rect'</code>, <code class="codespan">'roundRect'</code>, <code class="codespan">'triangle'</code>, <code class="codespan">'diamond'</code>, <code class="codespan">'pin'</code>, <code class="codespan">'arrow'</code>, <code class="codespan">'none'</code></p>\n<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>'},"anchor.offsetCenter":{desc:"\n\n<p>相对于仪表盘中心的偏移位置,数组第一项是水平方向的偏移,第二项是垂直方向的偏移。可以是绝对的数值,也可以是相对于仪表盘半径的百分比。</p>\n",uiControl:{type:"percentvector",default:"0,0",dims:"x,y"}},"anchor.keepAspect":{desc:'\n\n<p>如果图标是 <code class="codespan">path://</code> 的形式,是否在缩放时保持该图形的长宽比。</p>\n',uiControl:{type:"boolean",default:"false"}},"anchor.itemStyle":{desc:"<p>指针固定点样式。</p>\n"},"anchor.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"anchor.itemStyle.borderColor":{desc:"\n\n<p>固定点边框颜色。</p>\n",uiControl:{type:"color",default:"#5470c6"}},"anchor.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"anchor.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"anchor.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"anchor.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"anchor.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"anchor.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"anchor.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},itemStyle:{desc:"<p>仪表盘指针样式。</p>\n"},"itemStyle.color":{desc:'<p>指针颜色,默认取数值所在的<a href="#series-gauge.axisLine.lineStyle.color">区间的颜色</a>。</p>\n'},"itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"itemStyle.decal(Object | 'none')":{desc:'<p>图形的贴花图案,在 <a href="#aria.enabled">aria.enabled</a> 与 <a href="#aria.decal.show">aria.decal.show</a> 都是 <code class="codespan">true</code> 的情况下才生效。</p>\n<p>如果为 <code class="codespan">'none'</code> 表示不使用贴花图案。</p>\n'},"itemStyle.decal(Object | 'none').symbol(string|string[]) = 'rect'":{desc:'<p>贴花的图案,如果是 <code class="codespan">string[]</code> 表示循环使用数组中的图案。</p>\n<p>ECharts 提供的标记类型包括</p>\n<p><code class="codespan">'circle'</code>, <code class="codespan">'rect'</code>, <code class="codespan">'roundRect'</code>, <code class="codespan">'triangle'</code>, <code class="codespan">'diamond'</code>, <code class="codespan">'pin'</code>, <code class="codespan">'arrow'</code>, <code class="codespan">'none'</code></p>\n<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>'},"itemStyle.decal(Object | 'none').symbolSize":{desc:'<p>取值范围:<code class="codespan">0</code> 到 <code class="codespan">1</code>,表示占图案区域的百分比。</p>\n'},"itemStyle.decal(Object | 'none').symbolKeepAspect":{desc:"<p>是否保持图案的长宽比。</p>\n"},"itemStyle.decal(Object | 'none').color":{desc:"<p>贴花图案的颜色,建议使用半透明色,这样能叠加在系列本身的颜色上。</p>\n"},"itemStyle.decal(Object | 'none').backgroundColor":{desc:"<p>贴花的背景色,将会覆盖在系列本身颜色之上,贴花图案之下。</p>\n"},"itemStyle.decal(Object | 'none').dashArrayX(number | number[] | (number | number[])[]) = 5":{desc:'<p>贴花图案的基本模式是在横向和纵向上分别以<code class="codespan">图案 - 空白 - 图案 - 空白 - 图案 - 空白</code>的形式无限循环。通过设置每个图案和空白的长度,可以实现复杂的图案效果。</p>\n<p><code class="codespan">dashArrayX</code> 控制了横向的图案模式。当其值为 <code class="codespan">number</code> 或 <code class="codespan">number[]</code> 类型时,与 <a href="https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-dasharray" target="_blank">SVG stroke-dasharray</a> 类似。</p>\n<ul>\n<li><p>如果是 <code class="codespan">number</code> 类型,表示图案和空白分别是这个值。如 <code class="codespan">5</code> 表示先显示宽度为 5 的图案,然后空 5 像素,再然后显示宽度为 5 的图案……</p>\n</li>\n<li><p>如果是 <code class="codespan">number[]</code> 类型,则表示图案和空白依次为数组值的循环。如:<code class="codespan">[5, 10, 2, 6]</code> 表示图案宽 5 像素,然后空 10 像素,然后图案宽 2 像素,然后空 6 像素,然后图案宽 5 像素……</p>\n</li>\n<li><p>如果是 <code class="codespan">(number | number[])[]</code> 类型,表示每行的图案和空白依次为数组值的循环。如:<code class="codespan">[10, [2, 5]]</code> 表示第一行以图案 10 像素空 10 像素循环,第二行以图案 2 像素空 5 像素循环,第三行以图案 10 像素空 10 像素循环……</p>\n</li>\n</ul>\n<p>可以结合以下的例子理解本接口:</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/aria-decal&edit=1&reset=1" width="700" height="300"><iframe />\n\n'},"itemStyle.decal(Object | 'none').dashArrayY(number | number[]) = 5":{desc:'<p>贴花图案的基本模式是在横向和纵向上分别以<code class="codespan">图案 - 空白 - 图案 - 空白 - 图案 - 空白</code>的形式无限循环。通过设置每个图案和空白的长度,可以实现复杂的图案效果。</p>\n<p><code class="codespan">dashArrayY</code> 控制了横向的图案模式。与 <a href="https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-dasharray" target="_blank">SVG stroke-dasharray</a> 类似。</p>\n<ul>\n<li><p>如果是 <code class="codespan">number</code> 类型,表示图案和空白分别是这个值。如 <code class="codespan">5</code> 表示先显示高度为 5 的图案,然后空 5 像素,再然后显示高度为 5 的图案……</p>\n</li>\n<li><p>如果是 <code class="codespan">number[]</code> 类型,则表示图案和空白依次为数组值的循环。如:<code class="codespan">[5, 10, 2, 6]</code> 表示图案高 5 像素,然后空 10 像素,然后图案高 2 像素,然后空 6 像素,然后图案高 5 像素……</p>\n</li>\n</ul>\n<p>可以结合以下的例子理解本接口:</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/aria-decal&edit=1&reset=1" width="700" height="300"><iframe />\n\n'},"itemStyle.decal(Object | 'none').rotation":{desc:'<p>图案的整体旋转角度(弧度制),取值范围从 <code class="codespan">-Math.PI</code> 到 <code class="codespan">Math.PI</code>。</p>\n'},"itemStyle.decal(Object | 'none').maxTileWidth":{desc:"<p>生成的图案在未重复之前的宽度上限。通常不需要设置该值,当你发现图案在重复的时候出现不连续的接缝时,可以尝试提高该值。</p>\n"},"itemStyle.decal(Object | 'none').maxTileHeight":{desc:"<p>生成的图案在未重复之前的高度上限。通常不需要设置该值,当你发现图案在重复的时候出现不连续的接缝时,可以尝试提高该值。</p>\n\n"},emphasis:{desc:"<p>高亮的仪表盘指针样式</p>\n"},"emphasis.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"emphasis.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"emphasis.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"emphasis.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"emphasis.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"emphasis.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"emphasis.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"emphasis.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"emphasis.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},title:{desc:"<p>仪表盘标题。</p>\n"},"title.show":{desc:"\n\n<p>是否显示标题。</p>\n",uiControl:{type:"boolean",default:"true"}},"title.offsetCenter":{desc:"\n\n<p>相对于仪表盘中心的偏移位置,数组第一项是水平方向的偏移,第二项是垂直方向的偏移。可以是绝对的数值,也可以是相对于仪表盘半径的百分比。</p>\n",uiControl:{type:"percentvector",default:"0,20%",dims:"x,y"}},"title.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"'#464646'"}},"title.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"title.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"title.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"title.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"16",min:"1",step:"1"}},"title.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"title.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"title.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"title.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"title.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"title.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"title.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"title.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"title.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"title.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"title.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"title.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"title.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"title.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"title.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"title.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"title.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"title.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"title.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"title.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"title.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"title.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"title.rich.<style_name>.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"title.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"title.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"title.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"title.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"title.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"title.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"title.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"title.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"title.rich.<style_name>.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"title.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"title.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"title.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"title.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"title.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"title.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"title.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"title.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"title.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"title.rich.<style_name>.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"title.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"title.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"title.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"title.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"title.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"title.valueAnimation":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>是否开启标签的数字动画。</p>\n'},detail:{desc:"<p>仪表盘详情,用于显示数据。</p>\n"},"detail.show":{desc:"\n\n<p>是否显示详情。</p>\n",uiControl:{type:"boolean",default:"true"}},"detail.color":{desc:'\n\n<p>文本颜色,默认取数值所在的<a href="#series-gauge.axisLine.lineStyle.color">区间的颜色</a>。</p>\n',uiControl:{type:"color"}},"detail.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"detail.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"detail.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"detail.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"30",min:"1",step:"1"}},"detail.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"detail.backgroundColor":{desc:"\n\n<p>详情背景色。</p>\n",uiControl:{type:"color"}},"detail.borderColor":{desc:"\n\n<p>详情边框颜色。</p>\n",uiControl:{type:"color",default:"#ccc"}},"detail.borderWidth":{desc:"\n\n<p>详情边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"detail.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"detail.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"detail.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"detail.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"detail.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"detail.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"detail.width":{desc:"\n\n<p>详情宽度。</p>\n",uiControl:{type:"percent",default:"100",min:"0",step:"1"}},"detail.height":{desc:"\n\n<p>详情高度。</p>\n",uiControl:{type:"percent",default:"40",min:"0",step:"1"}},"detail.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"detail.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"detail.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"detail.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"detail.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"detail.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"detail.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"detail.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"detail.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"detail.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"detail.rich.<style_name>.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"null"}},"detail.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"detail.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"detail.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"detail.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"detail.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"detail.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"detail.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"detail.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n',uiControl:{type:"color",default:"#fff"}},"detail.rich.<style_name>.borderColor":{desc:"\n\n<p>文字块边框颜色。</p>\n",uiControl:{type:"color",default:"#fff"}},"detail.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"detail.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"detail.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"detail.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"detail.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"detail.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"detail.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"detail.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"detail.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"detail.rich.<style_name>.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"detail.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"detail.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"detail.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"detail.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"detail.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"detail.valueAnimation":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>是否开启标签的数字动画。</p>\n'},"detail.offsetCenter":{desc:"\n\n<p>相对于仪表盘中心的偏移位置,数组第一项是水平方向的偏移,第二项是垂直方向的偏移。可以是绝对的数值,也可以是相对于仪表盘半径的百分比。</p>\n",uiControl:{type:"percentvector",default:"0,-40%",dims:"x,y"}},"detail.formatter":{desc:'<p>格式化函数或者字符串</p>\n<pre><code class="lang-js">formatter: function (value) {\n return value.toFixed(0);\n}\n</code></pre>\n'},markPoint:{desc:"<p>图表标注。</p>\n"},"markPoint.symbol":{desc:'\n\n<p>标记的图形。</p>\n<p>ECharts 提供的标记类型包括</p>\n<p><code class="codespan">'circle'</code>, <code class="codespan">'rect'</code>, <code class="codespan">'roundRect'</code>, <code class="codespan">'triangle'</code>, <code class="codespan">'diamond'</code>, <code class="codespan">'pin'</code>, <code class="codespan">'arrow'</code>, <code class="codespan">'none'</code></p>\n<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre><p>如果需要每个数据的图形不一样,可以设置为如下格式的回调函数:</p>\n<pre><code class="lang-js">(value: Array|number, params: Object) => string\n</code></pre>\n<p>其中第一个参数 <code class="codespan">value</code> 为 <a href="#series-gauge.data">data</a> 中的数据值。第二个参数<code class="codespan">params</code> 是其它的数据项参数。</p>\n',uiControl:{type:"icon",default:"circle"}},"markPoint.symbolSize":{desc:'\n\n<p>标记的大小,可以设置成诸如 <code class="codespan">10</code> 这样单一的数字,也可以用数组分开表示宽和高,例如 <code class="codespan">[20, 10]</code> 表示标记宽为<code class="codespan">20</code>,高为<code class="codespan">10</code>。</p>\n<p>如果需要每个数据的图形大小不一样,可以设置为如下格式的回调函数:</p>\n<pre><code class="lang-js">(value: Array|number, params: Object) => number|Array\n</code></pre>\n<p>其中第一个参数 <code class="codespan">value</code> 为 <a href="#series-gauge.data">data</a> 中的数据值。第二个参数<code class="codespan">params</code> 是其它的数据项参数。</p>\n',uiControl:{type:"number",min:"0"}},"markPoint.symbolRotate":{desc:'\n\n<p>标记的旋转角度(而非弧度)。正值表示逆时针旋转。注意在 <code class="codespan">markLine</code> 中当 <code class="codespan">symbol</code> 为 <code class="codespan">'arrow'</code> 时会忽略 <code class="codespan">symbolRotate</code> 强制设置为切线的角度。</p>\n<p>如果需要每个数据的旋转角度不一样,可以设置为如下格式的回调函数:</p>\n<pre><code class="lang-js">(value: Array|number, params: Object) => number\n</code></pre>\n<p>其中第一个参数 <code class="codespan">value</code> 为 <a href="#series-gauge.data">data</a> 中的数据值。第二个参数<code class="codespan">params</code> 是其它的数据项参数。</p>\n<blockquote>\n<p>从 4.8.0 开始支持回调函数。</p>\n</blockquote>\n',uiControl:{type:"angle",min:"-180",max:"180",step:"1"}},"markPoint.symbolKeepAspect":{desc:'\n\n<p>如果 <code class="codespan">symbol</code> 是 <code class="codespan">path://</code> 的形式,是否在缩放时保持该图形的长宽比。</p>\n',uiControl:{type:"boolean",clean:"true"}},"markPoint.symbolOffset":{desc:'\n\n<p>标记相对于原本位置的偏移。默认情况下,标记会居中置放在数据对应的位置,但是如果 symbol 是自定义的矢量路径或者图片,就有可能不希望 symbol 居中。这时候可以使用该配置项配置 symbol 相对于原本居中的偏移,可以是绝对的像素值,也可以是相对的百分比。</p>\n<p>例如 <code class="codespan">[0, '50%']</code> 就是把自己向上移动了一半的位置,在 symbol 图形是气泡的时候可以让图形下端的箭头对准数据点。</p>\n',uiControl:{type:"vector",separate:"true",dims:"x,y"}},"markPoint.silent":{desc:"\n\n<p>图形是否不响应和触发鼠标事件,默认为 false,即响应和触发鼠标事件。</p>\n",uiControl:{type:"boolean"}},"markPoint.label":{desc:"<p>标注的文本。</p>\n"},"markPoint.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"true"}},"markPoint.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markPoint.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markPoint.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markPoint.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markPoint.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {@score}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markPoint.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markPoint.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markPoint.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markPoint.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markPoint.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markPoint.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markPoint.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markPoint.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markPoint.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markPoint.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markPoint.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markPoint.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markPoint.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markPoint.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markPoint.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markPoint.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markPoint.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markPoint.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markPoint.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markPoint.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markPoint.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markPoint.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markPoint.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markPoint.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markPoint.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markPoint.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markPoint.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markPoint.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markPoint.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markPoint.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markPoint.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markPoint.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markPoint.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markPoint.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markPoint.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.itemStyle":{desc:"<p>标注的样式。</p>\n"},"markPoint.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markPoint.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markPoint.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markPoint.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markPoint.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markPoint.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markPoint.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markPoint.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markPoint.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markPoint.emphasis":{desc:"<p>标注的高亮样式。</p>\n"},"markPoint.emphasis.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markPoint.emphasis.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markPoint.emphasis.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markPoint.emphasis.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markPoint.emphasis.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markPoint.emphasis.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {@score}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markPoint.emphasis.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markPoint.emphasis.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markPoint.emphasis.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markPoint.emphasis.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markPoint.emphasis.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markPoint.emphasis.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markPoint.emphasis.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markPoint.emphasis.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markPoint.emphasis.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.emphasis.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.emphasis.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.emphasis.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markPoint.emphasis.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markPoint.emphasis.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markPoint.emphasis.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.emphasis.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.emphasis.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.emphasis.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markPoint.emphasis.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markPoint.emphasis.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markPoint.emphasis.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.emphasis.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markPoint.emphasis.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.emphasis.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.emphasis.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.emphasis.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markPoint.emphasis.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markPoint.emphasis.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markPoint.emphasis.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markPoint.emphasis.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markPoint.emphasis.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markPoint.emphasis.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markPoint.emphasis.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markPoint.emphasis.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markPoint.emphasis.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markPoint.emphasis.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markPoint.emphasis.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markPoint.emphasis.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.emphasis.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.emphasis.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.emphasis.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markPoint.emphasis.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markPoint.emphasis.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markPoint.emphasis.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.emphasis.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.emphasis.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.emphasis.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markPoint.emphasis.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markPoint.emphasis.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markPoint.emphasis.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.emphasis.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markPoint.emphasis.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.emphasis.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.emphasis.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.emphasis.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markPoint.emphasis.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markPoint.emphasis.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markPoint.emphasis.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markPoint.emphasis.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markPoint.emphasis.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markPoint.emphasis.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markPoint.emphasis.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markPoint.emphasis.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markPoint.blur":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>标注的淡出样式。淡出的规则跟随所在系列。</p>\n'},"markPoint.blur.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markPoint.blur.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markPoint.blur.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markPoint.blur.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markPoint.blur.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markPoint.blur.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {@score}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markPoint.blur.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markPoint.blur.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markPoint.blur.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markPoint.blur.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markPoint.blur.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markPoint.blur.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markPoint.blur.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markPoint.blur.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markPoint.blur.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.blur.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.blur.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.blur.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markPoint.blur.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markPoint.blur.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markPoint.blur.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.blur.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.blur.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.blur.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markPoint.blur.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markPoint.blur.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markPoint.blur.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.blur.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markPoint.blur.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.blur.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.blur.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.blur.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markPoint.blur.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markPoint.blur.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markPoint.blur.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markPoint.blur.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markPoint.blur.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markPoint.blur.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markPoint.blur.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markPoint.blur.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markPoint.blur.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markPoint.blur.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markPoint.blur.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markPoint.blur.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.blur.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.blur.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.blur.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markPoint.blur.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markPoint.blur.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markPoint.blur.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.blur.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.blur.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.blur.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markPoint.blur.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markPoint.blur.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markPoint.blur.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.blur.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markPoint.blur.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.blur.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.blur.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.blur.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markPoint.blur.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markPoint.blur.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markPoint.blur.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markPoint.blur.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markPoint.blur.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markPoint.blur.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markPoint.blur.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markPoint.blur.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markPoint.data":{desc:'<p>标注的数据数组。每个数组项是一个对象,有下面几种方式指定标注的位置。</p>\n<ol>\n<li>通过 <a href="#series-gauge.markPoint.data.x">x</a>, <a href="#series-gauge.markPoint.data.y">y</a> 属性指定相对容器的屏幕坐标,单位像素,支持百分比。</li>\n</ol>\n<p>当多个属性同时存在时,优先级按上述的顺序。</p>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">data: [\n\n {\n name: '某个屏幕坐标',\n x: 100,\n y: 100\n }\n]\n</code></pre>\n'},"markPoint.data.name":{desc:"<p>标注名称。</p>\n"},"markPoint.data.x":{desc:"\n\n<p>相对容器的屏幕 x 坐标,单位像素。</p>\n",uiControl:{type:"percent",default:"0"}},"markPoint.data.y":{desc:"\n\n<p>相对容器的屏幕 y 坐标,单位像素。</p>\n",uiControl:{type:"percent",default:"0"}},"markPoint.data.value":{desc:"<p>标注值,可以不设。</p>\n"},"markPoint.data.symbol":{desc:'\n\n<p>标记的图形。</p>\n<p>ECharts 提供的标记类型包括</p>\n<p><code class="codespan">'circle'</code>, <code class="codespan">'rect'</code>, <code class="codespan">'roundRect'</code>, <code class="codespan">'triangle'</code>, <code class="codespan">'diamond'</code>, <code class="codespan">'pin'</code>, <code class="codespan">'arrow'</code>, <code class="codespan">'none'</code></p>\n<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>',uiControl:{type:"icon",default:"circle"}},"markPoint.data.symbolSize":{desc:'\n\n<p>标记的大小,可以设置成诸如 <code class="codespan">10</code> 这样单一的数字,也可以用数组分开表示宽和高,例如 <code class="codespan">[20, 10]</code> 表示标记宽为<code class="codespan">20</code>,高为<code class="codespan">10</code>。</p>\n',uiControl:{type:"number",min:"0"}},"markPoint.data.symbolRotate":{desc:'\n\n<p>标记的旋转角度(而非弧度)。正值表示逆时针旋转。注意在 <code class="codespan">markLine</code> 中当 <code class="codespan">symbol</code> 为 <code class="codespan">'arrow'</code> 时会忽略 <code class="codespan">symbolRotate</code> 强制设置为切线的角度。</p>\n',uiControl:{type:"angle",min:"-180",max:"180",step:"1"}},"markPoint.data.symbolKeepAspect":{desc:'\n\n<p>如果 <code class="codespan">symbol</code> 是 <code class="codespan">path://</code> 的形式,是否在缩放时保持该图形的长宽比。</p>\n',uiControl:{type:"boolean",clean:"true"}},"markPoint.data.symbolOffset":{desc:'\n\n<p>标记相对于原本位置的偏移。默认情况下,标记会居中置放在数据对应的位置,但是如果 symbol 是自定义的矢量路径或者图片,就有可能不希望 symbol 居中。这时候可以使用该配置项配置 symbol 相对于原本居中的偏移,可以是绝对的像素值,也可以是相对的百分比。</p>\n<p>例如 <code class="codespan">[0, '50%']</code> 就是把自己向上移动了一半的位置,在 symbol 图形是气泡的时候可以让图形下端的箭头对准数据点。</p>\n',uiControl:{type:"vector",separate:"true",dims:"x,y"}},"markPoint.data.itemStyle":{desc:"<p>该标注的样式。</p>\n"},"markPoint.data.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markPoint.data.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markPoint.data.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markPoint.data.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markPoint.data.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markPoint.data.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markPoint.data.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markPoint.data.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markPoint.data.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markPoint.data.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markPoint.data.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markPoint.data.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markPoint.data.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markPoint.data.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markPoint.data.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markPoint.data.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markPoint.data.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markPoint.data.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markPoint.data.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markPoint.data.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markPoint.data.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markPoint.data.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markPoint.data.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.data.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.data.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markPoint.data.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markPoint.data.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markPoint.data.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markPoint.data.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markPoint.data.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markPoint.data.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markPoint.data.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markPoint.data.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markPoint.data.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markPoint.data.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markPoint.data.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markPoint.data.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markPoint.data.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markPoint.data.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markPoint.data.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markPoint.data.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markPoint.data.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markPoint.data.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markPoint.data.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.data.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.data.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markPoint.data.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markPoint.data.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markPoint.data.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markPoint.data.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markPoint.data.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markPoint.data.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markPoint.data.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.emphasis.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markPoint.data.emphasis.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markPoint.data.emphasis.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markPoint.data.emphasis.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markPoint.data.emphasis.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markPoint.data.emphasis.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markPoint.data.emphasis.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markPoint.data.emphasis.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markPoint.data.emphasis.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markPoint.data.emphasis.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markPoint.data.emphasis.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markPoint.data.emphasis.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markPoint.data.emphasis.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markPoint.data.emphasis.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.data.emphasis.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.data.emphasis.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.emphasis.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markPoint.data.emphasis.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markPoint.data.emphasis.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markPoint.data.emphasis.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.emphasis.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.emphasis.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.emphasis.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markPoint.data.emphasis.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markPoint.data.emphasis.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markPoint.data.emphasis.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.emphasis.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markPoint.data.emphasis.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.emphasis.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.emphasis.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.emphasis.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markPoint.data.emphasis.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markPoint.data.emphasis.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markPoint.data.emphasis.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markPoint.data.emphasis.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markPoint.data.emphasis.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markPoint.data.emphasis.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markPoint.data.emphasis.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markPoint.data.emphasis.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markPoint.data.emphasis.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markPoint.data.emphasis.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markPoint.data.emphasis.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markPoint.data.emphasis.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.data.emphasis.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markPoint.data.emphasis.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.emphasis.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markPoint.data.emphasis.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markPoint.data.emphasis.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markPoint.data.emphasis.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.emphasis.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.emphasis.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.emphasis.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markPoint.data.emphasis.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markPoint.data.emphasis.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markPoint.data.emphasis.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.emphasis.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markPoint.data.emphasis.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markPoint.data.emphasis.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.emphasis.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markPoint.data.emphasis.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markPoint.data.emphasis.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markPoint.data.emphasis.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markPoint.data.emphasis.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markPoint.data.emphasis.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markPoint.data.emphasis.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markPoint.data.emphasis.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markPoint.data.emphasis.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markPoint.data.emphasis.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markPoint.animation":{desc:"\n\n<p>是否开启动画。</p>\n",uiControl:{type:"boolean",default:"true",clean:"true"}},"markPoint.animationThreshold":{desc:"<p>是否开启动画的阈值,当单个系列显示的图形数量大于这个阈值时会关闭动画。</p>\n"},"markPoint.animationDuration":{desc:'\n\n<p>初始动画的时长,支持回调函数,可以通过每个数据返回不同的时长实现更戏剧的初始动画效果:</p>\n<pre><code class="lang-js">animationDuration: function (idx) {\n // 越往后的数据时长越大\n return idx * 100;\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",default:"1000",step:"20",clean:"true"}},"markPoint.animationEasing":{desc:'\n\n<p>初始动画的缓动效果。不同的缓动效果可以参考 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=line-easing" target="_blank">缓动示例</a>。</p>\n',uiControl:{type:"enum",options:"linear,quadraticIn,quadraticOut,quadraticInOut,cubicIn,cubicOut,cubicInOut,quarticIn,quarticOut,quarticInOut,quinticIn,quinticOut,quinticInOut,sinusoidalIn,sinusoidalOut,sinusoidalInOut,exponentialIn,exponentialOut,exponentialInOut,circularIn,circularOut,circularInOut,elasticIn,elasticOut,elasticInOut,backIn,backOut,backInOut,bounceIn,bounceOut,bounceInOut",clean:"true"}},"markPoint.animationDelay":{desc:'<p>初始动画的延迟,支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的初始动画效果。</p>\n<p>如下示例:</p>\n<pre><code class="lang-js">animationDelay: function (idx) {\n // 越往后的数据延迟越大\n return idx * 100;\n}\n</code></pre>\n<p>也可以看<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-animation-delay" target="_blank">该示例</a></p>\n'},"markPoint.animationDurationUpdate":{desc:'\n\n<p>数据更新动画的时长。</p>\n<p>支持回调函数,可以通过每个数据返回不同的时长实现更戏剧的更新动画效果:</p>\n<pre><code class="lang-js">animationDurationUpdate: function (idx) {\n // 越往后的数据时长越大\n return idx * 100;\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",default:"1000",step:"20"}},"markPoint.animationEasingUpdate":{desc:"\n\n<p>数据更新动画的缓动效果。</p>\n",uiControl:{type:"enum",options:"linear,quadraticIn,quadraticOut,quadraticInOut,cubicIn,cubicOut,cubicInOut,quarticIn,quarticOut,quarticInOut,quinticIn,quinticOut,quinticInOut,sinusoidalIn,sinusoidalOut,sinusoidalInOut,exponentialIn,exponentialOut,exponentialInOut,circularIn,circularOut,circularInOut,elasticIn,elasticOut,elasticInOut,backIn,backOut,backInOut,bounceIn,bounceOut,bounceInOut"}},"markPoint.animationDelayUpdate":{desc:'<p>数据更新动画的延迟,支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的更新动画效果。</p>\n<p>如下示例:</p>\n<pre><code class="lang-js">animationDelayUpdate: function (idx) {\n // 越往后的数据延迟越大\n return idx * 100;\n}\n</code></pre>\n<p>也可以看<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-animation-delay" target="_blank">该示例</a></p>\n'},markLine:{desc:"<p>图表标线。</p>\n"},"markLine.silent":{desc:"\n\n<p>图形是否不响应和触发鼠标事件,默认为 false,即响应和触发鼠标事件。</p>\n",uiControl:{type:"boolean"}},"markLine.symbol":{desc:'<p>标线两端的标记类型,可以是一个数组分别指定两端,也可以是单个统一指定,具体格式见 <a href="#series-gauge.markLine.data.0.symbol">data.symbol</a>。</p>\n'},"markLine.symbolSize":{desc:'<p>标线两端的标记大小,可以是一个数组分别指定两端,也可以是单个统一指定。</p>\n<p><strong>注意:</strong> 这里无法像一般的 <code class="codespan">symbolSize</code> 那样通过数组分别指定高宽。</p>\n'},"markLine.precision":{desc:"<p>标线数值的精度,在显示平均值线的时候有用。</p>\n"},"markLine.label":{desc:"<p>标线的文本。</p>\n"},"markLine.label.show":{desc:"<p>是否显示标签。</p>\n"},"markLine.label.position":{desc:'<p>标签位置,可选:</p>\n<ul>\n<li><code class="codespan">'start'</code> 线的起始点。</li>\n<li><code class="codespan">'middle'</code> 线的中点。</li>\n<li><code class="codespan">'end'</code> 线的结束点。</li>\n</ul>\n<p>4.7.0 版本起,支持更多标签位置:<code class="codespan">'start'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'end'</code>, <code class="codespan">'insideStartTop'</code>, <code class="codespan">'insideStartBottom'</code>, <code class="codespan">'insideMiddleTop'</code>, <code class="codespan">'insideMiddleBottom'</code>, <code class="codespan">'insideEndTop'</code>, <code class="codespan">'insideEndBottom'</code>。</p>\n<p>其中,<code class="codespan">'insideMiddleBottom'</code> 等同于 <code class="codespan">'middle'</code>。具体位置参见下图。</p>\n<p>文字与线的间距可以通过 <a href="#series-.markLine.label.distance">label.distance</a> 调整。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-markline&reset=1&edit=1" width="800" height="500"><iframe />\n\n'},"markLine.label.distance":{desc:"<p>标签与线之间的间距。如果是数组,第一项为横向间距,第二项为纵向间距。如果是数字,则表示横向纵向使用相同的间距。</p>\n"},"markLine.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markLine.lineStyle":{desc:"<p>标线的样式</p>\n"},"markLine.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markLine.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"markLine.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markLine.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markLine.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markLine.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markLine.lineStyle.curveness":{desc:"\n\n<p>边的曲度,支持从 0 到 1 的值,值越大曲度越大。</p>\n",uiControl:{type:"number",min:"0",max:"1",step:"0.01",default:"0"}},"markLine.emphasis":{desc:"<p>标线的高亮样式。</p>\n"},"markLine.emphasis.label.show":{desc:"<p>是否显示标签。</p>\n"},"markLine.emphasis.label.position":{desc:'<p>标签位置,可选:</p>\n<ul>\n<li><code class="codespan">'start'</code> 线的起始点。</li>\n<li><code class="codespan">'middle'</code> 线的中点。</li>\n<li><code class="codespan">'end'</code> 线的结束点。</li>\n</ul>\n<p>4.7.0 版本起,支持更多标签位置:<code class="codespan">'start'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'end'</code>, <code class="codespan">'insideStartTop'</code>, <code class="codespan">'insideStartBottom'</code>, <code class="codespan">'insideMiddleTop'</code>, <code class="codespan">'insideMiddleBottom'</code>, <code class="codespan">'insideEndTop'</code>, <code class="codespan">'insideEndBottom'</code>。</p>\n<p>其中,<code class="codespan">'insideMiddleBottom'</code> 等同于 <code class="codespan">'middle'</code>。具体位置参见下图。</p>\n<p>文字与线的间距可以通过 <a href="#series-.markLine.label.distance">label.distance</a> 调整。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-markline&reset=1&edit=1" width="800" height="500"><iframe />\n\n'},"markLine.emphasis.label.distance":{desc:"<p>标签与线之间的间距。如果是数组,第一项为横向间距,第二项为纵向间距。如果是数字,则表示横向纵向使用相同的间距。</p>\n"},"markLine.emphasis.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markLine.emphasis.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markLine.emphasis.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"markLine.emphasis.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markLine.emphasis.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markLine.emphasis.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markLine.emphasis.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.emphasis.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.emphasis.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markLine.blur":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>标线的淡出样式。淡出的规则跟随所在系列。</p>\n'},"markLine.blur.label.show":{desc:"<p>是否显示标签。</p>\n"},"markLine.blur.label.position":{desc:'<p>标签位置,可选:</p>\n<ul>\n<li><code class="codespan">'start'</code> 线的起始点。</li>\n<li><code class="codespan">'middle'</code> 线的中点。</li>\n<li><code class="codespan">'end'</code> 线的结束点。</li>\n</ul>\n<p>4.7.0 版本起,支持更多标签位置:<code class="codespan">'start'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'end'</code>, <code class="codespan">'insideStartTop'</code>, <code class="codespan">'insideStartBottom'</code>, <code class="codespan">'insideMiddleTop'</code>, <code class="codespan">'insideMiddleBottom'</code>, <code class="codespan">'insideEndTop'</code>, <code class="codespan">'insideEndBottom'</code>。</p>\n<p>其中,<code class="codespan">'insideMiddleBottom'</code> 等同于 <code class="codespan">'middle'</code>。具体位置参见下图。</p>\n<p>文字与线的间距可以通过 <a href="#series-.markLine.label.distance">label.distance</a> 调整。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-markline&reset=1&edit=1" width="800" height="500"><iframe />\n\n'},"markLine.blur.label.distance":{desc:"<p>标签与线之间的间距。如果是数组,第一项为横向间距,第二项为纵向间距。如果是数字,则表示横向纵向使用相同的间距。</p>\n"},"markLine.blur.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markLine.blur.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markLine.blur.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"markLine.blur.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markLine.blur.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markLine.blur.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markLine.blur.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.blur.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.blur.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markLine.data":{desc:'<p>标线的数据数组。每个数组项可以是一个两个值的数组,分别表示线的起点和终点,每一项是一个对象,有下面几种方式指定起点或终点的位置。</p>\n<ol>\n<li>通过 <a href="#series-gauge.markLine.data.0.x">x</a>, <a href="#series-gauge.markLine.data.0.y">y</a> 属性指定相对容器的屏幕坐标,单位像素,支持百分比。</li>\n</ol>\n<p>当多个属性同时存在时,优先级按上述的顺序。</p>\n<pre><code>data: [\n\n[\n {\n name: '两个屏幕坐标之间的标线',\n x: 100,\n y: 100\n },\n {\n x: 500,\n y: 200\n }\n ]\n]\n</code></pre>'},"markLine.data.0":{desc:"<p>起点的数据。</p>\n"},"markLine.data.0.name":{desc:"<p>标注名称,将会作为文字显示。</p>\n"},"markLine.data.0.x":{desc:"\n\n<p>相对容器的屏幕 x 坐标,单位像素。</p>\n",uiControl:{type:"percent",default:"0"}},"markLine.data.0.y":{desc:"\n\n<p>相对容器的屏幕 y 坐标,单位像素。</p>\n",uiControl:{type:"percent",default:"0"}},"markLine.data.0.value":{desc:"<p>标注值,可以不设。</p>\n"},"markLine.data.0.symbol":{desc:'\n\n<p>起点标记的图形。</p>\n<p>ECharts 提供的标记类型包括</p>\n<p><code class="codespan">'circle'</code>, <code class="codespan">'rect'</code>, <code class="codespan">'roundRect'</code>, <code class="codespan">'triangle'</code>, <code class="codespan">'diamond'</code>, <code class="codespan">'pin'</code>, <code class="codespan">'arrow'</code>, <code class="codespan">'none'</code></p>\n<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>',uiControl:{type:"icon",default:"circle"}},"markLine.data.0.symbolSize":{desc:'\n\n<p>起点标记的大小,可以设置成诸如 <code class="codespan">10</code> 这样单一的数字,也可以用数组分开表示宽和高,例如 <code class="codespan">[20, 10]</code> 表示标记宽为<code class="codespan">20</code>,高为<code class="codespan">10</code>。</p>\n',uiControl:{type:"number",min:"0"}},"markLine.data.0.symbolRotate":{desc:'\n\n<p>起点标记的旋转角度(而非弧度)。正值表示逆时针旋转。注意在 <code class="codespan">markLine</code> 中当 <code class="codespan">symbol</code> 为 <code class="codespan">'arrow'</code> 时会忽略 <code class="codespan">symbolRotate</code> 强制设置为切线的角度。</p>\n',uiControl:{type:"angle",min:"-180",max:"180",step:"1"}},"markLine.data.0.symbolKeepAspect":{desc:'\n\n<p>如果 <code class="codespan">symbol</code> 是 <code class="codespan">path://</code> 的形式,是否在缩放时保持该图形的长宽比。</p>\n',uiControl:{type:"boolean",clean:"true"}},"markLine.data.0.symbolOffset":{desc:'\n\n<p>起点标记相对于原本位置的偏移。默认情况下,标记会居中置放在数据对应的位置,但是如果 symbol 是自定义的矢量路径或者图片,就有可能不希望 symbol 居中。这时候可以使用该配置项配置 symbol 相对于原本居中的偏移,可以是绝对的像素值,也可以是相对的百分比。</p>\n<p>例如 <code class="codespan">[0, '50%']</code> 就是把自己向上移动了一半的位置,在 symbol 图形是气泡的时候可以让图形下端的箭头对准数据点。</p>\n',uiControl:{type:"vector",separate:"true",dims:"x,y"}},"markLine.data.0.lineStyle":{desc:'<p>该数据项线的样式,起点和终点项的 <code class="codespan">lineStyle</code>会合并到一起。</p>\n'},"markLine.data.0.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markLine.data.0.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"markLine.data.0.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markLine.data.0.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markLine.data.0.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markLine.data.0.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.0.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.0.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markLine.data.0.lineStyle.curveness":{desc:"\n\n<p>边的曲度,支持从 0 到 1 的值,值越大曲度越大。</p>\n",uiControl:{type:"number",min:"0",max:"1",step:"0.01",default:"0"}},"markLine.data.0.label":{desc:'<p>该数据项标签的样式,起点和终点项的 <code class="codespan">label</code>会合并到一起。</p>\n'},"markLine.data.0.label.show":{desc:"<p>是否显示标签。</p>\n"},"markLine.data.0.label.position":{desc:'<p>标签位置,可选:</p>\n<ul>\n<li><code class="codespan">'start'</code> 线的起始点。</li>\n<li><code class="codespan">'middle'</code> 线的中点。</li>\n<li><code class="codespan">'end'</code> 线的结束点。</li>\n</ul>\n<p>4.7.0 版本起,支持更多标签位置:<code class="codespan">'start'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'end'</code>, <code class="codespan">'insideStartTop'</code>, <code class="codespan">'insideStartBottom'</code>, <code class="codespan">'insideMiddleTop'</code>, <code class="codespan">'insideMiddleBottom'</code>, <code class="codespan">'insideEndTop'</code>, <code class="codespan">'insideEndBottom'</code>。</p>\n<p>其中,<code class="codespan">'insideMiddleBottom'</code> 等同于 <code class="codespan">'middle'</code>。具体位置参见下图。</p>\n<p>文字与线的间距可以通过 <a href="#series-.markLine.label.distance">label.distance</a> 调整。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-markline&reset=1&edit=1" width="800" height="500"><iframe />\n\n'},"markLine.data.0.label.distance":{desc:"<p>标签与线之间的间距。如果是数组,第一项为横向间距,第二项为纵向间距。如果是数字,则表示横向纵向使用相同的间距。</p>\n"},"markLine.data.0.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markLine.data.0.emphasis.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markLine.data.0.emphasis.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"markLine.data.0.emphasis.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markLine.data.0.emphasis.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markLine.data.0.emphasis.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markLine.data.0.emphasis.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.0.emphasis.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.0.emphasis.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markLine.data.0.emphasis.lineStyle.curveness":{desc:"\n\n<p>边的曲度,支持从 0 到 1 的值,值越大曲度越大。</p>\n",uiControl:{type:"number",min:"0",max:"1",step:"0.01",default:"0"}},"markLine.data.0.emphasis.label.show":{desc:"<p>是否显示标签。</p>\n"},"markLine.data.0.emphasis.label.position":{desc:'<p>标签位置,可选:</p>\n<ul>\n<li><code class="codespan">'start'</code> 线的起始点。</li>\n<li><code class="codespan">'middle'</code> 线的中点。</li>\n<li><code class="codespan">'end'</code> 线的结束点。</li>\n</ul>\n<p>4.7.0 版本起,支持更多标签位置:<code class="codespan">'start'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'end'</code>, <code class="codespan">'insideStartTop'</code>, <code class="codespan">'insideStartBottom'</code>, <code class="codespan">'insideMiddleTop'</code>, <code class="codespan">'insideMiddleBottom'</code>, <code class="codespan">'insideEndTop'</code>, <code class="codespan">'insideEndBottom'</code>。</p>\n<p>其中,<code class="codespan">'insideMiddleBottom'</code> 等同于 <code class="codespan">'middle'</code>。具体位置参见下图。</p>\n<p>文字与线的间距可以通过 <a href="#series-.markLine.label.distance">label.distance</a> 调整。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-markline&reset=1&edit=1" width="800" height="500"><iframe />\n\n'},"markLine.data.0.emphasis.label.distance":{desc:"<p>标签与线之间的间距。如果是数组,第一项为横向间距,第二项为纵向间距。如果是数字,则表示横向纵向使用相同的间距。</p>\n"},"markLine.data.0.emphasis.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markLine.data.0.blur":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n'},"markLine.data.0.blur.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markLine.data.0.blur.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"markLine.data.0.blur.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markLine.data.0.blur.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markLine.data.0.blur.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markLine.data.0.blur.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.0.blur.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.0.blur.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markLine.data.0.blur.lineStyle.curveness":{desc:"\n\n<p>边的曲度,支持从 0 到 1 的值,值越大曲度越大。</p>\n",uiControl:{type:"number",min:"0",max:"1",step:"0.01",default:"0"}},"markLine.data.0.blur.label.show":{desc:"<p>是否显示标签。</p>\n"},"markLine.data.0.blur.label.position":{desc:'<p>标签位置,可选:</p>\n<ul>\n<li><code class="codespan">'start'</code> 线的起始点。</li>\n<li><code class="codespan">'middle'</code> 线的中点。</li>\n<li><code class="codespan">'end'</code> 线的结束点。</li>\n</ul>\n<p>4.7.0 版本起,支持更多标签位置:<code class="codespan">'start'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'end'</code>, <code class="codespan">'insideStartTop'</code>, <code class="codespan">'insideStartBottom'</code>, <code class="codespan">'insideMiddleTop'</code>, <code class="codespan">'insideMiddleBottom'</code>, <code class="codespan">'insideEndTop'</code>, <code class="codespan">'insideEndBottom'</code>。</p>\n<p>其中,<code class="codespan">'insideMiddleBottom'</code> 等同于 <code class="codespan">'middle'</code>。具体位置参见下图。</p>\n<p>文字与线的间距可以通过 <a href="#series-.markLine.label.distance">label.distance</a> 调整。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-markline&reset=1&edit=1" width="800" height="500"><iframe />\n\n'},"markLine.data.0.blur.label.distance":{desc:"<p>标签与线之间的间距。如果是数组,第一项为横向间距,第二项为纵向间距。如果是数字,则表示横向纵向使用相同的间距。</p>\n"},"markLine.data.0.blur.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markLine.data.1":{desc:"<p>终点的数据。</p>\n"},"markLine.data.1.name":{desc:"<p>标注名称,将会作为文字显示。</p>\n"},"markLine.data.1.x":{desc:"\n\n<p>相对容器的屏幕 x 坐标,单位像素。</p>\n",uiControl:{type:"percent",default:"0"}},"markLine.data.1.y":{desc:"\n\n<p>相对容器的屏幕 y 坐标,单位像素。</p>\n",uiControl:{type:"percent",default:"0"}},"markLine.data.1.value":{desc:"<p>标注值,可以不设。</p>\n"},"markLine.data.1.symbol":{desc:'\n\n<p>终点标记的图形。</p>\n<p>ECharts 提供的标记类型包括</p>\n<p><code class="codespan">'circle'</code>, <code class="codespan">'rect'</code>, <code class="codespan">'roundRect'</code>, <code class="codespan">'triangle'</code>, <code class="codespan">'diamond'</code>, <code class="codespan">'pin'</code>, <code class="codespan">'arrow'</code>, <code class="codespan">'none'</code></p>\n<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>',uiControl:{type:"icon",default:"circle"}},"markLine.data.1.symbolSize":{desc:'\n\n<p>终点标记的大小,可以设置成诸如 <code class="codespan">10</code> 这样单一的数字,也可以用数组分开表示宽和高,例如 <code class="codespan">[20, 10]</code> 表示标记宽为<code class="codespan">20</code>,高为<code class="codespan">10</code>。</p>\n',uiControl:{type:"number",min:"0"}},"markLine.data.1.symbolRotate":{desc:'\n\n<p>终点标记的旋转角度(而非弧度)。正值表示逆时针旋转。注意在 <code class="codespan">markLine</code> 中当 <code class="codespan">symbol</code> 为 <code class="codespan">'arrow'</code> 时会忽略 <code class="codespan">symbolRotate</code> 强制设置为切线的角度。</p>\n',uiControl:{type:"angle",min:"-180",max:"180",step:"1"}},"markLine.data.1.symbolKeepAspect":{desc:'\n\n<p>如果 <code class="codespan">symbol</code> 是 <code class="codespan">path://</code> 的形式,是否在缩放时保持该图形的长宽比。</p>\n',uiControl:{type:"boolean",clean:"true"}},"markLine.data.1.symbolOffset":{desc:'\n\n<p>终点标记相对于原本位置的偏移。默认情况下,标记会居中置放在数据对应的位置,但是如果 symbol 是自定义的矢量路径或者图片,就有可能不希望 symbol 居中。这时候可以使用该配置项配置 symbol 相对于原本居中的偏移,可以是绝对的像素值,也可以是相对的百分比。</p>\n<p>例如 <code class="codespan">[0, '50%']</code> 就是把自己向上移动了一半的位置,在 symbol 图形是气泡的时候可以让图形下端的箭头对准数据点。</p>\n',uiControl:{type:"vector",separate:"true",dims:"x,y"}},"markLine.data.1.lineStyle":{desc:'<p>该数据项线的样式,起点和终点项的 <code class="codespan">lineStyle</code>会合并到一起。</p>\n'},"markLine.data.1.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markLine.data.1.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"markLine.data.1.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markLine.data.1.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markLine.data.1.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markLine.data.1.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.1.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.1.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markLine.data.1.lineStyle.curveness":{desc:"\n\n<p>边的曲度,支持从 0 到 1 的值,值越大曲度越大。</p>\n",uiControl:{type:"number",min:"0",max:"1",step:"0.01",default:"0"}},"markLine.data.1.label":{desc:'<p>该数据项标签的样式,起点和终点项的 <code class="codespan">label</code>会合并到一起。</p>\n'},"markLine.data.1.label.show":{desc:"<p>是否显示标签。</p>\n"},"markLine.data.1.label.position":{desc:'<p>标签位置,可选:</p>\n<ul>\n<li><code class="codespan">'start'</code> 线的起始点。</li>\n<li><code class="codespan">'middle'</code> 线的中点。</li>\n<li><code class="codespan">'end'</code> 线的结束点。</li>\n</ul>\n<p>4.7.0 版本起,支持更多标签位置:<code class="codespan">'start'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'end'</code>, <code class="codespan">'insideStartTop'</code>, <code class="codespan">'insideStartBottom'</code>, <code class="codespan">'insideMiddleTop'</code>, <code class="codespan">'insideMiddleBottom'</code>, <code class="codespan">'insideEndTop'</code>, <code class="codespan">'insideEndBottom'</code>。</p>\n<p>其中,<code class="codespan">'insideMiddleBottom'</code> 等同于 <code class="codespan">'middle'</code>。具体位置参见下图。</p>\n<p>文字与线的间距可以通过 <a href="#series-.markLine.label.distance">label.distance</a> 调整。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-markline&reset=1&edit=1" width="800" height="500"><iframe />\n\n'},"markLine.data.1.label.distance":{desc:"<p>标签与线之间的间距。如果是数组,第一项为横向间距,第二项为纵向间距。如果是数字,则表示横向纵向使用相同的间距。</p>\n"},"markLine.data.1.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markLine.data.1.emphasis.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markLine.data.1.emphasis.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"markLine.data.1.emphasis.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markLine.data.1.emphasis.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markLine.data.1.emphasis.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markLine.data.1.emphasis.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.1.emphasis.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.1.emphasis.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markLine.data.1.emphasis.lineStyle.curveness":{desc:"\n\n<p>边的曲度,支持从 0 到 1 的值,值越大曲度越大。</p>\n",uiControl:{type:"number",min:"0",max:"1",step:"0.01",default:"0"}},"markLine.data.1.emphasis.label.show":{desc:"<p>是否显示标签。</p>\n"},"markLine.data.1.emphasis.label.position":{desc:'<p>标签位置,可选:</p>\n<ul>\n<li><code class="codespan">'start'</code> 线的起始点。</li>\n<li><code class="codespan">'middle'</code> 线的中点。</li>\n<li><code class="codespan">'end'</code> 线的结束点。</li>\n</ul>\n<p>4.7.0 版本起,支持更多标签位置:<code class="codespan">'start'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'end'</code>, <code class="codespan">'insideStartTop'</code>, <code class="codespan">'insideStartBottom'</code>, <code class="codespan">'insideMiddleTop'</code>, <code class="codespan">'insideMiddleBottom'</code>, <code class="codespan">'insideEndTop'</code>, <code class="codespan">'insideEndBottom'</code>。</p>\n<p>其中,<code class="codespan">'insideMiddleBottom'</code> 等同于 <code class="codespan">'middle'</code>。具体位置参见下图。</p>\n<p>文字与线的间距可以通过 <a href="#series-.markLine.label.distance">label.distance</a> 调整。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-markline&reset=1&edit=1" width="800" height="500"><iframe />\n\n'},"markLine.data.1.emphasis.label.distance":{desc:"<p>标签与线之间的间距。如果是数组,第一项为横向间距,第二项为纵向间距。如果是数字,则表示横向纵向使用相同的间距。</p>\n"},"markLine.data.1.emphasis.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markLine.data.1.blur":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n'},"markLine.data.1.blur.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markLine.data.1.blur.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"markLine.data.1.blur.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markLine.data.1.blur.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markLine.data.1.blur.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markLine.data.1.blur.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.1.blur.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markLine.data.1.blur.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markLine.data.1.blur.lineStyle.curveness":{desc:"\n\n<p>边的曲度,支持从 0 到 1 的值,值越大曲度越大。</p>\n",uiControl:{type:"number",min:"0",max:"1",step:"0.01",default:"0"}},"markLine.data.1.blur.label.show":{desc:"<p>是否显示标签。</p>\n"},"markLine.data.1.blur.label.position":{desc:'<p>标签位置,可选:</p>\n<ul>\n<li><code class="codespan">'start'</code> 线的起始点。</li>\n<li><code class="codespan">'middle'</code> 线的中点。</li>\n<li><code class="codespan">'end'</code> 线的结束点。</li>\n</ul>\n<p>4.7.0 版本起,支持更多标签位置:<code class="codespan">'start'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'end'</code>, <code class="codespan">'insideStartTop'</code>, <code class="codespan">'insideStartBottom'</code>, <code class="codespan">'insideMiddleTop'</code>, <code class="codespan">'insideMiddleBottom'</code>, <code class="codespan">'insideEndTop'</code>, <code class="codespan">'insideEndBottom'</code>。</p>\n<p>其中,<code class="codespan">'insideMiddleBottom'</code> 等同于 <code class="codespan">'middle'</code>。具体位置参见下图。</p>\n<p>文字与线的间距可以通过 <a href="#series-.markLine.label.distance">label.distance</a> 调整。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-markline&reset=1&edit=1" width="800" height="500"><iframe />\n\n'},"markLine.data.1.blur.label.distance":{desc:"<p>标签与线之间的间距。如果是数组,第一项为横向间距,第二项为纵向间距。如果是数字,则表示横向纵向使用相同的间距。</p>\n"},"markLine.data.1.blur.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong></p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{d}</code>:百分比。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {d}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"markLine.animation":{desc:"\n\n<p>是否开启动画。</p>\n",uiControl:{type:"boolean",default:"true",clean:"true"}},"markLine.animationThreshold":{desc:"<p>是否开启动画的阈值,当单个系列显示的图形数量大于这个阈值时会关闭动画。</p>\n"},"markLine.animationDuration":{desc:'\n\n<p>初始动画的时长,支持回调函数,可以通过每个数据返回不同的时长实现更戏剧的初始动画效果:</p>\n<pre><code class="lang-js">animationDuration: function (idx) {\n // 越往后的数据时长越大\n return idx * 100;\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",default:"1000",step:"20",clean:"true"}},"markLine.animationEasing":{desc:'\n\n<p>初始动画的缓动效果。不同的缓动效果可以参考 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=line-easing" target="_blank">缓动示例</a>。</p>\n',uiControl:{type:"enum",options:"linear,quadraticIn,quadraticOut,quadraticInOut,cubicIn,cubicOut,cubicInOut,quarticIn,quarticOut,quarticInOut,quinticIn,quinticOut,quinticInOut,sinusoidalIn,sinusoidalOut,sinusoidalInOut,exponentialIn,exponentialOut,exponentialInOut,circularIn,circularOut,circularInOut,elasticIn,elasticOut,elasticInOut,backIn,backOut,backInOut,bounceIn,bounceOut,bounceInOut",clean:"true"}},"markLine.animationDelay":{desc:'<p>初始动画的延迟,支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的初始动画效果。</p>\n<p>如下示例:</p>\n<pre><code class="lang-js">animationDelay: function (idx) {\n // 越往后的数据延迟越大\n return idx * 100;\n}\n</code></pre>\n<p>也可以看<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-animation-delay" target="_blank">该示例</a></p>\n'},"markLine.animationDurationUpdate":{desc:'\n\n<p>数据更新动画的时长。</p>\n<p>支持回调函数,可以通过每个数据返回不同的时长实现更戏剧的更新动画效果:</p>\n<pre><code class="lang-js">animationDurationUpdate: function (idx) {\n // 越往后的数据时长越大\n return idx * 100;\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",default:"1000",step:"20"}},"markLine.animationEasingUpdate":{desc:"\n\n<p>数据更新动画的缓动效果。</p>\n",uiControl:{type:"enum",options:"linear,quadraticIn,quadraticOut,quadraticInOut,cubicIn,cubicOut,cubicInOut,quarticIn,quarticOut,quarticInOut,quinticIn,quinticOut,quinticInOut,sinusoidalIn,sinusoidalOut,sinusoidalInOut,exponentialIn,exponentialOut,exponentialInOut,circularIn,circularOut,circularInOut,elasticIn,elasticOut,elasticInOut,backIn,backOut,backInOut,bounceIn,bounceOut,bounceInOut"}},"markLine.animationDelayUpdate":{desc:'<p>数据更新动画的延迟,支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的更新动画效果。</p>\n<p>如下示例:</p>\n<pre><code class="lang-js">animationDelayUpdate: function (idx) {\n // 越往后的数据延迟越大\n return idx * 100;\n}\n</code></pre>\n<p>也可以看<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-animation-delay" target="_blank">该示例</a></p>\n'},markArea:{desc:"<p>图表标域,常用于标记图表中某个范围的数据,例如标出某段时间投放了广告。</p>\n"},"markArea.silent":{desc:"\n\n<p>图形是否不响应和触发鼠标事件,默认为 false,即响应和触发鼠标事件。</p>\n",uiControl:{type:"boolean"}},"markArea.label":{desc:"<p>标域文本配置。</p>\n"},"markArea.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markArea.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markArea.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markArea.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markArea.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markArea.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markArea.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markArea.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markArea.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markArea.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markArea.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markArea.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.itemStyle":{desc:"<p>该标域的样式。</p>\n"},"markArea.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markArea.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markArea.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markArea.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markArea.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markArea.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markArea.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markArea.emphasis":{desc:"<p>高亮的标域样式</p>\n"},"markArea.emphasis.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markArea.emphasis.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markArea.emphasis.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markArea.emphasis.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markArea.emphasis.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markArea.emphasis.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.emphasis.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.emphasis.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.emphasis.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.emphasis.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.emphasis.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.emphasis.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.emphasis.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.emphasis.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.emphasis.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.emphasis.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.emphasis.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.emphasis.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.emphasis.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.emphasis.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.emphasis.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.emphasis.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.emphasis.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markArea.emphasis.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markArea.emphasis.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.emphasis.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.emphasis.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.emphasis.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.emphasis.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.emphasis.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.emphasis.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markArea.emphasis.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markArea.emphasis.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markArea.emphasis.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markArea.emphasis.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.emphasis.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.emphasis.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.emphasis.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.emphasis.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.emphasis.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.emphasis.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.emphasis.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.emphasis.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.emphasis.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.emphasis.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.emphasis.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.emphasis.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.emphasis.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.emphasis.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.emphasis.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.emphasis.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.emphasis.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.emphasis.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.emphasis.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.emphasis.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.emphasis.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.emphasis.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.emphasis.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.emphasis.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.emphasis.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markArea.emphasis.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markArea.emphasis.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markArea.emphasis.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markArea.emphasis.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markArea.emphasis.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markArea.emphasis.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.emphasis.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.emphasis.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markArea.blur":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>淡出的标域样式。淡出的规则跟随所在系列。</p>\n'},"markArea.blur.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markArea.blur.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markArea.blur.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markArea.blur.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markArea.blur.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markArea.blur.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.blur.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.blur.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.blur.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.blur.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.blur.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.blur.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.blur.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.blur.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.blur.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.blur.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.blur.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.blur.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.blur.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.blur.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.blur.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.blur.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.blur.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markArea.blur.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markArea.blur.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.blur.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.blur.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.blur.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.blur.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.blur.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.blur.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markArea.blur.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markArea.blur.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markArea.blur.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markArea.blur.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.blur.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.blur.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.blur.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.blur.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.blur.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.blur.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.blur.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.blur.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.blur.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.blur.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.blur.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.blur.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.blur.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.blur.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.blur.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.blur.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.blur.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.blur.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.blur.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.blur.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.blur.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.blur.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.blur.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.blur.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.blur.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markArea.blur.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markArea.blur.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markArea.blur.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markArea.blur.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markArea.blur.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markArea.blur.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.blur.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.blur.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markArea.data":{desc:'<p>标域的数据数组。每个数组项是一个两个项的数组,分别表示标域左上角和右下角的位置,每个项支持通过下面几种方式指定自己的位置</p>\n<ol>\n<li>通过 <a href="#series-gauge.markArea.data.0.x">x</a>, <a href="#series-gauge.markArea.data.0.y">y</a> 属性指定相对容器的屏幕坐标,单位像素,支持百分比。</li>\n</ol>\n<p>当多个属性同时存在时,优先级按上述的顺序。</p>\n<pre><code>data: [\n\n[\n {\n name: '两个屏幕坐标之间的标域',\n x: 100,\n y: 100\n }, {\n x: '90%',\n y: '10%'\n }\n ]\n]\n</code></pre>'},"markArea.data.0":{desc:"<p>标域左上角的数据</p>\n"},"markArea.data.0.name":{desc:"<p>标注名称,将会作为文字显示。</p>\n"},"markArea.data.0.x":{desc:'\n\n<p>相对容器的屏幕 x 坐标,单位像素,支持百分比形式,例如 <code class="codespan">'20%'</code>。</p>\n',uiControl:{type:"percent",default:"0"}},"markArea.data.0.y":{desc:'\n\n<p>相对容器的屏幕 y 坐标,单位像素,支持百分比形式,例如 <code class="codespan">'20%'</code>。</p>\n',uiControl:{type:"percent",default:"0"}},"markArea.data.0.value":{desc:"<p>标域值,可以不设。</p>\n"},"markArea.data.0.itemStyle":{desc:'<p>该数据项区域的样式,起点和终点项的<code class="codespan">itemStyle</code>会合并到一起。</p>\n'},"markArea.data.0.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markArea.data.0.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markArea.data.0.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markArea.data.0.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markArea.data.0.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markArea.data.0.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markArea.data.0.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.0.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.0.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markArea.data.0.label":{desc:'<p>该数据项标签的样式,起点和终点项的<code class="codespan">label</code>会合并到一起。</p>\n'},"markArea.data.0.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markArea.data.0.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markArea.data.0.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markArea.data.0.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markArea.data.0.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markArea.data.0.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.0.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.0.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.0.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.0.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.0.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.0.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.0.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.0.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.0.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.0.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.0.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markArea.data.0.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markArea.data.0.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.0.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.0.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markArea.data.0.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markArea.data.0.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markArea.data.0.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markArea.data.0.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.0.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.0.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.0.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.0.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.0.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.0.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.0.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.0.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.0.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.0.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.0.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.0.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.0.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.0.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.0.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.emphasis.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markArea.data.0.emphasis.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markArea.data.0.emphasis.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markArea.data.0.emphasis.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markArea.data.0.emphasis.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markArea.data.0.emphasis.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markArea.data.0.emphasis.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.0.emphasis.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.0.emphasis.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markArea.data.0.emphasis.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markArea.data.0.emphasis.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markArea.data.0.emphasis.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markArea.data.0.emphasis.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markArea.data.0.emphasis.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markArea.data.0.emphasis.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.0.emphasis.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.0.emphasis.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.0.emphasis.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.0.emphasis.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.0.emphasis.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.0.emphasis.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.0.emphasis.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.0.emphasis.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.emphasis.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.emphasis.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.emphasis.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.0.emphasis.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.0.emphasis.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.0.emphasis.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.emphasis.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.emphasis.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.emphasis.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markArea.data.0.emphasis.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markArea.data.0.emphasis.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.0.emphasis.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.emphasis.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.0.emphasis.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.emphasis.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.emphasis.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.emphasis.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markArea.data.0.emphasis.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markArea.data.0.emphasis.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markArea.data.0.emphasis.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markArea.data.0.emphasis.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.0.emphasis.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.0.emphasis.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.0.emphasis.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.0.emphasis.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.0.emphasis.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.0.emphasis.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.0.emphasis.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.0.emphasis.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.emphasis.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.emphasis.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.emphasis.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.0.emphasis.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.0.emphasis.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.0.emphasis.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.emphasis.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.emphasis.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.emphasis.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.0.emphasis.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.0.emphasis.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.0.emphasis.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.emphasis.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.0.emphasis.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.emphasis.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.emphasis.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.blur":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n'},"markArea.data.0.blur.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markArea.data.0.blur.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markArea.data.0.blur.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markArea.data.0.blur.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markArea.data.0.blur.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markArea.data.0.blur.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markArea.data.0.blur.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.0.blur.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.0.blur.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markArea.data.0.blur.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markArea.data.0.blur.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markArea.data.0.blur.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markArea.data.0.blur.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markArea.data.0.blur.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markArea.data.0.blur.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.0.blur.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.0.blur.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.0.blur.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.0.blur.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.0.blur.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.0.blur.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.0.blur.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.0.blur.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.blur.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.blur.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.blur.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.0.blur.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.0.blur.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.0.blur.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.blur.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.blur.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.blur.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markArea.data.0.blur.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markArea.data.0.blur.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.0.blur.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.blur.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.0.blur.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.blur.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.blur.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.blur.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markArea.data.0.blur.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markArea.data.0.blur.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markArea.data.0.blur.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markArea.data.0.blur.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.0.blur.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.0.blur.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.0.blur.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.0.blur.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.0.blur.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.0.blur.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.0.blur.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.0.blur.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.blur.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.0.blur.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.blur.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.0.blur.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.0.blur.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.0.blur.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.blur.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.blur.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.blur.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.0.blur.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.0.blur.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.0.blur.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.blur.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.0.blur.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.0.blur.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.0.blur.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1":{desc:"<p>标域右下角的数据</p>\n"},"markArea.data.1.name":{desc:"<p>标注名称,将会作为文字显示。</p>\n"},"markArea.data.1.x":{desc:'\n\n<p>相对容器的屏幕 x 坐标,单位像素,支持百分比形式,例如 <code class="codespan">'20%'</code>。</p>\n',uiControl:{type:"percent",default:"0"}},"markArea.data.1.y":{desc:'\n\n<p>相对容器的屏幕 y 坐标,单位像素,支持百分比形式,例如 <code class="codespan">'20%'</code>。</p>\n',uiControl:{type:"percent",default:"0"}},"markArea.data.1.value":{desc:"<p>标域值,可以不设。</p>\n"},"markArea.data.1.itemStyle":{desc:'<p>该数据项区域的样式,起点和终点项的<code class="codespan">itemStyle</code>会合并到一起。</p>\n'},"markArea.data.1.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markArea.data.1.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markArea.data.1.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markArea.data.1.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markArea.data.1.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markArea.data.1.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markArea.data.1.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.1.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.1.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markArea.data.1.label":{desc:'<p>该数据项标签的样式,起点和终点项的<code class="codespan">label</code>会合并到一起。</p>\n'},"markArea.data.1.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markArea.data.1.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markArea.data.1.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markArea.data.1.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markArea.data.1.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markArea.data.1.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.1.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.1.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.1.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.1.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.1.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.1.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.1.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.1.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.1.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.1.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.1.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markArea.data.1.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markArea.data.1.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.1.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.1.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markArea.data.1.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markArea.data.1.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markArea.data.1.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markArea.data.1.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.1.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.1.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.1.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.1.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.1.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.1.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.1.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.1.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.1.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.1.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.1.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.1.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.1.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.1.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.1.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.emphasis.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markArea.data.1.emphasis.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markArea.data.1.emphasis.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markArea.data.1.emphasis.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markArea.data.1.emphasis.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markArea.data.1.emphasis.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markArea.data.1.emphasis.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.1.emphasis.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.1.emphasis.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markArea.data.1.emphasis.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markArea.data.1.emphasis.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markArea.data.1.emphasis.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markArea.data.1.emphasis.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markArea.data.1.emphasis.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markArea.data.1.emphasis.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.1.emphasis.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.1.emphasis.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.1.emphasis.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.1.emphasis.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.1.emphasis.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.1.emphasis.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.1.emphasis.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.1.emphasis.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.emphasis.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.emphasis.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.emphasis.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.1.emphasis.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.1.emphasis.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.1.emphasis.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.emphasis.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.emphasis.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.emphasis.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markArea.data.1.emphasis.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markArea.data.1.emphasis.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.1.emphasis.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.emphasis.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.1.emphasis.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.emphasis.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.emphasis.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.emphasis.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markArea.data.1.emphasis.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markArea.data.1.emphasis.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markArea.data.1.emphasis.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markArea.data.1.emphasis.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.1.emphasis.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.1.emphasis.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.1.emphasis.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.1.emphasis.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.1.emphasis.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.1.emphasis.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.1.emphasis.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.1.emphasis.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.emphasis.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.emphasis.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.emphasis.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.1.emphasis.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.1.emphasis.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.1.emphasis.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.emphasis.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.emphasis.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.emphasis.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.1.emphasis.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.1.emphasis.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.1.emphasis.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.emphasis.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.1.emphasis.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.emphasis.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.emphasis.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.blur":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n'},"markArea.data.1.blur.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"markArea.data.1.blur.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"markArea.data.1.blur.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"markArea.data.1.blur.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"markArea.data.1.blur.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"markArea.data.1.blur.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"markArea.data.1.blur.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.1.blur.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"markArea.data.1.blur.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"markArea.data.1.blur.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"markArea.data.1.blur.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"markArea.data.1.blur.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"markArea.data.1.blur.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"markArea.data.1.blur.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"markArea.data.1.blur.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.1.blur.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.1.blur.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.1.blur.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.1.blur.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.1.blur.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.1.blur.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.1.blur.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.1.blur.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.blur.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.blur.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.blur.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.1.blur.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.1.blur.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.1.blur.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.blur.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.blur.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.blur.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"markArea.data.1.blur.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"markArea.data.1.blur.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.1.blur.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.blur.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.1.blur.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.blur.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.blur.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.blur.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"markArea.data.1.blur.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"markArea.data.1.blur.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"markArea.data.1.blur.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"markArea.data.1.blur.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"markArea.data.1.blur.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"markArea.data.1.blur.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"markArea.data.1.blur.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"markArea.data.1.blur.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"markArea.data.1.blur.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"markArea.data.1.blur.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"markArea.data.1.blur.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"markArea.data.1.blur.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.blur.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"markArea.data.1.blur.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.blur.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"markArea.data.1.blur.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"markArea.data.1.blur.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"markArea.data.1.blur.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.blur.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.blur.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.blur.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.1.blur.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"markArea.data.1.blur.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"markArea.data.1.blur.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.blur.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"markArea.data.1.blur.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"markArea.data.1.blur.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.data.1.blur.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"markArea.animation":{desc:"\n\n<p>是否开启动画。</p>\n",uiControl:{type:"boolean",default:"false",clean:"true"}},"markArea.animationThreshold":{desc:"<p>是否开启动画的阈值,当单个系列显示的图形数量大于这个阈值时会关闭动画。</p>\n"},"markArea.animationDuration":{desc:'\n\n<p>初始动画的时长,支持回调函数,可以通过每个数据返回不同的时长实现更戏剧的初始动画效果:</p>\n<pre><code class="lang-js">animationDuration: function (idx) {\n // 越往后的数据时长越大\n return idx * 100;\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",default:"1000",step:"20",clean:"true"}},"markArea.animationEasing":{desc:'\n\n<p>初始动画的缓动效果。不同的缓动效果可以参考 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=line-easing" target="_blank">缓动示例</a>。</p>\n',uiControl:{type:"enum",options:"linear,quadraticIn,quadraticOut,quadraticInOut,cubicIn,cubicOut,cubicInOut,quarticIn,quarticOut,quarticInOut,quinticIn,quinticOut,quinticInOut,sinusoidalIn,sinusoidalOut,sinusoidalInOut,exponentialIn,exponentialOut,exponentialInOut,circularIn,circularOut,circularInOut,elasticIn,elasticOut,elasticInOut,backIn,backOut,backInOut,bounceIn,bounceOut,bounceInOut",clean:"true"}},"markArea.animationDelay":{desc:'<p>初始动画的延迟,支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的初始动画效果。</p>\n<p>如下示例:</p>\n<pre><code class="lang-js">animationDelay: function (idx) {\n // 越往后的数据延迟越大\n return idx * 100;\n}\n</code></pre>\n<p>也可以看<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-animation-delay" target="_blank">该示例</a></p>\n'},"markArea.animationDurationUpdate":{desc:'\n\n<p>数据更新动画的时长。</p>\n<p>支持回调函数,可以通过每个数据返回不同的时长实现更戏剧的更新动画效果:</p>\n<pre><code class="lang-js">animationDurationUpdate: function (idx) {\n // 越往后的数据时长越大\n return idx * 100;\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",default:"1000",step:"20"}},"markArea.animationEasingUpdate":{desc:"\n\n<p>数据更新动画的缓动效果。</p>\n",uiControl:{type:"enum",options:"linear,quadraticIn,quadraticOut,quadraticInOut,cubicIn,cubicOut,cubicInOut,quarticIn,quarticOut,quarticInOut,quinticIn,quinticOut,quinticInOut,sinusoidalIn,sinusoidalOut,sinusoidalInOut,exponentialIn,exponentialOut,exponentialInOut,circularIn,circularOut,circularInOut,elasticIn,elasticOut,elasticInOut,backIn,backOut,backInOut,bounceIn,bounceOut,bounceInOut"}},"markArea.animationDelayUpdate":{desc:'<p>数据更新动画的延迟,支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的更新动画效果。</p>\n<p>如下示例:</p>\n<pre><code class="lang-js">animationDelayUpdate: function (idx) {\n // 越往后的数据延迟越大\n return idx * 100;\n}\n</code></pre>\n<p>也可以看<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-animation-delay" target="_blank">该示例</a></p>\n'},silent:{desc:"\n\n<p>图形是否不响应和触发鼠标事件,默认为 false,即响应和触发鼠标事件。</p>\n",uiControl:{type:"boolean"}},animation:{desc:"\n\n<p>是否开启动画。</p>\n",uiControl:{type:"boolean",default:"true",clean:"true"}},animationThreshold:{desc:"<p>是否开启动画的阈值,当单个系列显示的图形数量大于这个阈值时会关闭动画。</p>\n"},animationDuration:{desc:'\n\n<p>初始动画的时长,支持回调函数,可以通过每个数据返回不同的时长实现更戏剧的初始动画效果:</p>\n<pre><code class="lang-js">animationDuration: function (idx) {\n // 越往后的数据时长越大\n return idx * 100;\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",default:"1000",step:"20",clean:"true"}},animationEasing:{desc:'\n\n<p>初始动画的缓动效果。不同的缓动效果可以参考 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=line-easing" target="_blank">缓动示例</a>。</p>\n',uiControl:{type:"enum",options:"linear,quadraticIn,quadraticOut,quadraticInOut,cubicIn,cubicOut,cubicInOut,quarticIn,quarticOut,quarticInOut,quinticIn,quinticOut,quinticInOut,sinusoidalIn,sinusoidalOut,sinusoidalInOut,exponentialIn,exponentialOut,exponentialInOut,circularIn,circularOut,circularInOut,elasticIn,elasticOut,elasticInOut,backIn,backOut,backInOut,bounceIn,bounceOut,bounceInOut",clean:"true"}},animationDelay:{desc:'<p>初始动画的延迟,支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的初始动画效果。</p>\n<p>如下示例:</p>\n<pre><code class="lang-js">animationDelay: function (idx) {\n // 越往后的数据延迟越大\n return idx * 100;\n}\n</code></pre>\n<p>也可以看<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-animation-delay" target="_blank">该示例</a></p>\n'},animationDurationUpdate:{desc:'\n\n<p>数据更新动画的时长。</p>\n<p>支持回调函数,可以通过每个数据返回不同的时长实现更戏剧的更新动画效果:</p>\n<pre><code class="lang-js">animationDurationUpdate: function (idx) {\n // 越往后的数据时长越大\n return idx * 100;\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",default:"1000",step:"20"}},animationEasingUpdate:{desc:"\n\n<p>数据更新动画的缓动效果。</p>\n",uiControl:{type:"enum",options:"linear,quadraticIn,quadraticOut,quadraticInOut,cubicIn,cubicOut,cubicInOut,quarticIn,quarticOut,quarticInOut,quinticIn,quinticOut,quinticInOut,sinusoidalIn,sinusoidalOut,sinusoidalInOut,exponentialIn,exponentialOut,exponentialInOut,circularIn,circularOut,circularInOut,elasticIn,elasticOut,elasticInOut,backIn,backOut,backInOut,bounceIn,bounceOut,bounceInOut"}},animationDelayUpdate:{desc:'<p>数据更新动画的延迟,支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的更新动画效果。</p>\n<p>如下示例:</p>\n<pre><code class="lang-js">animationDelayUpdate: function (idx) {\n // 越往后的数据延迟越大\n return idx * 100;\n}\n</code></pre>\n<p>也可以看<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-animation-delay" target="_blank">该示例</a></p>\n'},tooltip:{desc:"<p>本系列特定的 tooltip 设定。</p>\n"},"tooltip.position":{desc:'<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的位置,默认不设置时位置会跟随鼠标的位置。</p>\n<p>可选:</p>\n<ul>\n<li><p><code class="codespan">Array</code></p>\n<p> 通过数组表示提示框浮层的位置,支持数字设置绝对位置,百分比设置相对位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对位置,相对于容器左侧 10px, 上侧 10 px\n position: [10, 10]\n // 相对位置,放置在容器正中间\n position: ['50%', '50%']\n</code></pre>\n</li>\n<li><p><code class="codespan">Function</code></p>\n<p> 回调函数,格式如下:</p>\n<pre><code class="lang-js"> (point: Array, params: Object|Array.<Object>, dom: HTMLDomElement, rect: Object, size: Object) => Array\n</code></pre>\n<p> <strong>参数:</strong><br>\n point: 鼠标位置,如 [20, 40]。<br>\n params: 同 formatter 的参数相同。<br>\n dom: tooltip 的 dom 对象。<br>\n rect: 只有鼠标在图形上时有效,是一个用<code class="codespan">x</code>, <code class="codespan">y</code>, <code class="codespan">width</code>, <code class="codespan">height</code>四个属性表达的图形包围盒。<br>\n size: 包括 dom 的尺寸和 echarts 容器的当前尺寸,例如:<code class="codespan">{contentSize: [width, height], viewSize: [width, height]}</code>。<br></p>\n<p> <strong>返回值:</strong><br>\n 可以是一个表示 tooltip 位置的数组,数组值可以是绝对的像素值,也可以是相 百分比。<br>\n 也可以是一个对象,如:<code class="codespan">{left: 10, top: 30}</code>,或者 <code class="codespan">{right: '20%', bottom: 40}</code>。<br></p>\n<p> 如下示例:</p>\n<pre><code class="lang-js"> position: function (point, params, dom, rect, size) {\n // 固定在顶部\n return [point[0], '10%'];\n }\n</code></pre>\n<p> 或者:</p>\n<pre><code class="lang-js"> position: function (pos, params, dom, rect, size) {\n // 鼠标在左侧时 tooltip 显示到右侧,鼠标在右侧时 tooltip 显示到左侧。\n var obj = {top: 60};\n obj[['left', 'right'][+(pos[0] < size.viewSize[0] / 2)]] = 5;\n return obj;\n }\n</code></pre>\n</li>\n</ul>\n<ul>\n<li><p><code class="codespan">'inside'</code></p>\n<p> 鼠标所在图形的内部中心位置,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'top'</code></p>\n<p> 鼠标所在图形上侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'left'</code></p>\n<p> 鼠标所在图形左侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'right'</code></p>\n<p> 鼠标所在图形右侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'bottom'</code></p>\n<p> 鼠标所在图形底侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n</ul>\n'},"tooltip.formatter":{desc:'<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层内容格式器,支持字符串模板和回调函数两种形式。</p>\n<p><strong>1, 字符串模板</strong></p>\n<p>模板变量有 <code class="codespan">{a}</code>, <code class="codespan">{b}</code>,<code class="codespan">{c}</code>,<code class="codespan">{d}</code>,<code class="codespan">{e}</code>,分别表示系列名,数据名,数据值等。\n在 <a href="#tooltip.trigger">trigger</a> 为 <code class="codespan">'axis'</code> 的时候,会有多个系列的数据,此时可以通过 <code class="codespan">{a0}</code>, <code class="codespan">{a1}</code>, <code class="codespan">{a2}</code> 这种后面加索引的方式表示系列的索引。\n不同图表类型下的 <code class="codespan">{a}</code>,<code class="codespan">{b}</code>,<code class="codespan">{c}</code>,<code class="codespan">{d}</code> 含义不一样。\n其中变量<code class="codespan">{a}</code>, <code class="codespan">{b}</code>, <code class="codespan">{c}</code>, <code class="codespan">{d}</code>在不同图表类型下代表数据含义为:</p>\n<ul>\n<li><p>折线(区域)图、柱状(条形)图、K线图 : <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(类目值),<code class="codespan">{c}</code>(数值), <code class="codespan">{d}</code>(无)</p>\n</li>\n<li><p>散点图(气泡)图 : <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(数据名称),<code class="codespan">{c}</code>(数值数组), <code class="codespan">{d}</code>(无)</p>\n</li>\n<li><p>地图 : <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(区域名称),<code class="codespan">{c}</code>(合并数值), <code class="codespan">{d}</code>(无)</p>\n</li>\n<li><p>饼图、仪表盘、漏斗图: <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(数据项名称),<code class="codespan">{c}</code>(数值), <code class="codespan">{d}</code>(百分比)</p>\n</li>\n</ul>\n<p>更多其它图表模板变量的含义可以见相应的图表的 label.formatter 配置项。</p>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b0}: {c0}<br />{b1}: {c1}'\n</code></pre>\n<p><strong>2, 回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array, ticket: string, callback: (ticket: string, html: string)) => string\n</code></pre>\n<p>第一个参数 <code class="codespan">params</code> 是 formatter 需要的数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n // 饼图的百分比\n percent: number,\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n<p>在 <a href="#tooltip.trigger">trigger</a> 为 <code class="codespan">'axis'</code> 的时候,或者 tooltip 被 <a href="#xAxis.axisPointer">axisPointer</a> 触发的时候,<code class="codespan">params</code> 是多个系列的数据数组。其中每项内容格式同上,并且,</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n<p><strong>注:</strong> ECharts 2.x 使用数组表示各参数的方式不再支持。</p>\n<p>第二个参数 <code class="codespan">ticket</code> 是异步回调标识,配合第三个参数 <code class="codespan">callback</code> 使用。\n第三个参数 <code class="codespan">callback</code> 是异步回调,在提示框浮层内容是异步获取的时候,可以通过 callback 传入上述的 <code class="codespan">ticket</code> 和 <code class="codespan">html</code> 更新提示框浮层内容。</p>\n<p>示例:</p>\n<pre><code class="lang-js">formatter: function (params, ticket, callback) {\n $.get('detail?name=' + params.name, function (content) {\n callback(ticket, toHTML(content));\n });\n return 'Loading';\n}\n</code></pre>\n'},"tooltip.backgroundColor":{desc:'<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的背景颜色。</p>\n'},"tooltip.borderColor":{desc:'\n\n\n\n\n<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的边框颜色。</p>\n',uiControl:{type:"color",default:"#333"}},"tooltip.borderWidth":{desc:'\n\n\n\n\n<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的边框宽。</p>\n',uiControl:{type:"number",default:"0",step:"0.5"}},"tooltip.padding":{desc:'\n\n\n\n\n<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n\n\n<p>提示框浮层内边距,单位px,默认各方向内边距为5,接受数组分别设定上右下左边距。</p>\n<p>使用示例:</p>\n<pre><code class="lang-js">// 设置内边距为 5\npadding: 5\n// 设置上下的内边距为 5,左右的内边距为 10\npadding: [5, 10]\n// 分别设置四个方向的内边距\npadding: [\n 5, // 上\n 10, // 右\n 5, // 下\n 10, // 左\n]\n</code></pre>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"tooltip.textStyle":{desc:'<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的文本样式。</p>\n'},"tooltip.textStyle.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"'#fff'"}},"tooltip.textStyle.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"tooltip.textStyle.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"tooltip.textStyle.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"tooltip.textStyle.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"14",min:"1",step:"1"}},"tooltip.textStyle.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"tooltip.textStyle.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"tooltip.textStyle.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"tooltip.textStyle.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"tooltip.textStyle.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"tooltip.textStyle.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"tooltip.textStyle.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"tooltip.textStyle.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"tooltip.textStyle.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"tooltip.textStyle.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"tooltip.textStyle.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"tooltip.textStyle.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"tooltip.extraCssText":{desc:'<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>额外附加到浮层的 css 样式。如下为浮层添加阴影的示例:</p>\n<pre><code class="lang-js">extraCssText: 'box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);'\n</code></pre>\n'}}),s("radar",{id:{desc:"<p>组件 ID。默认不指定。指定则可用于在 option 或者 API 中引用组件。</p>\n"},name:{desc:'<p>系列名称,用于<a href="#tooltip">tooltip</a>的显示,<a href="#legend">legend</a> 的图例筛选,在 <code class="codespan">setOption</code> 更新数据和配置项时用于指定对应的系列。</p>\n'},radarIndex:{desc:'<p>雷达图所使用的 <a href="#radar">radar</a> 组件的 index。</p>\n'},symbol:{desc:'\n\n<p>标记的图形。</p>\n<p>ECharts 提供的标记类型包括</p>\n<p><code class="codespan">'circle'</code>, <code class="codespan">'rect'</code>, <code class="codespan">'roundRect'</code>, <code class="codespan">'triangle'</code>, <code class="codespan">'diamond'</code>, <code class="codespan">'pin'</code>, <code class="codespan">'arrow'</code>, <code class="codespan">'none'</code></p>\n<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre><p>如果需要每个数据的图形不一样,可以设置为如下格式的回调函数:</p>\n<pre><code class="lang-js">(value: Array|number, params: Object) => string\n</code></pre>\n<p>其中第一个参数 <code class="codespan">value</code> 为 <a href="#series-radar.data">data</a> 中的数据值。第二个参数<code class="codespan">params</code> 是其它的数据项参数。</p>\n',uiControl:{type:"icon",default:"circle"}},symbolSize:{desc:'\n\n<p>标记的大小,可以设置成诸如 <code class="codespan">10</code> 这样单一的数字,也可以用数组分开表示宽和高,例如 <code class="codespan">[20, 10]</code> 表示标记宽为<code class="codespan">20</code>,高为<code class="codespan">10</code>。</p>\n<p>如果需要每个数据的图形大小不一样,可以设置为如下格式的回调函数:</p>\n<pre><code class="lang-js">(value: Array|number, params: Object) => number|Array\n</code></pre>\n<p>其中第一个参数 <code class="codespan">value</code> 为 <a href="#series-radar.data">data</a> 中的数据值。第二个参数<code class="codespan">params</code> 是其它的数据项参数。</p>\n',uiControl:{type:"number",min:"0"}},symbolRotate:{desc:'\n\n<p>标记的旋转角度(而非弧度)。正值表示逆时针旋转。注意在 <code class="codespan">markLine</code> 中当 <code class="codespan">symbol</code> 为 <code class="codespan">'arrow'</code> 时会忽略 <code class="codespan">symbolRotate</code> 强制设置为切线的角度。</p>\n<p>如果需要每个数据的旋转角度不一样,可以设置为如下格式的回调函数:</p>\n<pre><code class="lang-js">(value: Array|number, params: Object) => number\n</code></pre>\n<p>其中第一个参数 <code class="codespan">value</code> 为 <a href="#series-radar.data">data</a> 中的数据值。第二个参数<code class="codespan">params</code> 是其它的数据项参数。</p>\n<blockquote>\n<p>从 4.8.0 开始支持回调函数。</p>\n</blockquote>\n',uiControl:{type:"angle",min:"-180",max:"180",step:"1"}},symbolKeepAspect:{desc:'\n\n<p>如果 <code class="codespan">symbol</code> 是 <code class="codespan">path://</code> 的形式,是否在缩放时保持该图形的长宽比。</p>\n',uiControl:{type:"boolean",clean:"true"}},symbolOffset:{desc:'\n\n<p>标记相对于原本位置的偏移。默认情况下,标记会居中置放在数据对应的位置,但是如果 symbol 是自定义的矢量路径或者图片,就有可能不希望 symbol 居中。这时候可以使用该配置项配置 symbol 相对于原本居中的偏移,可以是绝对的像素值,也可以是相对的百分比。</p>\n<p>例如 <code class="codespan">[0, '50%']</code> 就是把自己向上移动了一半的位置,在 symbol 图形是气泡的时候可以让图形下端的箭头对准数据点。</p>\n',uiControl:{type:"vector",separate:"true",dims:"x,y"}},label:{desc:"<p>图形上的文本标签,可用于说明图形的一些数据信息,比如值,名称等。</p>\n"},"label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {@score}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},labelLayout:{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>标签的统一布局配置。</p>\n<p>该配置项是在每个系列默认的标签布局基础上,统一调整标签的<code class="codespan">(x, y)</code>位置,标签对齐等属性以实现想要的标签布局效果。</p>\n<p>该配置项也可以是一个有如下参数的回调函数</p>\n<pre><code class="lang-js">// 标签对应数据的 dataIndex\ndataIndex: number\n// 标签对应的数据类型,只在关系图中会有 node 和 edge 数据类型的区分\ndataType?: string\n// 标签对应的系列的 index\nseriesIndex: number\n// 标签显示的文本\ntext: string\n// 默认的标签的包围盒,由系列默认的标签布局决定\nlabelRect: {x: number, y: number, width: number, height: number}\n// 默认的标签水平对齐\nalign: 'left' | 'center' | 'right'\n// 默认的标签垂直对齐\nverticalAlign: 'top' | 'middle' | 'bottom'\n// 标签所对应的数据图形的包围盒,可用于定位标签位置\nrect: {x: number, y: number, width: number, height: number}\n// 默认引导线的位置,目前只有饼图(pie)和漏斗图(funnel)有默认标签位置\n// 如果没有该值则为 null\nlabelLinePoints?: number[][]\n</code></pre>\n<p><strong>示例:</strong></p>\n<p>将标签显示在图形右侧 10px 的位置,并且垂直居中:</p>\n<pre><code class="lang-js">labelLayout(params) {\n return {\n x: params.rect.x + 10,\n y: params.rect.y + params.rect.height / 2,\n verticalAlign: 'middle',\n align: 'left'\n }\n}\n</code></pre>\n<p>根据图形的包围盒尺寸决定文本尺寸</p>\n<pre><code class="lang-js">\nlabelLayout(params) {\n return {\n fontSize: Math.max(params.rect.width / 10, 5)\n };\n}\n</code></pre>\n'},"labelLayout.hideOverlap":{desc:'<p>是否隐藏重叠的标签。</p>\n<p>下面示例演示了在关系图中开启该配置后,在缩放时可以实现自动的标签隐藏。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=graph-label-overlap&edit=1&reset=1" width="600" height="400"><iframe />\n\n'},"labelLayout.moveOverlap":{desc:'<p>在标签重叠的时候是否挪动标签位置以防止重叠。</p>\n<p>目前支持配置为:</p>\n<ul>\n<li><code class="codespan">'shiftX'</code> 水平方向依次位移,在水平方向对齐时使用</li>\n<li><code class="codespan">'shiftY'</code> 垂直方向依次位移,在垂直方向对齐时使用</li>\n</ul>\n<p>下面是标签右对齐并配置垂直方向依次位移以防止重叠的示例。</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=scatter-label-align-right&edit=1&reset=1" width="600" height="400"><iframe />\n\n'},"labelLayout.x":{desc:'<p>标签的 x 位置。支持绝对的像素值或者<code class="codespan">'20%'</code>这样的相对值。</p>\n'},"labelLayout.y":{desc:'<p>标签的 y 位置。支持绝对的像素值或者<code class="codespan">'20%'</code>这样的相对值。</p>\n'},"labelLayout.dx":{desc:'<p>标签在 x 方向上的像素偏移。可以和<code class="codespan">x</code>一起使用。</p>\n'},"labelLayout.dy":{desc:'<p>标签在 y 方向上的像素偏移。可以和<code class="codespan">y</code>一起使用</p>\n'},"labelLayout.rotate":{desc:"<p>标签旋转角度。</p>\n"},"labelLayout.width":{desc:'<p>标签显示的宽度。可以配合<code class="codespan">overflow</code>使用控制标签显示在固定宽度内</p>\n'},"labelLayout.height":{desc:'<p>标签显示的高度。可以配合<code class="codespan">lineOverflow</code>使用控制标签显示在固定高度内</p>\n'},"labelLayout.align":{desc:'<p>标签水平对齐方式。可以设置<code class="codespan">'left'</code>, <code class="codespan">'center'</code>, <code class="codespan">'right'</code>。</p>\n'},"labelLayout.verticalAlign":{desc:'<p>标签垂直对齐方式。可以设置<code class="codespan">'top'</code>, <code class="codespan">'middle'</code>, <code class="codespan">'bottom'</code>。</p>\n'},"labelLayout.fontSize":{desc:"<p>The text size of the label.</p>\n"},"labelLayout.draggable":{desc:"<p>标签是否可以允许用户通过拖拽二次调整位置。</p>\n"},"labelLayout.labelLinePoints":{desc:'<p>标签引导线三个点的位置。格式为:</p>\n<pre><code class="lang-js">[[x, y], [x, y], [x, y]]\n</code></pre>\n<p>在饼图中常用来微调已经计算好的引导线,其它情况一般不建议设置。</p>\n'},itemStyle:{desc:"<p>折线拐点标志的样式。</p>\n"},"itemStyle.color":{desc:'\n\n<p>图形的颜色。 默认从全局调色盘 <a href="#color">option.color</a> 获取颜色 </p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n<p>支持使用回调函数。回调函数格式如下:</p>\n<pre><code class="lang-js">(params: Object) => Color\n</code></pre>\n<p>传入的是数据项 <code class="codespan">seriesIndex</code>, <code class="codespan">dataIndex</code>, <code class="codespan">data</code>, <code class="codespan">value</code> 等各个参数。</p>\n',uiControl:{type:"color"}},"itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"itemStyle.decal(Object | 'none')":{desc:'<p>图形的贴花图案,在 <a href="#aria.enabled">aria.enabled</a> 与 <a href="#aria.decal.show">aria.decal.show</a> 都是 <code class="codespan">true</code> 的情况下才生效。</p>\n<p>如果为 <code class="codespan">'none'</code> 表示不使用贴花图案。</p>\n<p>需要在设置了填充样式 <code class="codespan">areaStyle</code> 的情况下才生效。</p>\n'},"itemStyle.decal(Object | 'none').symbol(string|string[]) = 'rect'":{desc:'<p>贴花的图案,如果是 <code class="codespan">string[]</code> 表示循环使用数组中的图案。</p>\n<p>ECharts 提供的标记类型包括</p>\n<p><code class="codespan">'circle'</code>, <code class="codespan">'rect'</code>, <code class="codespan">'roundRect'</code>, <code class="codespan">'triangle'</code>, <code class="codespan">'diamond'</code>, <code class="codespan">'pin'</code>, <code class="codespan">'arrow'</code>, <code class="codespan">'none'</code></p>\n<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>'},"itemStyle.decal(Object | 'none').symbolSize":{desc:'<p>取值范围:<code class="codespan">0</code> 到 <code class="codespan">1</code>,表示占图案区域的百分比。</p>\n'},"itemStyle.decal(Object | 'none').symbolKeepAspect":{desc:"<p>是否保持图案的长宽比。</p>\n"},"itemStyle.decal(Object | 'none').color":{desc:"<p>贴花图案的颜色,建议使用半透明色,这样能叠加在系列本身的颜色上。</p>\n"},"itemStyle.decal(Object | 'none').backgroundColor":{desc:"<p>贴花的背景色,将会覆盖在系列本身颜色之上,贴花图案之下。</p>\n"},"itemStyle.decal(Object | 'none').dashArrayX(number | number[] | (number | number[])[]) = 5":{desc:'<p>贴花图案的基本模式是在横向和纵向上分别以<code class="codespan">图案 - 空白 - 图案 - 空白 - 图案 - 空白</code>的形式无限循环。通过设置每个图案和空白的长度,可以实现复杂的图案效果。</p>\n<p><code class="codespan">dashArrayX</code> 控制了横向的图案模式。当其值为 <code class="codespan">number</code> 或 <code class="codespan">number[]</code> 类型时,与 <a href="https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-dasharray" target="_blank">SVG stroke-dasharray</a> 类似。</p>\n<ul>\n<li><p>如果是 <code class="codespan">number</code> 类型,表示图案和空白分别是这个值。如 <code class="codespan">5</code> 表示先显示宽度为 5 的图案,然后空 5 像素,再然后显示宽度为 5 的图案……</p>\n</li>\n<li><p>如果是 <code class="codespan">number[]</code> 类型,则表示图案和空白依次为数组值的循环。如:<code class="codespan">[5, 10, 2, 6]</code> 表示图案宽 5 像素,然后空 10 像素,然后图案宽 2 像素,然后空 6 像素,然后图案宽 5 像素……</p>\n</li>\n<li><p>如果是 <code class="codespan">(number | number[])[]</code> 类型,表示每行的图案和空白依次为数组值的循环。如:<code class="codespan">[10, [2, 5]]</code> 表示第一行以图案 10 像素空 10 像素循环,第二行以图案 2 像素空 5 像素循环,第三行以图案 10 像素空 10 像素循环……</p>\n</li>\n</ul>\n<p>可以结合以下的例子理解本接口:</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/aria-decal&edit=1&reset=1" width="700" height="300"><iframe />\n\n'},"itemStyle.decal(Object | 'none').dashArrayY(number | number[]) = 5":{desc:'<p>贴花图案的基本模式是在横向和纵向上分别以<code class="codespan">图案 - 空白 - 图案 - 空白 - 图案 - 空白</code>的形式无限循环。通过设置每个图案和空白的长度,可以实现复杂的图案效果。</p>\n<p><code class="codespan">dashArrayY</code> 控制了横向的图案模式。与 <a href="https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-dasharray" target="_blank">SVG stroke-dasharray</a> 类似。</p>\n<ul>\n<li><p>如果是 <code class="codespan">number</code> 类型,表示图案和空白分别是这个值。如 <code class="codespan">5</code> 表示先显示高度为 5 的图案,然后空 5 像素,再然后显示高度为 5 的图案……</p>\n</li>\n<li><p>如果是 <code class="codespan">number[]</code> 类型,则表示图案和空白依次为数组值的循环。如:<code class="codespan">[5, 10, 2, 6]</code> 表示图案高 5 像素,然后空 10 像素,然后图案高 2 像素,然后空 6 像素,然后图案高 5 像素……</p>\n</li>\n</ul>\n<p>可以结合以下的例子理解本接口:</p>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/aria-decal&edit=1&reset=1" width="700" height="300"><iframe />\n\n'},"itemStyle.decal(Object | 'none').rotation":{desc:'<p>图案的整体旋转角度(弧度制),取值范围从 <code class="codespan">-Math.PI</code> 到 <code class="codespan">Math.PI</code>。</p>\n'},"itemStyle.decal(Object | 'none').maxTileWidth":{desc:"<p>生成的图案在未重复之前的宽度上限。通常不需要设置该值,当你发现图案在重复的时候出现不连续的接缝时,可以尝试提高该值。</p>\n"},"itemStyle.decal(Object | 'none').maxTileHeight":{desc:"<p>生成的图案在未重复之前的高度上限。通常不需要设置该值,当你发现图案在重复的时候出现不连续的接缝时,可以尝试提高该值。</p>\n"},lineStyle:{desc:"<p>线条样式。</p>\n"},"lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},areaStyle:{desc:"<p>区域填充样式。</p>\n"},"areaStyle.color":{desc:'\n\n<p>填充的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"areaStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"areaStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"areaStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"areaStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"areaStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},emphasis:{desc:"<p>高亮状态的配置。</p>\n"},"emphasis.focus":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>在高亮图形时,是否淡出其它数据的图形已达到聚焦的效果。支持如下配置:</p>\n<ul>\n<li><code class="codespan">'none'</code> 不淡出其它图形,默认使用该配置。</li>\n<li><code class="codespan">'self'</code> 只聚焦(不淡出)当前高亮的数据的图形。</li>\n<li><code class="codespan">'series'</code> 聚焦当前高亮的数据所在的系列的所有图形。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<p>下面代码配置了柱状图在高亮一个图形的时候,淡出当前直角坐标系所有其它的系列。</p>\n<pre><code class="lang-js">emphasis: {\n focus: 'series',\n blurScope: 'coordinateSystem'\n}\n</code></pre>\n<iframe data-src="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=bar-y-category-stack&reset=1&edit=1" width="600" height="400"><iframe />\n\n'},"emphasis.blurScope":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>在开启<code class="codespan">focus</code>的时候,可以通过<code class="codespan">blurScope</code>配置淡出的范围。支持如下配置</p>\n<ul>\n<li><code class="codespan">'coordinateSystem'</code> 淡出范围为坐标系,默认使用该配置。</li>\n<li><code class="codespan">'series'</code> 淡出范围为系列。</li>\n<li><code class="codespan">'global'</code> 淡出范围为全局。</li>\n</ul>\n'},"emphasis.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"emphasis.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"emphasis.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"emphasis.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"emphasis.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"emphasis.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"emphasis.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"emphasis.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"emphasis.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"emphasis.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"emphasis.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"emphasis.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"emphasis.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"emphasis.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"emphasis.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {@score}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"emphasis.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"emphasis.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"emphasis.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"emphasis.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"emphasis.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"emphasis.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"emphasis.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"emphasis.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"emphasis.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"emphasis.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"emphasis.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"emphasis.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"emphasis.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"emphasis.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"emphasis.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"emphasis.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"emphasis.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"emphasis.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"emphasis.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"emphasis.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"emphasis.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"emphasis.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"emphasis.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"emphasis.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"emphasis.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"emphasis.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"emphasis.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"emphasis.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"emphasis.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"emphasis.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"emphasis.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"emphasis.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"emphasis.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"emphasis.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"emphasis.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"emphasis.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"emphasis.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"emphasis.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"emphasis.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"emphasis.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"emphasis.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"emphasis.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"emphasis.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"emphasis.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"emphasis.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"emphasis.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"emphasis.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"emphasis.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"emphasis.areaStyle.color":{desc:'\n\n<p>填充的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"emphasis.areaStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"emphasis.areaStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"emphasis.areaStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"emphasis.areaStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"emphasis.areaStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},blur:{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>淡出状态的配置。开启 <a href="#series-radar.emphasis.focus">emphasis.focus</a> 后有效。</p>\n'},"blur.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"blur.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"blur.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"blur.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"blur.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"blur.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"blur.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"blur.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"blur.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"blur.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"blur.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"blur.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"blur.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"blur.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"blur.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {@score}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"blur.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"blur.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"blur.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"blur.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"blur.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"blur.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"blur.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"blur.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"blur.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"blur.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"blur.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"blur.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"blur.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"blur.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"blur.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"blur.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"blur.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"blur.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"blur.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"blur.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"blur.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"blur.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"blur.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"blur.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"blur.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"blur.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"blur.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"blur.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"blur.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"blur.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"blur.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"blur.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"blur.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"blur.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"blur.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"blur.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"blur.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"blur.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"blur.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"blur.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"blur.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"blur.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"blur.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"blur.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"blur.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"blur.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"blur.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"blur.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"blur.areaStyle.color":{desc:'\n\n<p>填充的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"blur.areaStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"blur.areaStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"blur.areaStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"blur.areaStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"blur.areaStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},select:{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>选中状态的配置。开启 <a href="#series-radar.selectedMode">selectedMode</a> 后有效。</p>\n'},"select.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"select.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"select.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"select.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"select.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"select.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"select.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"select.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"select.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"select.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"select.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"select.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"select.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"select.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"select.label.formatter":{desc:'<p>标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 <code class="codespan">\\n</code> 换行。</p>\n<p><strong>字符串模板</strong>\n模板变量有:</p>\n<ul>\n<li><code class="codespan">{a}</code>:系列名。</li>\n<li><code class="codespan">{b}</code>:数据名。</li>\n<li><code class="codespan">{c}</code>:数据值。</li>\n<li><code class="codespan">{@xxx}:数据中名为</code>'xxx'<code class="codespan">的维度的值,如</code>{@product}<code class="codespan">表示名为</code>'product'` 的维度的值。</li>\n<li><code class="codespan">{@[n]}:数据中维度</code>n<code class="codespan">的值,如</code>{@[3]}` 表示维度 3 的值,从 0 开始计数。</li>\n</ul>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b}: {@score}'\n</code></pre>\n<p><strong>回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array) => string\n</code></pre>\n<p>参数 <code class="codespan">params</code> 是 formatter 需要的单个数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n'},"select.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"select.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"select.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"select.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"select.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"select.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"select.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"select.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"select.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"select.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"select.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"select.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"select.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"select.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"select.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"select.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"select.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"select.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"select.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"select.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"select.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"select.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"select.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"select.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"select.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"select.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"select.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"select.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"select.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"select.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"select.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"select.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"select.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"select.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"select.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"select.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"select.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"select.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"select.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"select.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"select.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"select.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"select.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"select.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"select.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"select.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"select.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"select.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"select.areaStyle.color":{desc:'\n\n<p>填充的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"select.areaStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"select.areaStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"select.areaStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"select.areaStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"select.areaStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},selectedMode:{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n\n\n<p>选中模式的配置,表示是否支持多个选中,默认关闭,支持布尔值和字符串,字符串取值可选<code class="codespan">'single'</code>,<code class="codespan">'multiple'</code>,分别表示单选还是多选。</p>\n',uiControl:{type:"enum",options:"false,true,single,multiple"}},data:{desc:'<p>雷达图的数据是多变量(维度)的,如下示例:</p>\n<pre><code class="lang-js">data : [\n {\n value : [4300, 10000, 28000, 35000, 50000, 19000],\n name : '预算分配(Allocated Budget)'\n },\n {\n value : [5000, 14000, 28000, 31000, 42000, 21000],\n name : '实际开销(Actual Spending)'\n }\n]\n</code></pre>\n<p>其中的<code class="codespan">value</code>项数组是具体的数据,每个值跟 <a href="#radar.indicator">radar.indicator</a> 一一对应。</p>\n'},"data.name":{desc:"<p>数据项名称</p>\n"},"data.value":{desc:"<p>单个数据项的数值。</p>\n"},"data.symbol":{desc:'\n\n<p>单个数据标记的图形。</p>\n<p>ECharts 提供的标记类型包括</p>\n<p><code class="codespan">'circle'</code>, <code class="codespan">'rect'</code>, <code class="codespan">'roundRect'</code>, <code class="codespan">'triangle'</code>, <code class="codespan">'diamond'</code>, <code class="codespan">'pin'</code>, <code class="codespan">'arrow'</code>, <code class="codespan">'none'</code></p>\n<p>可以通过 <code class="codespan">'image://url'</code> 设置为图片,其中 URL 为图片的链接,或者 <code class="codespan">dataURI</code>。</p>\n<p>URL 为图片链接例如:</p>\n<pre><code>'image://http://xxx.xxx.xxx/a/b.png'\n</code></pre><p>URL 为 <code class="codespan">dataURI</code> 例如:</p>\n<pre><code>'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'\n</code></pre><p>可以通过 <code class="codespan">'path://'</code> 将图标设置为任意的矢量路径。这种方式相比于使用图片的方式,不用担心因为缩放而产生锯齿或模糊,而且可以设置为任意颜色。路径图形会自适应调整为合适的大小。路径的格式参见 <a href="http://www.w3.org/TR/SVG/paths.html#PathData" target="_blank">SVG PathData</a>。可以从 Adobe Illustrator 等工具编辑导出。</p>\n<p>例如:</p>\n<pre><code>'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</code></pre>',uiControl:{type:"icon",default:"circle"}},"data.symbolSize":{desc:'\n\n<p>单个数据标记的大小,可以设置成诸如 <code class="codespan">10</code> 这样单一的数字,也可以用数组分开表示宽和高,例如 <code class="codespan">[20, 10]</code> 表示标记宽为<code class="codespan">20</code>,高为<code class="codespan">10</code>。</p>\n',uiControl:{type:"number",min:"0"}},"data.symbolRotate":{desc:'\n\n<p>单个数据标记的旋转角度(而非弧度)。正值表示逆时针旋转。注意在 <code class="codespan">markLine</code> 中当 <code class="codespan">symbol</code> 为 <code class="codespan">'arrow'</code> 时会忽略 <code class="codespan">symbolRotate</code> 强制设置为切线的角度。</p>\n',uiControl:{type:"angle",min:"-180",max:"180",step:"1"}},"data.symbolKeepAspect":{desc:'\n\n<p>如果 <code class="codespan">symbol</code> 是 <code class="codespan">path://</code> 的形式,是否在缩放时保持该图形的长宽比。</p>\n',uiControl:{type:"boolean",clean:"true"}},"data.symbolOffset":{desc:'\n\n<p>单个数据标记相对于原本位置的偏移。默认情况下,标记会居中置放在数据对应的位置,但是如果 symbol 是自定义的矢量路径或者图片,就有可能不希望 symbol 居中。这时候可以使用该配置项配置 symbol 相对于原本居中的偏移,可以是绝对的像素值,也可以是相对的百分比。</p>\n<p>例如 <code class="codespan">[0, '50%']</code> 就是把自己向上移动了一半的位置,在 symbol 图形是气泡的时候可以让图形下端的箭头对准数据点。</p>\n',uiControl:{type:"vector",separate:"true",dims:"x,y"}},"data.label":{desc:"<p>单个拐点文本的样式设置。</p>\n"},"data.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"data.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"data.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"data.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"data.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"data.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"data.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"data.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"data.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"data.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"data.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"data.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"data.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"data.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"data.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"data.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.itemStyle":{desc:"<p>单个拐点标志的样式设置。</p>\n"},"data.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"data.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"data.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"data.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"data.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"data.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"data.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"data.lineStyle":{desc:"<p>单项线条样式。</p>\n"},"data.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"data.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"data.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"data.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"data.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"data.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"data.areaStyle":{desc:"<p>单项区域填充样式。</p>\n"},"data.areaStyle.color":{desc:'\n\n<p>填充的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"data.areaStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"data.areaStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"data.areaStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.areaStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.areaStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"data.emphasis":{desc:"<p>单个数据项样式的高亮状态。</p>\n"},"data.emphasis.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"data.emphasis.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"data.emphasis.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"data.emphasis.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"data.emphasis.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"data.emphasis.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"data.emphasis.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.emphasis.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.emphasis.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"data.emphasis.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"data.emphasis.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"data.emphasis.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"data.emphasis.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"data.emphasis.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"data.emphasis.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"data.emphasis.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.emphasis.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.emphasis.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.emphasis.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.emphasis.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.emphasis.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.emphasis.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.emphasis.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.emphasis.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.emphasis.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.emphasis.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.emphasis.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.emphasis.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.emphasis.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.emphasis.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.emphasis.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.emphasis.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"data.emphasis.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"data.emphasis.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"data.emphasis.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.emphasis.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.emphasis.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.emphasis.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.emphasis.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.emphasis.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"data.emphasis.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"data.emphasis.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"data.emphasis.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"data.emphasis.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"data.emphasis.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.emphasis.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.emphasis.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.emphasis.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.emphasis.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.emphasis.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.emphasis.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.emphasis.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.emphasis.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.emphasis.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.emphasis.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.emphasis.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.emphasis.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.emphasis.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.emphasis.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.emphasis.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.emphasis.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.emphasis.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.emphasis.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"data.emphasis.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.emphasis.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.emphasis.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.emphasis.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.emphasis.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.emphasis.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"data.emphasis.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"data.emphasis.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"data.emphasis.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"data.emphasis.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"data.emphasis.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.emphasis.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.emphasis.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"data.emphasis.areaStyle.color":{desc:'\n\n<p>填充的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"data.emphasis.areaStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"data.emphasis.areaStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"data.emphasis.areaStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.emphasis.areaStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.emphasis.areaStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"data.blur":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>单个数据项样式的淡出状态。</p>\n'},"data.blur.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"data.blur.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"data.blur.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"data.blur.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"data.blur.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"data.blur.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"data.blur.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.blur.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.blur.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"data.blur.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"data.blur.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"data.blur.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"data.blur.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"data.blur.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"data.blur.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"data.blur.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.blur.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.blur.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.blur.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.blur.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.blur.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.blur.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.blur.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.blur.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.blur.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.blur.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.blur.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.blur.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.blur.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.blur.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.blur.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.blur.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"data.blur.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"data.blur.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"data.blur.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.blur.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.blur.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.blur.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.blur.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.blur.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"data.blur.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"data.blur.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"data.blur.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"data.blur.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"data.blur.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.blur.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.blur.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.blur.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.blur.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.blur.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.blur.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.blur.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.blur.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.blur.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.blur.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.blur.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.blur.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.blur.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.blur.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.blur.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.blur.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.blur.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.blur.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"data.blur.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.blur.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.blur.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.blur.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.blur.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.blur.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"data.blur.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"data.blur.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"data.blur.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"data.blur.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"data.blur.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.blur.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.blur.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"data.blur.areaStyle.color":{desc:'\n\n<p>填充的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"data.blur.areaStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"data.blur.areaStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"data.blur.areaStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.blur.areaStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.blur.areaStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"data.select":{desc:'<blockquote>\n<p>从 <code class="codespan">v5.0.0</code> 开始支持</p>\n</blockquote>\n<p>单个数据项样式的选中状态。</p>\n'},"data.select.itemStyle.color":{desc:'\n\n<p>图形的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"data.select.itemStyle.borderColor":{desc:'\n\n<p>图形的描边颜色。支持的颜色格式同 <code class="codespan">color</code>,不支持回调函数。</p>\n',uiControl:{type:"color"}},"data.select.itemStyle.borderWidth":{desc:"\n\n<p>描边线宽。为 0 时无描边。</p>\n",uiControl:{type:"number",value:"0",min:"0",step:"0.5"}},"data.select.itemStyle.borderType":{desc:'\n\n<p>柱条的描边类型,默认为实线,支持 <code class="codespan">'solid'</code>, <code class="codespan">'dashed'</code>, <code class="codespan">'dotted'</code>。</p>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"data.select.itemStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"data.select.itemStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"data.select.itemStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.select.itemStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.select.itemStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"data.select.label.show":{desc:"\n\n<p>是否显示标签。</p>\n",uiControl:{type:"boolean",default:"false"}},"data.select.label.position":{desc:'\n\n\n\n<p>标签的位置。</p>\n<ul>\n<li><p>可以通过内置的语义声明位置:</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> position: 'top'\n</code></pre>\n<p> 支持:<code class="codespan">top</code> / <code class="codespan">left</code> / <code class="codespan">right</code> / <code class="codespan">bottom</code> / <code class="codespan">inside</code> / <code class="codespan">insideLeft</code> / <code class="codespan">insideRight</code> / <code class="codespan">insideTop</code> / <code class="codespan">insideBottom</code> / <code class="codespan">insideTopLeft</code> / <code class="codespan">insideBottomLeft</code> / <code class="codespan">insideTopRight</code> / <code class="codespan">insideBottomRight</code></p>\n</li>\n<li><p>也可以用一个数组表示相对的百分比或者绝对像素值表示标签相对于图形包围盒左上角的位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对的像素值\n position: [10, 10],\n // 相对的百分比\n position: ['50%', '50%']\n</code></pre>\n</li>\n</ul>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"enum",options:"top,left,right,bottom,inside,insideLeft,insideRight,insideTop,insideBottom,insideTopLeft,insideBottomLeft,insideTopRight,insideBottomRight,outside"}},"data.select.label.distance":{desc:'\n\n<p>距离图形元素的距离。当 position 为字符描述值(如 <code class="codespan">'top'</code>、<code class="codespan">'insideRight'</code>)时候有效。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=doc-example/label-position" target="_blank">label position</a>。</p>\n',uiControl:{type:"number",default:"5",min:"0",step:"0.5"}},"data.select.label.rotate":{desc:'\n\n<p>标签旋转。从 -90 度到 90 度。正值是逆时针。</p>\n<p>参见:<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-label-rotation" target="_blank">label rotation</a>。</p>\n',uiControl:{type:"angle",default:"0",min:"-90",max:"90",step:"1"}},"data.select.label.offset":{desc:'\n\n<p>是否对文字进行偏移。默认不偏移。例如:<code class="codespan">[30, 40]</code> 表示文字在横向上偏移 <code class="codespan">30</code>,纵向上偏移 <code class="codespan">40</code>。</p>\n',uiControl:{type:"vector",dims:"x,y",step:"0.5",separate:"true"}},"data.select.label.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"data.select.label.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.select.label.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.select.label.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.select.label.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.select.label.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.select.label.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.select.label.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.select.label.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.select.label.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.select.label.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.select.label.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.select.label.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.select.label.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.select.label.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.select.label.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.select.label.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.select.label.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"data.select.label.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"data.select.label.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"data.select.label.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.select.label.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.select.label.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.select.label.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.select.label.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.select.label.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"data.select.label.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"data.select.label.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"data.select.label.rich":{desc:'<p>在 <code class="codespan">rich</code> 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。</p>\n<p>例如:</p>\n<pre><code class="lang-js">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</code></pre>\n<p>详情参见教程:<a href="tutorial.html#%E5%AF%8C%E6%96%87%E6%9C%AC%E6%A0%87%E7%AD%BE" target="_blank">富文本标签</a></p>\n'},"data.select.label.rich.<style_name>.color":{desc:'\n\n<p>文字的颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"null"}},"data.select.label.rich.<style_name>.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.select.label.rich.<style_name>.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.select.label.rich.<style_name>.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.select.label.rich.<style_name>.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"12",min:"1",step:"1"}},"data.select.label.rich.<style_name>.align":{desc:'\n\n<p>文字水平对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'left'</code></li>\n<li><code class="codespan">'center'</code></li>\n<li><code class="codespan">'right'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">align</code>,则会取父层级的 <code class="codespan">align</code>。例如:</p>\n<pre><code class="lang-js">{\n align: right,\n rich: {\n a: {\n // 没有设置 `align`,则 `align` 为 right\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"left,center,right"}},"data.select.label.rich.<style_name>.verticalAlign":{desc:'\n\n<p>文字垂直对齐方式,默认自动。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'top'</code></li>\n<li><code class="codespan">'middle'</code></li>\n<li><code class="codespan">'bottom'</code></li>\n</ul>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">verticalAlign</code>,则会取父层级的 <code class="codespan">verticalAlign</code>。例如:</p>\n<pre><code class="lang-js">{\n verticalAlign: bottom,\n rich: {\n a: {\n // 没有设置 `verticalAlign`,则 `verticalAlign` 为 bottom\n }\n }\n}\n</code></pre>\n',uiControl:{type:"enum",options:"top,middle,bottom"}},"data.select.label.rich.<style_name>.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.select.label.rich.<style_name>.backgroundColor":{desc:'\n\n<p>文字块背景色。</p>\n<p>可以使用颜色值,例如:<code class="codespan">'#123234'</code>, <code class="codespan">'red'</code>, <code class="codespan">'rgba(0,23,11,0.3)'</code>。</p>\n<p>也可以直接使用图片,例如:</p>\n<pre><code class="lang-js">backgroundColor: {\n image: 'xxx/xxx.png'\n // 这里可以是图片的 URL,\n // 或者图片的 dataURI,\n // 或者 HTMLImageElement 对象,\n // 或者 HTMLCanvasElement 对象。\n}\n</code></pre>\n<p>当使用图片的时候,可以使用 <code class="codespan">width</code> 或 <code class="codespan">height</code> 指定高宽,也可以不指定自适应。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.select.label.rich.<style_name>.borderColor":{desc:'\n\n<p>文字块边框颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color",default:"#fff"}},"data.select.label.rich.<style_name>.borderWidth":{desc:"\n\n<p>文字块边框宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.select.label.rich.<style_name>.borderRadius":{desc:"\n\n<p>文字块的圆角。</p>\n",uiControl:{type:"vector",min:"0",dims:"LT,RT, RB, LB"}},"data.select.label.rich.<style_name>.padding":{desc:'\n\n<p>文字块的内边距。例如:</p>\n<ul>\n<li><code class="codespan">padding: [3, 4, 5, 6]</code>:表示 <code class="codespan">[上, 右, 下, 左]</code> 的边距。</li>\n<li><code class="codespan">padding: 4</code>:表示 <code class="codespan">padding: [4, 4, 4, 4]</code>。</li>\n<li><code class="codespan">padding: [3, 4]</code>:表示 <code class="codespan">padding: [3, 4, 3, 4]</code>。</li>\n</ul>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.select.label.rich.<style_name>.shadowColor":{desc:"\n\n<p>文字块的背景阴影颜色。</p>\n",uiControl:{type:"color"}},"data.select.label.rich.<style_name>.shadowBlur":{desc:"\n\n<p>文字块的背景阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.select.label.rich.<style_name>.shadowOffsetX":{desc:"\n\n<p>文字块的背景阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.select.label.rich.<style_name>.shadowOffsetY":{desc:"\n\n<p>文字块的背景阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.select.label.rich.<style_name>.width":{desc:'<p>文字块的宽度。一般不用指定,不指定则自动是文字的宽度。在想做表格项或者使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p><code class="codespan">width</code> 也可以是百分比字符串,如 <code class="codespan">'100%'</code>。表示的是所在文本块的 <code class="codespan">contentWidth</code>(即不包含文本块的 <code class="codespan">padding</code>)的百分之多少。之所以以 <code class="codespan">contentWidth</code> 做基数,因为每个文本片段只能基于 <code class="codespan">content box</code> 布局。如果以 <code class="codespan">outerWidth</code> 做基数,则百分比的计算在实用中不具有意义,可能会超出。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.select.label.rich.<style_name>.height":{desc:'<p>文字块的高度。一般不用指定,不指定则自动是文字的高度。在使用图片(参见 <code class="codespan">backgroundColor</code>)时,可能会使用它。</p>\n<p>注意,文字块的 <code class="codespan">width</code> 和 <code class="codespan">height</code> 指定的是内容高宽,不包含 <code class="codespan">padding</code>。</p>\n<p>注意,如果不定义 <code class="codespan">rich</code> 属性,则不能指定 <code class="codespan">width</code> 和 <code class="codespan">height</code>。</p>\n'},"data.select.label.rich.<style_name>.textBorderColor":{desc:'\n\n<p>文字本身的描边颜色。</p>\n<p>如果设置为 <code class="codespan">'inherit'</code>,则为视觉映射得到的颜色,如系列色。</p>\n',uiControl:{type:"color"}},"data.select.label.rich.<style_name>.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.select.label.rich.<style_name>.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.select.label.rich.<style_name>.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.select.label.rich.<style_name>.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.select.label.rich.<style_name>.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.select.lineStyle.color":{desc:'\n\n<p>线的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"data.select.lineStyle.width":{desc:"\n\n<p>线宽。</p>\n",uiControl:{type:"number",value:"1",min:"0",step:"0.5"}},"data.select.lineStyle.type":{desc:'\n\n<p>线的类型。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'solid'</code></li>\n<li><code class="codespan">'dashed'</code></li>\n<li><code class="codespan">'dotted'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"solid",options:"solid,dashed,dotted"}},"data.select.lineStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"data.select.lineStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"data.select.lineStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.select.lineStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.select.lineStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"data.select.areaStyle.color":{desc:'\n\n<p>填充的颜色。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示,比如 <code class="codespan">'rgb(128, 128, 128)'</code>,如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如 <code class="codespan">'rgba(128, 128, 128, 0.5)'</code>,也可以使用十六进制格式,比如 <code class="codespan">'#ccc'</code>。除了纯色之外颜色也支持渐变色和纹理填充</p>\n<pre><code class="lang-js">// 线性渐变,前四个参数分别是 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</code></pre>\n</blockquote>\n',uiControl:{type:"color"}},"data.select.areaStyle.shadowBlur":{desc:'\n\n<p>图形阴影的模糊大小。该属性配合 <code class="codespan">shadowColor</code>,<code class="codespan">shadowOffsetX</code>, <code class="codespan">shadowOffsetY</code> 一起设置图形的阴影效果。</p>\n<p>示例:</p>\n<pre><code class="lang-js">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n',uiControl:{type:"number",default:"",min:"0",step:"0.5"}},"data.select.areaStyle.shadowColor":{desc:'\n\n<p>阴影颜色。支持的格式同<code class="codespan">color</code>。</p>\n',uiControl:{type:"color",default:""}},"data.select.areaStyle.shadowOffsetX":{desc:"\n\n<p>阴影水平方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.select.areaStyle.shadowOffsetY":{desc:"\n\n<p>阴影垂直方向上的偏移距离。</p>\n",uiControl:{type:"number",default:"0",step:"0.5"}},"data.select.areaStyle.opacity":{desc:"\n\n<p>图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。</p>\n",uiControl:{type:"number",default:"1",min:"0",max:"1",step:"0.01"}},"data.tooltip":{desc:"<p>本系列每个数据项中特定的 tooltip 设定。</p>\n"},"data.tooltip.position":{desc:'<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.data.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的位置,默认不设置时位置会跟随鼠标的位置。</p>\n<p>可选:</p>\n<ul>\n<li><p><code class="codespan">Array</code></p>\n<p> 通过数组表示提示框浮层的位置,支持数字设置绝对位置,百分比设置相对位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对位置,相对于容器左侧 10px, 上侧 10 px\n position: [10, 10]\n // 相对位置,放置在容器正中间\n position: ['50%', '50%']\n</code></pre>\n</li>\n<li><p><code class="codespan">Function</code></p>\n<p> 回调函数,格式如下:</p>\n<pre><code class="lang-js"> (point: Array, params: Object|Array.<Object>, dom: HTMLDomElement, rect: Object, size: Object) => Array\n</code></pre>\n<p> <strong>参数:</strong><br>\n point: 鼠标位置,如 [20, 40]。<br>\n params: 同 formatter 的参数相同。<br>\n dom: tooltip 的 dom 对象。<br>\n rect: 只有鼠标在图形上时有效,是一个用<code class="codespan">x</code>, <code class="codespan">y</code>, <code class="codespan">width</code>, <code class="codespan">height</code>四个属性表达的图形包围盒。<br>\n size: 包括 dom 的尺寸和 echarts 容器的当前尺寸,例如:<code class="codespan">{contentSize: [width, height], viewSize: [width, height]}</code>。<br></p>\n<p> <strong>返回值:</strong><br>\n 可以是一个表示 tooltip 位置的数组,数组值可以是绝对的像素值,也可以是相 百分比。<br>\n 也可以是一个对象,如:<code class="codespan">{left: 10, top: 30}</code>,或者 <code class="codespan">{right: '20%', bottom: 40}</code>。<br></p>\n<p> 如下示例:</p>\n<pre><code class="lang-js"> position: function (point, params, dom, rect, size) {\n // 固定在顶部\n return [point[0], '10%'];\n }\n</code></pre>\n<p> 或者:</p>\n<pre><code class="lang-js"> position: function (pos, params, dom, rect, size) {\n // 鼠标在左侧时 tooltip 显示到右侧,鼠标在右侧时 tooltip 显示到左侧。\n var obj = {top: 60};\n obj[['left', 'right'][+(pos[0] < size.viewSize[0] / 2)]] = 5;\n return obj;\n }\n</code></pre>\n</li>\n</ul>\n<ul>\n<li><p><code class="codespan">'inside'</code></p>\n<p> 鼠标所在图形的内部中心位置,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'top'</code></p>\n<p> 鼠标所在图形上侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'left'</code></p>\n<p> 鼠标所在图形左侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'right'</code></p>\n<p> 鼠标所在图形右侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'bottom'</code></p>\n<p> 鼠标所在图形底侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n</ul>\n'},"data.tooltip.formatter":{desc:'<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.data.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层内容格式器,支持字符串模板和回调函数两种形式。</p>\n<p><strong>1, 字符串模板</strong></p>\n<p>模板变量有 <code class="codespan">{a}</code>, <code class="codespan">{b}</code>,<code class="codespan">{c}</code>,<code class="codespan">{d}</code>,<code class="codespan">{e}</code>,分别表示系列名,数据名,数据值等。\n在 <a href="#tooltip.trigger">trigger</a> 为 <code class="codespan">'axis'</code> 的时候,会有多个系列的数据,此时可以通过 <code class="codespan">{a0}</code>, <code class="codespan">{a1}</code>, <code class="codespan">{a2}</code> 这种后面加索引的方式表示系列的索引。\n不同图表类型下的 <code class="codespan">{a}</code>,<code class="codespan">{b}</code>,<code class="codespan">{c}</code>,<code class="codespan">{d}</code> 含义不一样。\n其中变量<code class="codespan">{a}</code>, <code class="codespan">{b}</code>, <code class="codespan">{c}</code>, <code class="codespan">{d}</code>在不同图表类型下代表数据含义为:</p>\n<ul>\n<li><p>折线(区域)图、柱状(条形)图、K线图 : <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(类目值),<code class="codespan">{c}</code>(数值), <code class="codespan">{d}</code>(无)</p>\n</li>\n<li><p>散点图(气泡)图 : <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(数据名称),<code class="codespan">{c}</code>(数值数组), <code class="codespan">{d}</code>(无)</p>\n</li>\n<li><p>地图 : <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(区域名称),<code class="codespan">{c}</code>(合并数值), <code class="codespan">{d}</code>(无)</p>\n</li>\n<li><p>饼图、仪表盘、漏斗图: <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(数据项名称),<code class="codespan">{c}</code>(数值), <code class="codespan">{d}</code>(百分比)</p>\n</li>\n</ul>\n<p>更多其它图表模板变量的含义可以见相应的图表的 label.formatter 配置项。</p>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b0}: {c0}<br />{b1}: {c1}'\n</code></pre>\n<p><strong>2, 回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array, ticket: string, callback: (ticket: string, html: string)) => string\n</code></pre>\n<p>第一个参数 <code class="codespan">params</code> 是 formatter 需要的数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n // 饼图的百分比\n percent: number,\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n<p>在 <a href="#tooltip.trigger">trigger</a> 为 <code class="codespan">'axis'</code> 的时候,或者 tooltip 被 <a href="#xAxis.axisPointer">axisPointer</a> 触发的时候,<code class="codespan">params</code> 是多个系列的数据数组。其中每项内容格式同上,并且,</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n<p><strong>注:</strong> ECharts 2.x 使用数组表示各参数的方式不再支持。</p>\n<p>第二个参数 <code class="codespan">ticket</code> 是异步回调标识,配合第三个参数 <code class="codespan">callback</code> 使用。\n第三个参数 <code class="codespan">callback</code> 是异步回调,在提示框浮层内容是异步获取的时候,可以通过 callback 传入上述的 <code class="codespan">ticket</code> 和 <code class="codespan">html</code> 更新提示框浮层内容。</p>\n<p>示例:</p>\n<pre><code class="lang-js">formatter: function (params, ticket, callback) {\n $.get('detail?name=' + params.name, function (content) {\n callback(ticket, toHTML(content));\n });\n return 'Loading';\n}\n</code></pre>\n'},"data.tooltip.backgroundColor":{desc:'<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.data.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的背景颜色。</p>\n'},"data.tooltip.borderColor":{desc:'\n\n\n\n\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.data.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的边框颜色。</p>\n',uiControl:{type:"color",default:"#333"}},"data.tooltip.borderWidth":{desc:'\n\n\n\n\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.data.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的边框宽。</p>\n',uiControl:{type:"number",default:"0",step:"0.5"}},"data.tooltip.padding":{desc:'\n\n\n\n\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.data.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n\n\n<p>提示框浮层内边距,单位px,默认各方向内边距为5,接受数组分别设定上右下左边距。</p>\n<p>使用示例:</p>\n<pre><code class="lang-js">// 设置内边距为 5\npadding: 5\n// 设置上下的内边距为 5,左右的内边距为 10\npadding: [5, 10]\n// 分别设置四个方向的内边距\npadding: [\n 5, // 上\n 10, // 右\n 5, // 下\n 10, // 左\n]\n</code></pre>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"data.tooltip.textStyle":{desc:'<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.data.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的文本样式。</p>\n'},"data.tooltip.textStyle.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"'#fff'"}},"data.tooltip.textStyle.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"data.tooltip.textStyle.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"data.tooltip.textStyle.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"data.tooltip.textStyle.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"14",min:"1",step:"1"}},"data.tooltip.textStyle.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"data.tooltip.textStyle.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"data.tooltip.textStyle.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"data.tooltip.textStyle.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"data.tooltip.textStyle.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.tooltip.textStyle.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"data.tooltip.textStyle.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"data.tooltip.textStyle.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.tooltip.textStyle.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"data.tooltip.textStyle.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"data.tooltip.textStyle.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"data.tooltip.textStyle.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"data.tooltip.extraCssText":{desc:'<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.data.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>额外附加到浮层的 css 样式。如下为浮层添加阴影的示例:</p>\n<pre><code class="lang-js">extraCssText: 'box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);'\n</code></pre>\n'},zlevel:{desc:'<p>雷达图所有图形的 zlevel 值。</p>\n<p><code class="codespan">zlevel</code>用于 Canvas 分层,不同<code class="codespan">zlevel</code>值的图形会放置在不同的 Canvas 中,Canvas 分层是一种常见的优化手段。我们可以把一些图形变化频繁(例如有动画)的组件设置成一个单独的<code class="codespan">zlevel</code>。需要注意的是过多的 Canvas 会引起内存开销的增大,在手机端上需要谨慎使用以防崩溃。</p>\n<p><code class="codespan">zlevel</code> 大的 Canvas 会放在 <code class="codespan">zlevel</code> 小的 Canvas 的上面。</p>\n'},z:{desc:'<p>雷达图组件的所有图形的<code class="codespan">z</code>值。控制图形的前后顺序。<code class="codespan">z</code>值小的图形会被<code class="codespan">z</code>值大的图形覆盖。</p>\n<p><code class="codespan">z</code>相比<code class="codespan">zlevel</code>优先级更低,而且不会创建新的 Canvas。</p>\n'},silent:{desc:"\n\n<p>图形是否不响应和触发鼠标事件,默认为 false,即响应和触发鼠标事件。</p>\n",uiControl:{type:"boolean"}},animation:{desc:"\n\n<p>是否开启动画。</p>\n",uiControl:{type:"boolean",default:"true",clean:"true"}},animationThreshold:{desc:"<p>是否开启动画的阈值,当单个系列显示的图形数量大于这个阈值时会关闭动画。</p>\n"},animationDuration:{desc:'\n\n<p>初始动画的时长,支持回调函数,可以通过每个数据返回不同的时长实现更戏剧的初始动画效果:</p>\n<pre><code class="lang-js">animationDuration: function (idx) {\n // 越往后的数据时长越大\n return idx * 100;\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",default:"1000",step:"20",clean:"true"}},animationEasing:{desc:'\n\n<p>初始动画的缓动效果。不同的缓动效果可以参考 <a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=line-easing" target="_blank">缓动示例</a>。</p>\n',uiControl:{type:"enum",options:"linear,quadraticIn,quadraticOut,quadraticInOut,cubicIn,cubicOut,cubicInOut,quarticIn,quarticOut,quarticInOut,quinticIn,quinticOut,quinticInOut,sinusoidalIn,sinusoidalOut,sinusoidalInOut,exponentialIn,exponentialOut,exponentialInOut,circularIn,circularOut,circularInOut,elasticIn,elasticOut,elasticInOut,backIn,backOut,backInOut,bounceIn,bounceOut,bounceInOut",clean:"true"}},animationDelay:{desc:'<p>初始动画的延迟,支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的初始动画效果。</p>\n<p>如下示例:</p>\n<pre><code class="lang-js">animationDelay: function (idx) {\n // 越往后的数据延迟越大\n return idx * 100;\n}\n</code></pre>\n<p>也可以看<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-animation-delay" target="_blank">该示例</a></p>\n'},animationDurationUpdate:{desc:'\n\n<p>数据更新动画的时长。</p>\n<p>支持回调函数,可以通过每个数据返回不同的时长实现更戏剧的更新动画效果:</p>\n<pre><code class="lang-js">animationDurationUpdate: function (idx) {\n // 越往后的数据时长越大\n return idx * 100;\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",default:"1000",step:"20"}},animationEasingUpdate:{desc:"\n\n<p>数据更新动画的缓动效果。</p>\n",uiControl:{type:"enum",options:"linear,quadraticIn,quadraticOut,quadraticInOut,cubicIn,cubicOut,cubicInOut,quarticIn,quarticOut,quarticInOut,quinticIn,quinticOut,quinticInOut,sinusoidalIn,sinusoidalOut,sinusoidalInOut,exponentialIn,exponentialOut,exponentialInOut,circularIn,circularOut,circularInOut,elasticIn,elasticOut,elasticInOut,backIn,backOut,backInOut,bounceIn,bounceOut,bounceInOut"}},animationDelayUpdate:{desc:'<p>数据更新动画的延迟,支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的更新动画效果。</p>\n<p>如下示例:</p>\n<pre><code class="lang-js">animationDelayUpdate: function (idx) {\n // 越往后的数据延迟越大\n return idx * 100;\n}\n</code></pre>\n<p>也可以看<a href="http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-animation-delay" target="_blank">该示例</a></p>\n'},tooltip:{desc:"<p>本系列特定的 tooltip 设定。</p>\n"},"tooltip.position":{desc:'<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的位置,默认不设置时位置会跟随鼠标的位置。</p>\n<p>可选:</p>\n<ul>\n<li><p><code class="codespan">Array</code></p>\n<p> 通过数组表示提示框浮层的位置,支持数字设置绝对位置,百分比设置相对位置。</p>\n<p> 示例:</p>\n<pre><code class="lang-js"> // 绝对位置,相对于容器左侧 10px, 上侧 10 px\n position: [10, 10]\n // 相对位置,放置在容器正中间\n position: ['50%', '50%']\n</code></pre>\n</li>\n<li><p><code class="codespan">Function</code></p>\n<p> 回调函数,格式如下:</p>\n<pre><code class="lang-js"> (point: Array, params: Object|Array.<Object>, dom: HTMLDomElement, rect: Object, size: Object) => Array\n</code></pre>\n<p> <strong>参数:</strong><br>\n point: 鼠标位置,如 [20, 40]。<br>\n params: 同 formatter 的参数相同。<br>\n dom: tooltip 的 dom 对象。<br>\n rect: 只有鼠标在图形上时有效,是一个用<code class="codespan">x</code>, <code class="codespan">y</code>, <code class="codespan">width</code>, <code class="codespan">height</code>四个属性表达的图形包围盒。<br>\n size: 包括 dom 的尺寸和 echarts 容器的当前尺寸,例如:<code class="codespan">{contentSize: [width, height], viewSize: [width, height]}</code>。<br></p>\n<p> <strong>返回值:</strong><br>\n 可以是一个表示 tooltip 位置的数组,数组值可以是绝对的像素值,也可以是相 百分比。<br>\n 也可以是一个对象,如:<code class="codespan">{left: 10, top: 30}</code>,或者 <code class="codespan">{right: '20%', bottom: 40}</code>。<br></p>\n<p> 如下示例:</p>\n<pre><code class="lang-js"> position: function (point, params, dom, rect, size) {\n // 固定在顶部\n return [point[0], '10%'];\n }\n</code></pre>\n<p> 或者:</p>\n<pre><code class="lang-js"> position: function (pos, params, dom, rect, size) {\n // 鼠标在左侧时 tooltip 显示到右侧,鼠标在右侧时 tooltip 显示到左侧。\n var obj = {top: 60};\n obj[['left', 'right'][+(pos[0] < size.viewSize[0] / 2)]] = 5;\n return obj;\n }\n</code></pre>\n</li>\n</ul>\n<ul>\n<li><p><code class="codespan">'inside'</code></p>\n<p> 鼠标所在图形的内部中心位置,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'top'</code></p>\n<p> 鼠标所在图形上侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'left'</code></p>\n<p> 鼠标所在图形左侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'right'</code></p>\n<p> 鼠标所在图形右侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n<li><p><code class="codespan">'bottom'</code></p>\n<p> 鼠标所在图形底侧,只在 <a href="#tooltip.trigger">trigger</a> 为<code class="codespan">'item'</code>的时候有效。</p>\n</li>\n</ul>\n'},"tooltip.formatter":{desc:'<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层内容格式器,支持字符串模板和回调函数两种形式。</p>\n<p><strong>1, 字符串模板</strong></p>\n<p>模板变量有 <code class="codespan">{a}</code>, <code class="codespan">{b}</code>,<code class="codespan">{c}</code>,<code class="codespan">{d}</code>,<code class="codespan">{e}</code>,分别表示系列名,数据名,数据值等。\n在 <a href="#tooltip.trigger">trigger</a> 为 <code class="codespan">'axis'</code> 的时候,会有多个系列的数据,此时可以通过 <code class="codespan">{a0}</code>, <code class="codespan">{a1}</code>, <code class="codespan">{a2}</code> 这种后面加索引的方式表示系列的索引。\n不同图表类型下的 <code class="codespan">{a}</code>,<code class="codespan">{b}</code>,<code class="codespan">{c}</code>,<code class="codespan">{d}</code> 含义不一样。\n其中变量<code class="codespan">{a}</code>, <code class="codespan">{b}</code>, <code class="codespan">{c}</code>, <code class="codespan">{d}</code>在不同图表类型下代表数据含义为:</p>\n<ul>\n<li><p>折线(区域)图、柱状(条形)图、K线图 : <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(类目值),<code class="codespan">{c}</code>(数值), <code class="codespan">{d}</code>(无)</p>\n</li>\n<li><p>散点图(气泡)图 : <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(数据名称),<code class="codespan">{c}</code>(数值数组), <code class="codespan">{d}</code>(无)</p>\n</li>\n<li><p>地图 : <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(区域名称),<code class="codespan">{c}</code>(合并数值), <code class="codespan">{d}</code>(无)</p>\n</li>\n<li><p>饼图、仪表盘、漏斗图: <code class="codespan">{a}</code>(系列名称),<code class="codespan">{b}</code>(数据项名称),<code class="codespan">{c}</code>(数值), <code class="codespan">{d}</code>(百分比)</p>\n</li>\n</ul>\n<p>更多其它图表模板变量的含义可以见相应的图表的 label.formatter 配置项。</p>\n<p><strong>示例:</strong></p>\n<pre><code class="lang-js">formatter: '{b0}: {c0}<br />{b1}: {c1}'\n</code></pre>\n<p><strong>2, 回调函数</strong></p>\n<p>回调函数格式:</p>\n<pre><code class="lang-js">(params: Object|Array, ticket: string, callback: (ticket: string, html: string)) => string\n</code></pre>\n<p>第一个参数 <code class="codespan">params</code> 是 formatter 需要的数据集。格式如下:</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n // 饼图的百分比\n percent: number,\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n<p>在 <a href="#tooltip.trigger">trigger</a> 为 <code class="codespan">'axis'</code> 的时候,或者 tooltip 被 <a href="#xAxis.axisPointer">axisPointer</a> 触发的时候,<code class="codespan">params</code> 是多个系列的数据数组。其中每项内容格式同上,并且,</p>\n<pre><code class="lang-js">{\n componentType: 'series',\n // 系列类型\n seriesType: string,\n // 系列在传入的 option.series 中的 index\n seriesIndex: number,\n // 系列名称\n seriesName: string,\n // 数据名,类目名\n name: string,\n // 数据在传入的 data 数组中的 index\n dataIndex: number,\n // 传入的原始数据项\n data: Object,\n // 传入的数据值。在多数系列下它和 data 相同。在一些系列下是 data 中的分量(如 map、radar 中)\n value: number|Array|Object,\n // 坐标轴 encode 映射信息,\n // key 为坐标轴(如 'x' 'y' 'radius' 'angle' 等)\n // value 必然为数组,不会为 null/undefied,表示 dimension index 。\n // 其内容如:\n // {\n // x: [2] // dimension index 为 2 的数据映射到 x 轴\n // y: [0] // dimension index 为 0 的数据映射到 y 轴\n // }\n encode: Object,\n // 维度名列表\n dimensionNames: Array<String>,\n // 数据的维度 index,如 0 或 1 或 2 ...\n // 仅在雷达图中使用。\n dimensionIndex: number,\n // 数据图形的颜色\n color: string,\n\n\n\n}\n</code></pre>\n<p>注:encode 和 dimensionNames 的使用方式,例如:</p>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n source: [\n ['Matcha Latte', 43.3, 85.8, 93.7],\n ['Milk Tea', 83.1, 73.4, 55.1],\n ['Cheese Cocoa', 86.4, 65.2, 82.5],\n ['Walnut Brownie', 72.4, 53.9, 39.1]\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.encode.y[0]]\n</code></pre>\n<p>如果数据为:</p>\n<pre><code class="lang-js">dataset: {\n dimensions: ['product', '2015', '2016', '2017'],\n source: [\n {product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7},\n {product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1},\n {product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5},\n {product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1}\n ]\n}\n</code></pre>\n<p>则可这样得到 y 轴对应的 value:</p>\n<pre><code class="lang-js">params.value[params.dimensionNames[params.encode.y[0]]]\n</code></pre>\n<p><strong>注:</strong> ECharts 2.x 使用数组表示各参数的方式不再支持。</p>\n<p>第二个参数 <code class="codespan">ticket</code> 是异步回调标识,配合第三个参数 <code class="codespan">callback</code> 使用。\n第三个参数 <code class="codespan">callback</code> 是异步回调,在提示框浮层内容是异步获取的时候,可以通过 callback 传入上述的 <code class="codespan">ticket</code> 和 <code class="codespan">html</code> 更新提示框浮层内容。</p>\n<p>示例:</p>\n<pre><code class="lang-js">formatter: function (params, ticket, callback) {\n $.get('detail?name=' + params.name, function (content) {\n callback(ticket, toHTML(content));\n });\n return 'Loading';\n}\n</code></pre>\n'},"tooltip.backgroundColor":{desc:'<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的背景颜色。</p>\n'},"tooltip.borderColor":{desc:'\n\n\n\n\n<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的边框颜色。</p>\n',uiControl:{type:"color",default:"#333"}},"tooltip.borderWidth":{desc:'\n\n\n\n\n<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的边框宽。</p>\n',uiControl:{type:"number",default:"0",step:"0.5"}},"tooltip.padding":{desc:'\n\n\n\n\n<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n\n\n<p>提示框浮层内边距,单位px,默认各方向内边距为5,接受数组分别设定上右下左边距。</p>\n<p>使用示例:</p>\n<pre><code class="lang-js">// 设置内边距为 5\npadding: 5\n// 设置上下的内边距为 5,左右的内边距为 10\npadding: [5, 10]\n// 分别设置四个方向的内边距\npadding: [\n 5, // 上\n 10, // 右\n 5, // 下\n 10, // 左\n]\n</code></pre>\n',uiControl:{type:"vector",min:"0",dims:"T,R,B,L"}},"tooltip.textStyle":{desc:'<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>提示框浮层的文本样式。</p>\n'},"tooltip.textStyle.color":{desc:"\n\n<p>文字的颜色。</p>\n",uiControl:{type:"color",default:"'#fff'"}},"tooltip.textStyle.fontStyle":{desc:'\n\n<p>文字字体的风格。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'italic'</code></li>\n<li><code class="codespan">'oblique'</code></li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,italic,oblique"}},"tooltip.textStyle.fontWeight":{desc:'\n\n<p>文字字体的粗细。</p>\n<p>可选:</p>\n<ul>\n<li><code class="codespan">'normal'</code></li>\n<li><code class="codespan">'bold'</code></li>\n<li><code class="codespan">'bolder'</code></li>\n<li><code class="codespan">'lighter'</code></li>\n<li>100 | 200 | 300 | 400...</li>\n</ul>\n',uiControl:{type:"enum",default:"normal",options:"normal,bold,bolder,lighter"}},"tooltip.textStyle.fontFamily":{desc:"\n\n<p>文字的字体系列。</p>\n<p>还可以是 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft YaHei', ...</p>\n",uiControl:{type:"enum",default:"sans-serif",options:"sans-serif,serif,monospace,Arial,Courier New"}},"tooltip.textStyle.fontSize":{desc:"\n\n<p>文字的字体大小。</p>\n",uiControl:{type:"number",default:"14",min:"1",step:"1"}},"tooltip.textStyle.lineHeight":{desc:'\n\n<p>行高。</p>\n<p><code class="codespan">rich</code> 中如果没有设置 <code class="codespan">lineHeight</code>,则会取父层级的 <code class="codespan">lineHeight</code>。例如:</p>\n<pre><code class="lang-js">{\n lineHeight: 56,\n rich: {\n a: {\n // 没有设置 `lineHeight`,则 `lineHeight` 为 56\n }\n }\n}\n</code></pre>\n',uiControl:{type:"number",min:"0",step:"1",default:"12"}},"tooltip.textStyle.width":{desc:"\n\n<p>文本显示宽度。</p>\n",uiControl:{type:"number",default:"100",min:"1",max:"500",step:"1"}},"tooltip.textStyle.height":{desc:"\n\n<p>文本显示高度。</p>\n",uiControl:{type:"number",default:"50",min:"1",max:"500",step:"1"}},"tooltip.textStyle.textBorderColor":{desc:"\n\n<p>文字本身的描边颜色。</p>\n",uiControl:{type:"color"}},"tooltip.textStyle.textBorderWidth":{desc:"\n\n<p>文字本身的描边宽度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"tooltip.textStyle.textShadowColor":{desc:"\n\n<p>文字本身的阴影颜色。</p>\n",uiControl:{type:"color",default:"#000"}},"tooltip.textStyle.textShadowBlur":{desc:"\n\n<p>文字本身的阴影长度。</p>\n",uiControl:{type:"number",min:"0",step:"0.5"}},"tooltip.textStyle.textShadowOffsetX":{desc:"\n\n<p>文字本身的阴影 X 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"tooltip.textStyle.textShadowOffsetY":{desc:"\n\n<p>文字本身的阴影 Y 偏移。</p>\n",uiControl:{type:"number",step:"0.5"}},"tooltip.textStyle.overflow":{desc:'\n\n<p>文字超出宽度是否截断或者换行。配置<code class="codespan">width</code>时有效</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 截断,并在末尾显示<code class="codespan">ellipsis</code>配置的文本,默认为<code class="codespan">...</code></li>\n<li><code class="codespan">'break'</code> 换行</li>\n<li><code class="codespan">'breakAll'</code> 换行,跟<code class="codespan">'break'</code>不同的是,在英语等拉丁文中,<code class="codespan">'breakAll'</code>还会强制单词内换行</li>\n</ul>\n',uiControl:{type:"enum",options:"truncate,break,breakAll"}},"tooltip.textStyle.ellipsis":{desc:'<p>在<code class="codespan">overflow</code>配置为<code class="codespan">'truncate'</code>的时候,可以通过该属性配置末尾显示的文本。</p>\n'},"tooltip.textStyle.lineOverflow":{desc:'<p>文本超出高度部分是否截断,配置<code class="codespan">height</code>时有效。</p>\n<ul>\n<li><code class="codespan">'truncate'</code> 在文本行数超出高度部分截断。</li>\n</ul>\n'},"tooltip.extraCssText":{desc:'<p><br></p>\n<blockquote>\n<p><strong>注意:</strong><code class="codespan">series.tooltip</code> 仅在 <a href="#tooltip.trigger">tooltip.trigger</a> 为 <code class="codespan">'item'</code> 时有效。<br></p>\n</blockquote>\n<p>额外附加到浮层的 css 样式。如下为浮层添加阴影的示例:</p>\n<pre><code class="lang-js">extraCssText: 'box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);'\n</code></pre>\n'}})]}})); |