{"$schema":"http://echarts.baidu.com/doc/json-schem","option":{"type":"Object","properties":{"title":{"type":["Object"],"description":"<p>Title component, including main title and subtitle.</p>\n<p>In ECharts 2.x, a single instance of ECharts could contains one title component at most. However, in ECharts 3, there could be one or more than one title components. It is more useful when multiple diagrams in one instance all need titles.</p>\n<p><strong>Here are some instances of different animation easing functions, among which every instance has a title component: </strong></p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=line-easing&edit=1&reset=1\" width=\"700\" height=\"400\" ></iframe>\n\n\n\n\n","properties":{"id":{"type":["string"]},"show":{"type":["boolean"],"default":true},"text":{"type":["string"],"default":"''"},"link":{"type":["string"],"default":"''"},"target":{"type":["string"],"default":"'blank'"},"textStyle":{"type":["*"],"description":"","properties":{"color":{"type":["Color"],"default":"'#333'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":18},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}},"subtext":{"type":["string"],"default":"''"},"sublink":{"type":["string"],"default":"''"},"subtarget":{"type":["string"],"default":"'blank'"},"subtextStyle":{"type":["*"],"description":"","properties":{"color":{"type":["Color"],"default":"'#aaa'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}},"padding":{"type":["number"],"default":5},"itemGap":{"type":["number"],"default":10},"zlevel":{"type":["number"],"default":0},"z":{"type":["number"],"default":2},"left":{"type":["string","number"],"default":"'auto'"},"top":{"type":["string","number"],"default":"'auto'"},"right":{"type":["string","number"],"default":"'auto'"},"bottom":{"type":["string","number"],"default":"'auto'"},"backgroundColor":{"type":["Color"],"default":"'transparent'"},"borderColor":{"type":["Color"],"default":"'#ccc'"},"borderWidth":{"type":["number"],"default":1},"borderRadius":{"type":["number","Array"],"default":0},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0}}},"legend":{"type":["Object"],"description":"<p>Legend component.</p>\n<p>Legend component shows symbol, color and name of different series. You can click legends to toggle displaying series in the chart.</p>\n<p>In ECharts 3, a single echarts instance may contain multiple legend components, which makes it easier for the layout of multiple legend components.</p>\n<p>If there have to be too many legend items, <a href=\"http://echarts.baidu.com/gallery/editor.html?c=pie-legend&amp;edit=1&amp;reset=1\" target=\"_blank\">vertically scrollable legend</a> or <a href=\"http://echarts.baidu.com/gallery/editor.html?c=radar2&amp;edit=1&amp;reset=1\" target=\"_blank\">horizontally scrollable legend</a> are options to paginate them. Check <a href=\"#legend.type\">legend.type</a> please.</p>\n","properties":{"type":{"type":["string"]},"id":{"type":["string"]},"show":{"type":["boolean"],"default":true},"zlevel":{"type":["number"],"default":0},"z":{"type":["number"],"default":2},"left":{"type":["string","number"],"default":"'auto'"},"top":{"type":["string","number"],"default":"'auto'"},"right":{"type":["string","number"],"default":"'auto'"},"bottom":{"type":["string","number"],"default":"'auto'"},"width":{"type":["string","number"],"default":"'auto'"},"height":{"type":["string","number"],"default":"'auto'"},"orient":{"type":["string"],"default":"'horizontal'"},"align":{"type":["string"],"default":"'auto'"},"padding":{"type":["number"],"default":5},"itemGap":{"type":["number"],"default":10},"itemWidth":{"type":["number"],"default":25},"itemHeight":{"type":["number"],"default":14},"symbolKeepAspect":{"type":["boolean"],"default":true},"formatter":{"type":["string","Function"],"default":null},"selectedMode":{"type":["string","boolean"],"default":true},"inactiveColor":{"type":["Color"],"default":"'#ccc'"},"selected":{"type":["Object"]},"textStyle":{"type":["Object"],"description":"<p>Legend text style.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}},"tooltip":{"type":["Object"]},"data":{"type":["Array"],"description":"<p>Data array of legend. An array item is usually a <code>name</code> representing string. (If it is a <a href=\"#series-pie\">pie chart</a>, it could also be the <code>name</code> of a single data in the pie chart) of a series. Legend component would automatically calculate the color and icon according to series. Special string <code>&#39;&#39;</code> (null string) or <code>&#39;\\n&#39;</code> (new line string) can be used for a new line.</p>\n<p>If <code>data</code> is not specified, it will be auto collected from series. For most of series, it will be collected from <a href=\"#series.name\">series.name</a> or the dimension name specified by <code>seriesName</code> of <a href=\"#series.encode\">series.encode</a>. For some types of series like <a href=\"#series-pie\">pie</a> and <a href=\"#series-funnel\">funnel</a>, it will be collected from the name field of <code>series.data</code>.</p>\n<p>If you need to set the style for a single item, you may also set the configuration of it. In this case, <code>name</code> attribute is used to represent name of <code>series</code>.</p>\n<p>Example:</p>\n<pre><code>data: [{\n    name: &#39;series 1&#39;,\n    // compulsorily set icon as a circle\n    icon: &#39;circle&#39;,\n    // set up the text in red\n    textStyle: {\n        color: &#39;red&#39;\n    }\n}]\n</code></pre>","items":{"type":"Object","properties":{"name":{"type":["string"]},"icon":{"type":["string"]},"textStyle":{"type":["Object"]}}}},"backgroundColor":{"type":["Color"],"default":"'transparent'"},"borderColor":{"type":["Color"],"default":"'#ccc'"},"borderWidth":{"type":["number"],"default":1},"borderRadius":{"type":["number","Array"],"default":0},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"scrollDataIndex":{"type":["number"],"default":0},"pageButtonItemGap":{"type":["number"],"default":5},"pageButtonGap":{"type":["number"],"default":null},"pageButtonPosition":{"type":["string"],"default":"'end'"},"pageFormatter":{"type":["string","Function"],"default":"'{current}/{total}'"},"pageIcons":{"type":["Object"],"description":"<p>It works when <a href=\"#legend.type\">legend.type</a> is <code>&#39;scroll&#39;</code>.</p>\n<p>The icons of page buttons.</p>\n","properties":{"horizontal":{"type":["Array"]},"vertical":{"type":["Array"]}}},"pageIconColor":{"type":["string"],"default":"'#2f4554'"},"pageIconInactiveColor":{"type":["string"],"default":"'#aaa'"},"pageIconSize":{"type":["number","Array"],"default":15},"pageTextStyle":{"type":["Object"],"description":"<p>It works when <a href=\"#legend.type\">legend.type</a> is <code>&#39;scroll&#39;</code>.</p>\n<p>The text style of page info.</p>\n","properties":{"color":{"type":["Color"],"default":"#333"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"animation":{"type":["boolean"]},"animationDurationUpdate":{"type":["number"],"default":800}}},"grid":{"type":["Object"],"description":"<p>Drawing grid in rectangular coordinate. In a single grid, at most two X and Y axes each is allowed. <a href=\"#series-line\">Line chart</a>, <a href=\"#series-bar\">bar chart</a>, and <a href=\"#series-scatter\">scatter chart (bubble chart)</a> can be drawn in grid.</p>\n<p>In ECharts 2.x, there could only be one single grid component at most in a single echarts instance. But in ECharts 3, there is no limitation.</p>\n<p><strong>Following is an example of Anscombe Quartet:</strong></p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=scatter-anscombe-quartet&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n\n","properties":{"id":{"type":["string"]},"show":{"type":["boolean"],"default":false},"zlevel":{"type":["number"],"default":0},"z":{"type":["number"],"default":2},"left":{"type":["string","number"],"default":"'10%'"},"top":{"type":["string","number"],"default":60},"right":{"type":["string","number"],"default":"'10%'"},"bottom":{"type":["string","number"],"default":60},"width":{"type":["string","number"],"default":"'auto'"},"height":{"type":["string","number"],"default":"'auto'"},"containLabel":{"type":["boolean"],"default":false},"backgroundColor":{"type":["Color"],"default":"'transparent'"},"borderColor":{"type":["Color"],"default":"'#ccc'"},"borderWidth":{"type":["number"],"default":1},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"tooltip":{"type":["*"],"description":"<p>tooltip settings in the coordinate system component.</p>\n<hr>\n<p><strong>General Introduction:</strong></p>\n<p>tooltip can be configured on different places:</p>\n<ul>\n<li><p>Configured on global: <a href=\"#tooltip\">tooltip</a></p>\n</li>\n<li><p>Configured in a coordinate system: <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>Configured in a series: <a href=\"#series.tooltip\">series.tooltip</a></p>\n</li>\n<li><p>Configured in each item of <code>series.data</code>: <a href=\"#series.data.tooltip\">series.data.tooltip</a></p>\n</li>\n</ul>\n<hr>\n","properties":{"show":{"type":["boolean"],"default":true},"trigger":{"type":["string"],"default":"'item'"},"axisPointer":{"type":["Object"],"description":"<p>Configuration item for axis indicator.</p>\n<p><code>tooltip.axisPointer</code> is like syntactic sugar of axisPointer settings on axes (for example, <a href=\"#xAxis.axisPointer\">xAxis.axisPointer</a> or <a href=\"#angleAxis.axisPointer\">angleAxis.axisPointer</a>). More detailed features can be configured on <code>someAxis.axisPointer</code>. But in common cases, using <code>tooltip.axisPinter</code> is more convenient.</p>\n<blockquote>\n<p><strong>Notice:</strong> configurations of <code>tooltip.axisPointer</code> has lower priority than that of <code>someAxis.axisPointer</code>.</p>\n</blockquote>\n<hr>\n<p><code>axisPointer</code> is a tool for displaying reference line and axis value under mouse pointer.</p>\n<p>For example:</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=doc-example/candlestick-axisPointer&edit=1&reset=1\" width=\"600\" height=\"450\" ></iframe>\n\n\n<p>In the demo above, <a href=\"#axisPointer.link\">axisPointer.link</a> is used to link axisPointer from different coordinate systems.</p>\n<p><code>axisPointer</code> can also be used on touch device, where user can drag the button to move the reference line and label.</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=line-tooltip-touch&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n<p>In the cases that more than one axis exist, axisPointer helps to look inside the data.</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=multiple-y-axis&edit=1&reset=1\" width=\"600\" height=\"300\" ></iframe>\n\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=multiple-x-axis&edit=1&reset=1\" width=\"600\" height=\"300\" ></iframe>\n\n\n\n<hr>\n<blockquote>\n<p><strong>Notice:</strong>\nGenerally, axisPointers is configured in each axes who need them (for example <a href=\"#xAxis.axisPointer\">xAxis.axisPointer</a>), or configured in <code>tooltip</code> (for example <a href=\"#tooltip.axisPointer\">tooltip.axisPointer</a>).</p>\n<p>But these configurations can only be configured in global axisPointer:\n<a href=\"#axisPointer.triggerOn\">axisPointer.triggerOn</a>, <a href=\"#axisPointer.link\">axisPointer.link</a>。</p>\n</blockquote>\n<hr>\n<hr>\n<p><strong>How to display axisPointer:</strong></p>\n<p>In <a href=\"#grid\">cartesian (grid)</a> and <a href=\"#single\">polar](~polar) and (single axis</a>, each axis has its own axisPointer.</p>\n<p>Those axisPointer will not be displayed by default, utill configured as follows:</p>\n<ul>\n<li><p>Set <code>someAxis.axisPointer.show</code> (like <a href=\"#xAxis.axisPointer.show\">xAxis.axisPointer.show</a>) as <code>true</code>. Then axisPointer of this axis will be displayed.</p>\n</li>\n<li><p>Set <a href=\"#tooltip.trigger\">tooltip.trigger</a> as <code>&#39;axis&#39;</code>, or set <a href=\"#tooltip.axisPointer.type\">tooltip.axisPointer.type</a> as <code>&#39;cross&#39;</code>. Then coordinate system will automatically chose the axes who will display their axisPointers. (<a href=\"#tooltip.axisPointer.axis\">tooltip.axisPointer.axis</a> can be used to change the choice.) Notice, <code>axis.axisPointer</code> will override <code>tooltip.axisPointer</code> settings.</p>\n</li>\n</ul>\n<hr>\n<p><strong>How to display the label of axisPointer:</strong></p>\n<p>The label of axisPointer will not be displayed by default(namely, only reference line will be displayed by default), utill configured as follows:</p>\n<ul>\n<li><p>Set <code>someAxis.axisPointer.label.show</code> (for example <a href=\"#xAxis.axisPointer.show\">xAxis.axisPointer.label.show</a>) as <code>true</code>. Then the label of the axisPointer will be displayed.</p>\n</li>\n<li><p>Set <a href=\"#tooltip.axisPointer.type\">tooltip.axisPointer.type</a> as  <code>&#39;cross&#39;</code>. Then the label of the crossed axisPointers will be displayed.</p>\n</li>\n</ul>\n<hr>\n<p><strong>How to configure axisPointer on touch device:</strong></p>\n<p>Set <code>someAxis.axisPointer.handle.show</code> (for example <a href=\"#xAxis.axisPointer.handle.show\">xAxis.axisPointer.handle.show</a> as <code>true</code>. Then the button for dragging will be displayed. (This feature is not supported on polar).</p>\n<p><strong>Notice:</strong>\nIf tooltip does not work well in this case, try to set<a href=\"#tooltip.triggerOn\">tooltip.triggerOn</a> as <code>&#39;none&#39;</code> (for the effect: show tooltip when finger holding on the button, and hide tooltip after finger left the button), or set <a href=\"#tooltip.alwaysShowContent\">tooltip.alwaysShowContent</a> as <code>true</code> (then tooltip will always be displayed).</p>\n<p>See the <a href=\"http://echarts.baidu.com/gallery/editor.html?c=line-tooltip-touch&amp;edit=1&amp;reset=1\" target=\"_blank\">example</a>.</p>\n<hr>\n<p><strong>Snap to point</strong></p>\n<p>In value axis and time axis, if <a href=\"#xAxis.axisPointer.snap\">snap</a> is set as true, axisPointer will snap to point automatically.</p>\n<hr>\n","properties":{"type":{"type":["string"],"default":"'line'"},"axis":{"type":["string"],"default":"'auto'"},"snap":{"type":["boolean"]},"z":{"type":["number"]},"label":{"type":["Object"],"description":"<p>label of axisPointer</p>\n","properties":{"show":{"type":["boolean"],"default":false},"precision":{"type":["number","string"],"default":"'auto'"},"formatter":{"type":["string","Function"],"default":null},"margin":{"type":["boolean"],"default":3},"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"padding":{"type":["string","Array"],"default":"[5, 7, 5, 7]"},"backgroundColor":{"type":["string"],"default":"'auto'"},"borderColor":{"type":["string"],"default":null},"borderWidth":{"type":["string"],"default":0},"shadowBlur":{"type":["number"],"default":3},"shadowColor":{"type":["Color"],"default":"#aaa"},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0}}},"lineStyle":{"type":["Object"],"description":"<p>It is valid when <a href=\"#tooltip.axisPointer.type\">axisPointer.type</a> is <code>&#39;line&#39;</code>.</p>\n","properties":{"color":{"type":["Color"],"default":"#555"},"width":{"type":["number"],"default":1},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}},"shadowStyle":{"type":["Object"],"description":"<p>It is valid when <a href=\"#tooltip.axisPointer.type\">axisPointer.type</a> is <code>&#39;shadow&#39;</code>.</p>\n","properties":{"color":{"type":["Color"],"default":"'rgba(150,150,150,0.3)"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}},"crossStyle":{"type":["Object"],"description":"<p>It is valid when <a href=\"#tooltip.axisPointer.type\">axisPointer.type</a> is <code>&#39;cross&#39;</code>.</p>\n","properties":{"color":{"type":["Color"],"default":"#555"},"width":{"type":["number"],"default":1},"type":{"type":["string"],"default":"dashed"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"position":{"type":["string","Array"]},"formatter":{"type":["string","Function"]},"backgroundColor":{"type":["Color"],"default":"'rgba(50,50,50,0.7)'"},"borderColor":{"type":["Color"],"default":"'#333'"},"borderWidth":{"type":["number"],"default":0},"padding":{"type":["number"],"default":5},"textStyle":{"type":["Object"],"description":"<p>The text syle of tooltip&#39;s floating layer.</p>\n","properties":{"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":14},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"extraCssText":{"type":["string"]}}}}},"xAxis":{"type":["Object"],"description":"<p>The x axis in cartesian(rectangular) coordinate. Usually a single grid component can place at most 2 x axis, one on the bottom and another on the top. <a href=\"#xAxis.offset\">offset</a> can be used to avoid overlap when you need to put more than two x axis.</p>\n","properties":{"id":{"type":["string"]},"show":{"type":["boolean"],"default":true},"gridIndex":{"type":["number"],"default":0},"position":{"type":["string"]},"offset":{"type":["number"],"default":0},"type":{"type":["string"],"default":"'category'"},"name":{"type":["string"]},"nameLocation":{"type":["string"],"default":"'start'"},"nameTextStyle":{"type":["Object"],"description":"<p>Text style of axis name.</p>\n","properties":{"color":{"type":["Color"]},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}},"nameGap":{"type":["number"],"default":15},"nameRotate":{"type":["number"],"default":null},"inverse":{"type":["boolean"],"default":false},"boundaryGap":{"type":["boolean","Array"]},"min":{"type":["number","string"],"default":null},"max":{"type":["number","string"],"default":null},"scale":{"type":["boolean"],"default":false},"splitNumber":{"type":["number"],"default":5},"minInterval":{"type":["number"]},"interval":{"type":["number"]},"logBase":{"type":["number"],"default":10},"silent":{"type":["boolean"],"default":false},"triggerEvent":{"type":["boolean"],"default":false},"axisLine":{"type":["Object"],"description":"<p>Settings related to axis line.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"onZero":{"type":["boolean"],"default":true},"onZeroAxisIndex":{"type":["number"]},"symbol":{"type":["string","Array"],"default":"'none'"},"symbolSize":{"type":["Array"],"default":"[10, 15]"},"symbolOffset":{"type":["Array","number"],"default":"[0, 0]"},"lineStyle":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"'#333'"},"width":{"type":["number"],"default":1},"type":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"axisTick":{"type":["Object"],"description":"<p>Settings related to axis tick.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"alignWithLabel":{"type":["boolean"],"default":false},"interval":{"type":["number","Function"],"default":"'auto'"},"inside":{"type":["boolean"],"default":false},"length":{"type":["number"],"default":5},"lineStyle":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"]},"width":{"type":["number"],"default":1},"type":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"axisLabel":{"type":["Object"],"description":"<p>Settings related to axis label.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"interval":{"type":["number","Function"],"default":"'auto'"},"inside":{"type":["boolean"],"default":false},"rotate":{"type":["number"],"default":0},"margin":{"type":["number"],"default":8},"formatter":{"type":["string","Function"],"default":null},"showMinLabel":{"type":["boolean"],"default":null},"showMaxLabel":{"type":["boolean"],"default":null},"color":{"type":["Color","Function"]},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}},"splitLine":{"type":["Object"],"description":"<p>SplitLine of axis in <a href=\"#grid\">grid</a> area.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"interval":{"type":["number","Function"],"default":"'auto'"},"lineStyle":{"type":["Object"],"description":"","properties":{"color":{"type":["Array","string"],"default":"['#ccc']"},"width":{"type":["number"],"default":1},"type":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"splitArea":{"type":["Object"],"description":"<p>Split area of axis in <a href=\"#grid\">grid</a> area, not shown by default.</p>\n","properties":{"interval":{"type":["number","Function"],"default":"'auto'"},"show":{"type":["boolean"],"default":false},"areaStyle":{"type":["Object"],"description":"<p>Split area style.</p>\n","properties":{"color":{"type":["Array"],"default":"['rgba(250,250,250,0.3)','rgba(200,200,200,0.3)']"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["Array"],"description":"<p>Category data, available in <a href=\"#xAxis.type\">type</a>: &#39;category&#39; axis.</p>\n<p>If <a href=\"#xAxis.type\">type</a> is not specified, but <code>axis.data</code> is specified, the <a href=\"#xAxis.type\">type</a> is auto set as <code>&#39;category&#39;</code>.</p>\n<p>If <a href=\"#xAxis.type\">type</a> is specified as <code>&#39;category&#39;</code>, but <code>axis.data</code> is not specified, <code>axis.data</code> will be auto collected from <a href=\"#series.data\">series.data</a>. It brings convenience, but we should notice that <code>axis.data</code> provides then value range of the <code>&#39;category&#39;</code> axis. If  it is auto collected from <a href=\"#series.data\">series.data</a>, Only the values appearing in <a href=\"#series.data\">series.data</a> can be collected. For example, if <a href=\"#series.data\">series.data</a> is empty, nothing will be collected.</p>\n<p>Example:</p>\n<pre><code class=\"lang-js\">// Name list of all categories\ndata: [&#39;Monday&#39;, &#39;Tuesday&#39;, &#39;Wednesday&#39;, &#39;Thursday&#39;, &#39;Friday&#39;, &#39;Saturday&#39;, &#39;Sunday&#39;]\n// Each item could also be a specific configuration item.\n// In this case, `value` is used as the category name.\ndata: [{\n    value: &#39;Monday&#39;,\n    // Highlight Monday\n    textStyle: {\n        fontSize: 20,\n        color: &#39;red&#39;\n    }\n}, &#39;Tuesday&#39;, &#39;Wednesday&#39;, &#39;Thursday&#39;, &#39;Friday&#39;, &#39;Saturday&#39;, &#39;Sunday&#39;]\n</code></pre>\n","items":{"type":"Object","properties":{"value":{"type":["string"]},"textStyle":{"type":["Object"],"description":"<p>Text style of the category.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}},"axisPointer":{"type":["Object"],"description":"<p>axisPointer settings on the axis.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"type":{"type":["string"],"default":"'line'"},"snap":{"type":["boolean"]},"z":{"type":["number"]},"label":{"type":["Object"],"description":"<p>label of axisPointer</p>\n","properties":{"show":{"type":["boolean"],"default":false},"precision":{"type":["number","string"],"default":"'auto'"},"formatter":{"type":["string","Function"],"default":null},"margin":{"type":["boolean"],"default":3},"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"padding":{"type":["string","Array"],"default":"[5, 7, 5, 7]"},"backgroundColor":{"type":["string"],"default":"'auto'"},"borderColor":{"type":["string"],"default":null},"borderWidth":{"type":["string"],"default":0},"shadowBlur":{"type":["number"],"default":3},"shadowColor":{"type":["Color"],"default":"#aaa"},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0}}},"lineStyle":{"type":["Object"],"description":"<p>It is valid when <a href=\"#tooltip.axisPointer.type\">axisPointer.type</a> is <code>&#39;line&#39;</code>.</p>\n","properties":{"color":{"type":["Color"],"default":"#555"},"width":{"type":["number"],"default":1},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}},"shadowStyle":{"type":["Object"],"description":"<p>It is valid when <a href=\"#tooltip.axisPointer.type\">axisPointer.type</a> is <code>&#39;shadow&#39;</code>.</p>\n","properties":{"color":{"type":["Color"],"default":"'rgba(150,150,150,0.3)"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}},"triggerTooltip":{"type":["boolean"],"default":true},"value":{"type":["number"],"default":null},"status":{"type":["boolean"]},"handle":{"type":["Object"],"description":"<p>A button used to drag axisPointer. This feature is applicable in touch device. See <a href=\"http://echarts.baidu.com/gallery/editor.html?c=line-tooltip-touch&amp;edit=1&amp;reset=1\" target=\"_blank\">example</a>.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"icon":{"type":["*"]},"size":{"type":["number","Array"],"default":45},"margin":{"type":["number"],"default":50},"color":{"type":["string"],"default":"'#333'"},"throttle":{"type":["number"],"default":40},"shadowBlur":{"type":["number"],"default":3},"shadowColor":{"type":["Color"],"default":"#aaa"},"shadowOffsetX":{"type":["number"],"default":2},"shadowOffsetY":{"type":["number"],"default":0}}}}},"zlevel":{"type":["number"],"default":0},"z":{"type":["number"],"default":0}}},"yAxis":{"type":["Object"],"description":"<p>The y axis in cartesian(rectangular) coordinate. Usually a single grid component can place at most 2 y axis, one on the left and another on the right. <a href=\"#yAxis.offset\">offset</a> can be used to avoid overlap when you need to put more than two y axis.</p>\n","properties":{"id":{"type":["string"]},"show":{"type":["boolean"],"default":true},"gridIndex":{"type":["number"],"default":0},"position":{"type":["string"]},"offset":{"type":["number"],"default":0},"type":{"type":["string"],"default":"'value'"},"name":{"type":["string"]},"nameLocation":{"type":["string"],"default":"'start'"},"nameTextStyle":{"type":["Object"],"description":"<p>Text style of axis name.</p>\n","properties":{"color":{"type":["Color"]},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}},"nameGap":{"type":["number"],"default":15},"nameRotate":{"type":["number"],"default":null},"inverse":{"type":["boolean"],"default":false},"boundaryGap":{"type":["boolean","Array"]},"min":{"type":["number","string"],"default":null},"max":{"type":["number","string"],"default":null},"scale":{"type":["boolean"],"default":false},"splitNumber":{"type":["number"],"default":5},"minInterval":{"type":["number"]},"interval":{"type":["number"]},"logBase":{"type":["number"],"default":10},"silent":{"type":["boolean"],"default":false},"triggerEvent":{"type":["boolean"],"default":false},"axisLine":{"type":["Object"],"description":"<p>Settings related to axis line.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"onZero":{"type":["boolean"],"default":true},"onZeroAxisIndex":{"type":["number"]},"symbol":{"type":["string","Array"],"default":"'none'"},"symbolSize":{"type":["Array"],"default":"[10, 15]"},"symbolOffset":{"type":["Array","number"],"default":"[0, 0]"},"lineStyle":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"'#333'"},"width":{"type":["number"],"default":1},"type":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"axisTick":{"type":["Object"],"description":"<p>Settings related to axis tick.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"alignWithLabel":{"type":["boolean"],"default":false},"interval":{"type":["number","Function"],"default":"'auto'"},"inside":{"type":["boolean"],"default":false},"length":{"type":["number"],"default":5},"lineStyle":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"]},"width":{"type":["number"],"default":1},"type":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"axisLabel":{"type":["Object"],"description":"<p>Settings related to axis label.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"interval":{"type":["number","Function"],"default":"'auto'"},"inside":{"type":["boolean"],"default":false},"rotate":{"type":["number"],"default":0},"margin":{"type":["number"],"default":8},"formatter":{"type":["string","Function"],"default":null},"showMinLabel":{"type":["boolean"],"default":null},"showMaxLabel":{"type":["boolean"],"default":null},"color":{"type":["Color","Function"]},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}},"splitLine":{"type":["Object"],"description":"<p>SplitLine of axis in <a href=\"#grid\">grid</a> area.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"interval":{"type":["number","Function"],"default":"'auto'"},"lineStyle":{"type":["Object"],"description":"","properties":{"color":{"type":["Array","string"],"default":"['#ccc']"},"width":{"type":["number"],"default":1},"type":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"splitArea":{"type":["Object"],"description":"<p>Split area of axis in <a href=\"#grid\">grid</a> area, not shown by default.</p>\n","properties":{"interval":{"type":["number","Function"],"default":"'auto'"},"show":{"type":["boolean"],"default":false},"areaStyle":{"type":["Object"],"description":"<p>Split area style.</p>\n","properties":{"color":{"type":["Array"],"default":"['rgba(250,250,250,0.3)','rgba(200,200,200,0.3)']"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["Array"],"description":"<p>Category data, available in <a href=\"#yAxis.type\">type</a>: &#39;category&#39; axis.</p>\n<p>If <a href=\"#yAxis.type\">type</a> is not specified, but <code>axis.data</code> is specified, the <a href=\"#yAxis.type\">type</a> is auto set as <code>&#39;category&#39;</code>.</p>\n<p>If <a href=\"#yAxis.type\">type</a> is specified as <code>&#39;category&#39;</code>, but <code>axis.data</code> is not specified, <code>axis.data</code> will be auto collected from <a href=\"#series.data\">series.data</a>. It brings convenience, but we should notice that <code>axis.data</code> provides then value range of the <code>&#39;category&#39;</code> axis. If  it is auto collected from <a href=\"#series.data\">series.data</a>, Only the values appearing in <a href=\"#series.data\">series.data</a> can be collected. For example, if <a href=\"#series.data\">series.data</a> is empty, nothing will be collected.</p>\n<p>Example:</p>\n<pre><code class=\"lang-js\">// Name list of all categories\ndata: [&#39;Monday&#39;, &#39;Tuesday&#39;, &#39;Wednesday&#39;, &#39;Thursday&#39;, &#39;Friday&#39;, &#39;Saturday&#39;, &#39;Sunday&#39;]\n// Each item could also be a specific configuration item.\n// In this case, `value` is used as the category name.\ndata: [{\n    value: &#39;Monday&#39;,\n    // Highlight Monday\n    textStyle: {\n        fontSize: 20,\n        color: &#39;red&#39;\n    }\n}, &#39;Tuesday&#39;, &#39;Wednesday&#39;, &#39;Thursday&#39;, &#39;Friday&#39;, &#39;Saturday&#39;, &#39;Sunday&#39;]\n</code></pre>\n","items":{"type":"Object","properties":{"value":{"type":["string"]},"textStyle":{"type":["Object"],"description":"<p>Text style of the category.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}},"axisPointer":{"type":["Object"],"description":"<p>axisPointer settings on the axis.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"type":{"type":["string"],"default":"'line'"},"snap":{"type":["boolean"]},"z":{"type":["number"]},"label":{"type":["Object"],"description":"<p>label of axisPointer</p>\n","properties":{"show":{"type":["boolean"],"default":false},"precision":{"type":["number","string"],"default":"'auto'"},"formatter":{"type":["string","Function"],"default":null},"margin":{"type":["boolean"],"default":3},"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"padding":{"type":["string","Array"],"default":"[5, 7, 5, 7]"},"backgroundColor":{"type":["string"],"default":"'auto'"},"borderColor":{"type":["string"],"default":null},"borderWidth":{"type":["string"],"default":0},"shadowBlur":{"type":["number"],"default":3},"shadowColor":{"type":["Color"],"default":"#aaa"},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0}}},"lineStyle":{"type":["Object"],"description":"<p>It is valid when <a href=\"#tooltip.axisPointer.type\">axisPointer.type</a> is <code>&#39;line&#39;</code>.</p>\n","properties":{"color":{"type":["Color"],"default":"#555"},"width":{"type":["number"],"default":1},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}},"shadowStyle":{"type":["Object"],"description":"<p>It is valid when <a href=\"#tooltip.axisPointer.type\">axisPointer.type</a> is <code>&#39;shadow&#39;</code>.</p>\n","properties":{"color":{"type":["Color"],"default":"'rgba(150,150,150,0.3)"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}},"triggerTooltip":{"type":["boolean"],"default":true},"value":{"type":["number"],"default":null},"status":{"type":["boolean"]},"handle":{"type":["Object"],"description":"<p>A button used to drag axisPointer. This feature is applicable in touch device. See <a href=\"http://echarts.baidu.com/gallery/editor.html?c=line-tooltip-touch&amp;edit=1&amp;reset=1\" target=\"_blank\">example</a>.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"icon":{"type":["*"]},"size":{"type":["number","Array"],"default":45},"margin":{"type":["number"],"default":50},"color":{"type":["string"],"default":"'#333'"},"throttle":{"type":["number"],"default":40},"shadowBlur":{"type":["number"],"default":3},"shadowColor":{"type":["Color"],"default":"#aaa"},"shadowOffsetX":{"type":["number"],"default":2},"shadowOffsetY":{"type":["number"],"default":0}}}}},"zlevel":{"type":["number"],"default":0},"z":{"type":["number"],"default":0}}},"polar":{"type":["Object"],"description":"<p>Polar coordinate can be used in scatter and line chart. Every polar coordinate has an <a href=\"#angleAxis\">angleAxis</a> and a <a href=\"#radiusAxis\">radiusAxis</a>.</p>\n<p><strong>For example: </strong></p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=scatter-polar-punchCard&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n\n","properties":{"id":{"type":["string"]},"zlevel":{"type":["number"],"default":0},"z":{"type":["number"],"default":2},"center":{"type":["Array"],"default":"['50%', '50%']"},"radius":{"type":["Array"]},"tooltip":{"type":["*"],"description":"<p>tooltip settings in the coordinate system component.</p>\n<hr>\n<p><strong>General Introduction:</strong></p>\n<p>tooltip can be configured on different places:</p>\n<ul>\n<li><p>Configured on global: <a href=\"#tooltip\">tooltip</a></p>\n</li>\n<li><p>Configured in a coordinate system: <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>Configured in a series: <a href=\"#series.tooltip\">series.tooltip</a></p>\n</li>\n<li><p>Configured in each item of <code>series.data</code>: <a href=\"#series.data.tooltip\">series.data.tooltip</a></p>\n</li>\n</ul>\n<hr>\n","properties":{"show":{"type":["boolean"],"default":true},"trigger":{"type":["string"],"default":"'item'"},"axisPointer":{"type":["Object"],"description":"<p>Configuration item for axis indicator.</p>\n<p><code>tooltip.axisPointer</code> is like syntactic sugar of axisPointer settings on axes (for example, <a href=\"#xAxis.axisPointer\">xAxis.axisPointer</a> or <a href=\"#angleAxis.axisPointer\">angleAxis.axisPointer</a>). More detailed features can be configured on <code>someAxis.axisPointer</code>. But in common cases, using <code>tooltip.axisPinter</code> is more convenient.</p>\n<blockquote>\n<p><strong>Notice:</strong> configurations of <code>tooltip.axisPointer</code> has lower priority than that of <code>someAxis.axisPointer</code>.</p>\n</blockquote>\n<hr>\n<p><code>axisPointer</code> is a tool for displaying reference line and axis value under mouse pointer.</p>\n<p>For example:</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=doc-example/candlestick-axisPointer&edit=1&reset=1\" width=\"600\" height=\"450\" ></iframe>\n\n\n<p>In the demo above, <a href=\"#axisPointer.link\">axisPointer.link</a> is used to link axisPointer from different coordinate systems.</p>\n<p><code>axisPointer</code> can also be used on touch device, where user can drag the button to move the reference line and label.</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=line-tooltip-touch&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n<p>In the cases that more than one axis exist, axisPointer helps to look inside the data.</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=multiple-y-axis&edit=1&reset=1\" width=\"600\" height=\"300\" ></iframe>\n\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=multiple-x-axis&edit=1&reset=1\" width=\"600\" height=\"300\" ></iframe>\n\n\n\n<hr>\n<blockquote>\n<p><strong>Notice:</strong>\nGenerally, axisPointers is configured in each axes who need them (for example <a href=\"#xAxis.axisPointer\">xAxis.axisPointer</a>), or configured in <code>tooltip</code> (for example <a href=\"#tooltip.axisPointer\">tooltip.axisPointer</a>).</p>\n<p>But these configurations can only be configured in global axisPointer:\n<a href=\"#axisPointer.triggerOn\">axisPointer.triggerOn</a>, <a href=\"#axisPointer.link\">axisPointer.link</a>。</p>\n</blockquote>\n<hr>\n<hr>\n<p><strong>How to display axisPointer:</strong></p>\n<p>In <a href=\"#grid\">cartesian (grid)</a> and <a href=\"#single\">polar](~polar) and (single axis</a>, each axis has its own axisPointer.</p>\n<p>Those axisPointer will not be displayed by default, utill configured as follows:</p>\n<ul>\n<li><p>Set <code>someAxis.axisPointer.show</code> (like <a href=\"#xAxis.axisPointer.show\">xAxis.axisPointer.show</a>) as <code>true</code>. Then axisPointer of this axis will be displayed.</p>\n</li>\n<li><p>Set <a href=\"#tooltip.trigger\">tooltip.trigger</a> as <code>&#39;axis&#39;</code>, or set <a href=\"#tooltip.axisPointer.type\">tooltip.axisPointer.type</a> as <code>&#39;cross&#39;</code>. Then coordinate system will automatically chose the axes who will display their axisPointers. (<a href=\"#tooltip.axisPointer.axis\">tooltip.axisPointer.axis</a> can be used to change the choice.) Notice, <code>axis.axisPointer</code> will override <code>tooltip.axisPointer</code> settings.</p>\n</li>\n</ul>\n<hr>\n<p><strong>How to display the label of axisPointer:</strong></p>\n<p>The label of axisPointer will not be displayed by default(namely, only reference line will be displayed by default), utill configured as follows:</p>\n<ul>\n<li><p>Set <code>someAxis.axisPointer.label.show</code> (for example <a href=\"#xAxis.axisPointer.show\">xAxis.axisPointer.label.show</a>) as <code>true</code>. Then the label of the axisPointer will be displayed.</p>\n</li>\n<li><p>Set <a href=\"#tooltip.axisPointer.type\">tooltip.axisPointer.type</a> as  <code>&#39;cross&#39;</code>. Then the label of the crossed axisPointers will be displayed.</p>\n</li>\n</ul>\n<hr>\n<p><strong>How to configure axisPointer on touch device:</strong></p>\n<p>Set <code>someAxis.axisPointer.handle.show</code> (for example <a href=\"#xAxis.axisPointer.handle.show\">xAxis.axisPointer.handle.show</a> as <code>true</code>. Then the button for dragging will be displayed. (This feature is not supported on polar).</p>\n<p><strong>Notice:</strong>\nIf tooltip does not work well in this case, try to set<a href=\"#tooltip.triggerOn\">tooltip.triggerOn</a> as <code>&#39;none&#39;</code> (for the effect: show tooltip when finger holding on the button, and hide tooltip after finger left the button), or set <a href=\"#tooltip.alwaysShowContent\">tooltip.alwaysShowContent</a> as <code>true</code> (then tooltip will always be displayed).</p>\n<p>See the <a href=\"http://echarts.baidu.com/gallery/editor.html?c=line-tooltip-touch&amp;edit=1&amp;reset=1\" target=\"_blank\">example</a>.</p>\n<hr>\n<p><strong>Snap to point</strong></p>\n<p>In value axis and time axis, if <a href=\"#xAxis.axisPointer.snap\">snap</a> is set as true, axisPointer will snap to point automatically.</p>\n<hr>\n","properties":{"type":{"type":["string"],"default":"'line'"},"axis":{"type":["string"],"default":"'auto'"},"snap":{"type":["boolean"]},"z":{"type":["number"]},"label":{"type":["Object"],"description":"<p>label of axisPointer</p>\n","properties":{"show":{"type":["boolean"],"default":false},"precision":{"type":["number","string"],"default":"'auto'"},"formatter":{"type":["string","Function"],"default":null},"margin":{"type":["boolean"],"default":3},"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"padding":{"type":["string","Array"],"default":"[5, 7, 5, 7]"},"backgroundColor":{"type":["string"],"default":"'auto'"},"borderColor":{"type":["string"],"default":null},"borderWidth":{"type":["string"],"default":0},"shadowBlur":{"type":["number"],"default":3},"shadowColor":{"type":["Color"],"default":"#aaa"},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0}}},"lineStyle":{"type":["Object"],"description":"<p>It is valid when <a href=\"#tooltip.axisPointer.type\">axisPointer.type</a> is <code>&#39;line&#39;</code>.</p>\n","properties":{"color":{"type":["Color"],"default":"#555"},"width":{"type":["number"],"default":1},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}},"shadowStyle":{"type":["Object"],"description":"<p>It is valid when <a href=\"#tooltip.axisPointer.type\">axisPointer.type</a> is <code>&#39;shadow&#39;</code>.</p>\n","properties":{"color":{"type":["Color"],"default":"'rgba(150,150,150,0.3)"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}},"crossStyle":{"type":["Object"],"description":"<p>It is valid when <a href=\"#tooltip.axisPointer.type\">axisPointer.type</a> is <code>&#39;cross&#39;</code>.</p>\n","properties":{"color":{"type":["Color"],"default":"#555"},"width":{"type":["number"],"default":1},"type":{"type":["string"],"default":"dashed"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"position":{"type":["string","Array"]},"formatter":{"type":["string","Function"]},"backgroundColor":{"type":["Color"],"default":"'rgba(50,50,50,0.7)'"},"borderColor":{"type":["Color"],"default":"'#333'"},"borderWidth":{"type":["number"],"default":0},"padding":{"type":["number"],"default":5},"textStyle":{"type":["Object"],"description":"<p>The text syle of tooltip&#39;s floating layer.</p>\n","properties":{"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":14},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"extraCssText":{"type":["string"]}}}}},"radiusAxis":{"type":["Object"],"description":"<p>Radial axis of polar coordinate.</p>\n","properties":{"id":{"type":["string"]},"polarIndex":{"type":["number"],"default":0},"type":{"type":["string"],"default":"'value'"},"name":{"type":["string"]},"nameLocation":{"type":["string"],"default":"'start'"},"nameTextStyle":{"type":["Object"],"description":"<p>Text style of axis name.</p>\n","properties":{"color":{"type":["Color"]},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}},"nameGap":{"type":["number"],"default":15},"nameRotate":{"type":["number"],"default":null},"inverse":{"type":["boolean"],"default":false},"boundaryGap":{"type":["boolean","Array"]},"min":{"type":["number","string"],"default":null},"max":{"type":["number","string"],"default":null},"scale":{"type":["boolean"],"default":false},"splitNumber":{"type":["number"],"default":5},"minInterval":{"type":["number"]},"interval":{"type":["number"]},"logBase":{"type":["number"],"default":10},"silent":{"type":["boolean"],"default":false},"triggerEvent":{"type":["boolean"],"default":false},"axisLine":{"type":["Object"],"description":"<p>Settings related to axis line.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"symbol":{"type":["string","Array"],"default":"'none'"},"symbolSize":{"type":["Array"],"default":"[10, 15]"},"symbolOffset":{"type":["Array","number"],"default":"[0, 0]"},"lineStyle":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"'#333'"},"width":{"type":["number"],"default":1},"type":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"axisTick":{"type":["Object"],"description":"<p>Settings related to axis tick.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"alignWithLabel":{"type":["boolean"],"default":false},"interval":{"type":["number","Function"],"default":"'auto'"},"inside":{"type":["boolean"],"default":false},"length":{"type":["number"],"default":5},"lineStyle":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"]},"width":{"type":["number"],"default":1},"type":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"axisLabel":{"type":["Object"],"description":"<p>Settings related to axis label.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"interval":{"type":["number","Function"],"default":"'auto'"},"inside":{"type":["boolean"],"default":false},"rotate":{"type":["number"],"default":0},"margin":{"type":["number"],"default":8},"formatter":{"type":["string","Function"],"default":null},"showMinLabel":{"type":["boolean"],"default":null},"showMaxLabel":{"type":["boolean"],"default":null},"color":{"type":["Color","Function"]},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}},"splitLine":{"type":["Object"],"description":"<p>SplitLine of axis in <a href=\"#grid\">grid</a> area.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"interval":{"type":["number","Function"],"default":"'auto'"},"lineStyle":{"type":["Object"],"description":"","properties":{"color":{"type":["Array","string"],"default":"['#ccc']"},"width":{"type":["number"],"default":1},"type":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"splitArea":{"type":["Object"],"description":"<p>Split area of axis in <a href=\"#grid\">grid</a> area, not shown by default.</p>\n","properties":{"interval":{"type":["number","Function"],"default":"'auto'"},"show":{"type":["boolean"],"default":false},"areaStyle":{"type":["Object"],"description":"<p>Split area style.</p>\n","properties":{"color":{"type":["Array"],"default":"['rgba(250,250,250,0.3)','rgba(200,200,200,0.3)']"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["Array"],"description":"<p>Category data, available in <a href=\"#radiusAxis.type\">type</a>: &#39;category&#39; axis.</p>\n<p>If <a href=\"#radiusAxis.type\">type</a> is not specified, but <code>axis.data</code> is specified, the <a href=\"#radiusAxis.type\">type</a> is auto set as <code>&#39;category&#39;</code>.</p>\n<p>If <a href=\"#radiusAxis.type\">type</a> is specified as <code>&#39;category&#39;</code>, but <code>axis.data</code> is not specified, <code>axis.data</code> will be auto collected from <a href=\"#series.data\">series.data</a>. It brings convenience, but we should notice that <code>axis.data</code> provides then value range of the <code>&#39;category&#39;</code> axis. If  it is auto collected from <a href=\"#series.data\">series.data</a>, Only the values appearing in <a href=\"#series.data\">series.data</a> can be collected. For example, if <a href=\"#series.data\">series.data</a> is empty, nothing will be collected.</p>\n<p>Example:</p>\n<pre><code class=\"lang-js\">// Name list of all categories\ndata: [&#39;Monday&#39;, &#39;Tuesday&#39;, &#39;Wednesday&#39;, &#39;Thursday&#39;, &#39;Friday&#39;, &#39;Saturday&#39;, &#39;Sunday&#39;]\n// Each item could also be a specific configuration item.\n// In this case, `value` is used as the category name.\ndata: [{\n    value: &#39;Monday&#39;,\n    // Highlight Monday\n    textStyle: {\n        fontSize: 20,\n        color: &#39;red&#39;\n    }\n}, &#39;Tuesday&#39;, &#39;Wednesday&#39;, &#39;Thursday&#39;, &#39;Friday&#39;, &#39;Saturday&#39;, &#39;Sunday&#39;]\n</code></pre>\n","items":{"type":"Object","properties":{"value":{"type":["string"]},"textStyle":{"type":["Object"],"description":"<p>Text style of the category.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}},"axisPointer":{"type":["Object"],"description":"<p>axisPointer settings on the axis.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"type":{"type":["string"],"default":"'line'"},"snap":{"type":["boolean"]},"z":{"type":["number"]},"label":{"type":["Object"],"description":"<p>label of axisPointer</p>\n","properties":{"show":{"type":["boolean"],"default":false},"precision":{"type":["number","string"],"default":"'auto'"},"formatter":{"type":["string","Function"],"default":null},"margin":{"type":["boolean"],"default":3},"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"padding":{"type":["string","Array"],"default":"[5, 7, 5, 7]"},"backgroundColor":{"type":["string"],"default":"'auto'"},"borderColor":{"type":["string"],"default":null},"borderWidth":{"type":["string"],"default":0},"shadowBlur":{"type":["number"],"default":3},"shadowColor":{"type":["Color"],"default":"#aaa"},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0}}},"lineStyle":{"type":["Object"],"description":"<p>It is valid when <a href=\"#tooltip.axisPointer.type\">axisPointer.type</a> is <code>&#39;line&#39;</code>.</p>\n","properties":{"color":{"type":["Color"],"default":"#555"},"width":{"type":["number"],"default":1},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}},"shadowStyle":{"type":["Object"],"description":"<p>It is valid when <a href=\"#tooltip.axisPointer.type\">axisPointer.type</a> is <code>&#39;shadow&#39;</code>.</p>\n","properties":{"color":{"type":["Color"],"default":"'rgba(150,150,150,0.3)"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}},"triggerTooltip":{"type":["boolean"],"default":true},"value":{"type":["number"],"default":null},"status":{"type":["boolean"]},"handle":{"type":["Object"],"description":"<p>A button used to drag axisPointer. This feature is applicable in touch device. See <a href=\"http://echarts.baidu.com/gallery/editor.html?c=line-tooltip-touch&amp;edit=1&amp;reset=1\" target=\"_blank\">example</a>.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"icon":{"type":["*"]},"size":{"type":["number","Array"],"default":45},"margin":{"type":["number"],"default":50},"color":{"type":["string"],"default":"'#333'"},"throttle":{"type":["number"],"default":40},"shadowBlur":{"type":["number"],"default":3},"shadowColor":{"type":["Color"],"default":"#aaa"},"shadowOffsetX":{"type":["number"],"default":2},"shadowOffsetY":{"type":["number"],"default":0}}}}},"zlevel":{"type":["number"],"default":0},"z":{"type":["number"],"default":0}}},"angleAxis":{"type":["Object"],"description":"<p>The angle axis in Polar Coordinate.</p>\n","properties":{"id":{"type":["string"]},"polarIndex":{"type":["number"],"default":0},"startAngle":{"type":["number"],"default":90},"clockwise":{"type":["boolean"],"default":true},"type":{"type":["string"],"default":"'category'"},"boundaryGap":{"type":["boolean","Array"]},"min":{"type":["number","string"],"default":null},"max":{"type":["number","string"],"default":null},"scale":{"type":["boolean"],"default":false},"splitNumber":{"type":["number"],"default":5},"minInterval":{"type":["number"]},"interval":{"type":["number"]},"logBase":{"type":["number"],"default":10},"silent":{"type":["boolean"],"default":false},"triggerEvent":{"type":["boolean"],"default":false},"axisLine":{"type":["Object"],"description":"<p>Settings related to axis line.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"symbol":{"type":["string","Array"],"default":"'none'"},"symbolSize":{"type":["Array"],"default":"[10, 15]"},"symbolOffset":{"type":["Array","number"],"default":"[0, 0]"},"lineStyle":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"'#333'"},"width":{"type":["number"],"default":1},"type":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"axisTick":{"type":["Object"],"description":"<p>Settings related to axis tick.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"alignWithLabel":{"type":["boolean"],"default":false},"interval":{"type":["number","Function"],"default":"'auto'"},"inside":{"type":["boolean"],"default":false},"length":{"type":["number"],"default":5},"lineStyle":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"]},"width":{"type":["number"],"default":1},"type":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"axisLabel":{"type":["Object"],"description":"<p>Settings related to axis label.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"interval":{"type":["number","Function"],"default":"'auto'"},"inside":{"type":["boolean"],"default":false},"margin":{"type":["number"],"default":8},"formatter":{"type":["string","Function"],"default":null},"showMinLabel":{"type":["boolean"],"default":null},"showMaxLabel":{"type":["boolean"],"default":null},"color":{"type":["Color","Function"]},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}},"splitLine":{"type":["Object"],"description":"<p>SplitLine of axis in <a href=\"#grid\">grid</a> area.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"interval":{"type":["number","Function"],"default":"'auto'"},"lineStyle":{"type":["Object"],"description":"","properties":{"color":{"type":["Array","string"],"default":"['#ccc']"},"width":{"type":["number"],"default":1},"type":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"splitArea":{"type":["Object"],"description":"<p>Split area of axis in <a href=\"#grid\">grid</a> area, not shown by default.</p>\n","properties":{"interval":{"type":["number","Function"],"default":"'auto'"},"show":{"type":["boolean"],"default":false},"areaStyle":{"type":["Object"],"description":"<p>Split area style.</p>\n","properties":{"color":{"type":["Array"],"default":"['rgba(250,250,250,0.3)','rgba(200,200,200,0.3)']"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["Array"],"description":"<p>Category data, available in <a href=\"#angleAxis.type\">type</a>: &#39;category&#39; axis.</p>\n<p>If <a href=\"#angleAxis.type\">type</a> is not specified, but <code>axis.data</code> is specified, the <a href=\"#angleAxis.type\">type</a> is auto set as <code>&#39;category&#39;</code>.</p>\n<p>If <a href=\"#angleAxis.type\">type</a> is specified as <code>&#39;category&#39;</code>, but <code>axis.data</code> is not specified, <code>axis.data</code> will be auto collected from <a href=\"#series.data\">series.data</a>. It brings convenience, but we should notice that <code>axis.data</code> provides then value range of the <code>&#39;category&#39;</code> axis. If  it is auto collected from <a href=\"#series.data\">series.data</a>, Only the values appearing in <a href=\"#series.data\">series.data</a> can be collected. For example, if <a href=\"#series.data\">series.data</a> is empty, nothing will be collected.</p>\n<p>Example:</p>\n<pre><code class=\"lang-js\">// Name list of all categories\ndata: [&#39;Monday&#39;, &#39;Tuesday&#39;, &#39;Wednesday&#39;, &#39;Thursday&#39;, &#39;Friday&#39;, &#39;Saturday&#39;, &#39;Sunday&#39;]\n// Each item could also be a specific configuration item.\n// In this case, `value` is used as the category name.\ndata: [{\n    value: &#39;Monday&#39;,\n    // Highlight Monday\n    textStyle: {\n        fontSize: 20,\n        color: &#39;red&#39;\n    }\n}, &#39;Tuesday&#39;, &#39;Wednesday&#39;, &#39;Thursday&#39;, &#39;Friday&#39;, &#39;Saturday&#39;, &#39;Sunday&#39;]\n</code></pre>\n","items":{"type":"Object","properties":{"value":{"type":["string"]},"textStyle":{"type":["Object"],"description":"<p>Text style of the category.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}},"axisPointer":{"type":["Object"],"description":"<p>axisPointer settings on the axis.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"type":{"type":["string"],"default":"'line'"},"snap":{"type":["boolean"]},"z":{"type":["number"]},"label":{"type":["Object"],"description":"<p>label of axisPointer</p>\n","properties":{"show":{"type":["boolean"],"default":false},"precision":{"type":["number","string"],"default":"'auto'"},"formatter":{"type":["string","Function"],"default":null},"margin":{"type":["boolean"],"default":3},"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"padding":{"type":["string","Array"],"default":"[5, 7, 5, 7]"},"backgroundColor":{"type":["string"],"default":"'auto'"},"borderColor":{"type":["string"],"default":null},"borderWidth":{"type":["string"],"default":0},"shadowBlur":{"type":["number"],"default":3},"shadowColor":{"type":["Color"],"default":"#aaa"},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0}}},"lineStyle":{"type":["Object"],"description":"<p>It is valid when <a href=\"#tooltip.axisPointer.type\">axisPointer.type</a> is <code>&#39;line&#39;</code>.</p>\n","properties":{"color":{"type":["Color"],"default":"#555"},"width":{"type":["number"],"default":1},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}},"shadowStyle":{"type":["Object"],"description":"<p>It is valid when <a href=\"#tooltip.axisPointer.type\">axisPointer.type</a> is <code>&#39;shadow&#39;</code>.</p>\n","properties":{"color":{"type":["Color"],"default":"'rgba(150,150,150,0.3)"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}},"triggerTooltip":{"type":["boolean"],"default":true},"value":{"type":["number"],"default":null},"status":{"type":["boolean"]},"handle":{"type":["Object"],"description":"<p>A button used to drag axisPointer. This feature is applicable in touch device. See <a href=\"http://echarts.baidu.com/gallery/editor.html?c=line-tooltip-touch&amp;edit=1&amp;reset=1\" target=\"_blank\">example</a>.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"icon":{"type":["*"]},"size":{"type":["number","Array"],"default":45},"margin":{"type":["number"],"default":50},"color":{"type":["string"],"default":"'#333'"},"throttle":{"type":["number"],"default":40},"shadowBlur":{"type":["number"],"default":3},"shadowColor":{"type":["Color"],"default":"#aaa"},"shadowOffsetX":{"type":["number"],"default":2},"shadowOffsetY":{"type":["number"],"default":0}}}}},"zlevel":{"type":["number"],"default":0},"z":{"type":["number"],"default":0}}},"radar":{"type":["Object"],"description":"<p>Coordinate for <a href=\"#series-radar\">radar charts</a>. This component is equal to the polar component in ECharts 2. Because the polar component in the echarts 3 is reconstructed to be the standard polar coordinate component, this component is renamed to be radar to avoid confusion.</p>\n<p>Radar chart coordinate is different from polar coordinate, in that every axis indicator of the radar chart coordinate is an individual dimension. The style of indicator coordinate axis could be configured through the following configuration items, including <a href=\"#radar.name\">name</a>, <a href=\"#radar.axisLine\">axisLine</a>, <a href=\"#radar.axisTick\">axisTick</a>, <a href=\"#radar.axisLabel\">axisLabel</a>, <a href=\"#radar.splitLine\">splitLine</a>, <a href=\"#radar.splitArea\">splitArea</a>.</p>\n<p>Here is a custom example of radar component.</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=doc-example/radar&edit=1&reset=1\" width=\"400\" height=\"400\" ></iframe>\n\n\n\n","properties":{"id":{"type":["string"]},"zlevel":{"type":["number"],"default":0},"z":{"type":["number"],"default":2},"center":{"type":["Array"],"default":"['50%', '50%']"},"radius":{"type":["number","string"],"default":"75%"},"startAngle":{"type":["number"],"default":90},"name":{"type":["Object"],"description":"<p>Name of radar chart.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"'#333'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}},"nameGap":{"type":["number"],"default":15},"splitNumber":{"type":["number"],"default":5},"shape":{"type":["string"],"default":"'polygon'"},"scale":{"type":["boolean"],"default":false},"silent":{"type":["boolean"],"default":false},"triggerEvent":{"type":["boolean"],"default":false},"axisLine":{"type":["Object"],"description":"<p>Settings related to axis line.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"symbol":{"type":["string","Array"],"default":"'none'"},"symbolSize":{"type":["Array"],"default":"[10, 15]"},"symbolOffset":{"type":["Array","number"],"default":"[0, 0]"},"lineStyle":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"'#333'"},"width":{"type":["number"],"default":1},"type":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"axisTick":{"type":["Object"],"description":"<p>Settings related to axis tick.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"alignWithLabel":{"type":["boolean"],"default":false},"inside":{"type":["boolean"],"default":false},"length":{"type":["number"],"default":5},"lineStyle":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"]},"width":{"type":["number"],"default":1},"type":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"axisLabel":{"type":["Object"],"description":"<p>Settings related to axis label.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"inside":{"type":["boolean"],"default":false},"rotate":{"type":["number"],"default":0},"margin":{"type":["number"],"default":8},"formatter":{"type":["string","Function"],"default":null},"showMinLabel":{"type":["boolean"],"default":null},"showMaxLabel":{"type":["boolean"],"default":null},"color":{"type":["Color","Function"]},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}},"splitLine":{"type":["Object"],"description":"<p>SplitLine of axis in <a href=\"#grid\">grid</a> area.</p>\n","properties":{"show":{"type":["boolean"],"description":"<p>Whether to show the splitLine. Value axes are shown by default, while category axes are not.</p>\n","default":true,"properties":{"color":{"type":["Array","string"],"default":"['#ccc']"},"width":{"type":["number"],"default":1},"type":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"splitArea":{"type":["Object"],"description":"<p>Split area of axis in <a href=\"#grid\">grid</a> area, not shown by default.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"areaStyle":{"type":["Object"],"description":"<p>Split area style.</p>\n","properties":{"color":{"type":["Array"],"default":"['rgba(250,250,250,0.3)','rgba(200,200,200,0.3)']"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"indicator":{"type":["Array"],"description":"<p>Indicator of radar chart, which is used to assign multiple variables(dimensions) in radar chart. Here is the example.</p>\n<pre><code class=\"lang-js\">indicator: [\n   { name: &#39;Sales (sales) &#39;, max: 6500},\n   { name: &#39;Administration (Administration) &#39;, max: 16000, color: &#39;red&#39;}, // Set the indicator as &#39;red&#39;\n   { name: &#39;Information Technology (Information Technology) &#39;, max: 30000},\n   { name: &#39;Customer Support (Customer Support) &#39;, max: 38000},\n   { name: &#39;Development (Development) &#39;, max: 52000},\n   { name: &#39;Marketing (Marketing) &#39;, max: 25000}\n]\n</code></pre>\n","items":{"type":"Object","properties":{"name":{"type":["string"]},"max":{"type":["number"]},"min":{"type":["number"]}}}},"color":{"type":["string"]}}},"dataZoom":{"type":"Array","items":{"anyOf":[{"type":["Object"],"description":"<p><strong>dataZoomInside</strong></p>\n<p>Data zoom component of <em>inside</em> type.</p>\n<p>Refer to <a href=\"#dataZoom\">dataZoom</a> for more information.</p>\n<p>The <em>inside</em> means it&#39;s inside the coordinates.</p>\n<ul>\n<li>Translation: data area can be translated when moving in coordinates.</li>\n<li>Scaling:<ul>\n<li>PC: when mouse rolls (similar with touch pad) in coordinates.</li>\n<li>Mobile: when touches and moved with two fingers in coordinates on touch screens.</li>\n</ul>\n</li>\n</ul>\n<p><br>\n<br></p>\n","properties":{"type":{"type":["string"],"default":"'inside'"},"id":{"type":["string"]},"disabled":{"type":["boolean"],"default":false},"xAxisIndex":{"type":["number","Array"],"default":null},"yAxisIndex":{"type":["number","Array"],"default":null},"radiusAxisIndex":{"type":["number","Array"],"default":null},"angleAxisIndex":{"type":["number","Array"],"default":null},"filterMode":{"type":["string"],"default":"'filter'"},"start":{"type":["number"],"default":0},"end":{"type":["number"],"default":100},"startValue":{"type":["number","string","Date"],"default":null},"endValue":{"type":["number","string","Date"],"default":null},"minSpan":{"type":["number"],"default":null},"maxSpan":{"type":["number"],"default":null},"minValueSpan":{"type":["number","string","Date"],"default":null},"maxValueSpan":{"type":["number","string","Date"],"default":null},"orient":{"type":["string"],"default":null},"zoomLock":{"type":["boolean"],"default":false},"throttle":{"type":["number"],"default":100},"rangeMode":{"type":["Array"]},"zoomOnMouseWheel":{"type":["boolean"],"default":true},"moveOnMouseMove":{"type":["boolean"],"default":true},"preventDefaultMouseMove":{"type":["boolean"],"default":true}}},{"type":["Object"],"description":"<p><strong>dataZoomSlider</strong></p>\n<p>(Please refer to the <a href=\"#dataZoom\">introduction of dataZoom</a>.)</p>\n<p><br>\n<br></p>\n","properties":{"type":{"type":["string"],"default":"'slider'"},"id":{"type":["string"]},"show":{"type":["boolean"],"default":true},"backgroundColor":{"type":["Color"],"default":"'rgba(47,69,84,0)'"},"dataBackground":{"type":["Object"],"description":"<p>The style of data shadow.</p>\n","properties":{"lineStyle":{"type":["Object"],"description":"<p>Line style of shadow</p>\n","properties":{"color":{"type":["Color"],"default":"#2f4554"},"width":{"type":["number"],"default":0.5},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"],"default":0.3}}},"areaStyle":{"type":["Object"],"description":"<p>Area style of shadow</p>\n","properties":{"color":{"type":["Color"],"default":"rgba(47,69,84,0.3)"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"],"default":0.3}}}}},"fillerColor":{"type":["Color"],"default":"'rgba(47,69,84,0.25)'"},"borderColor":{"type":["Color"],"default":"'#ddd'"},"handleIcon":{"type":["string"]},"handleSize":{"type":["number"],"default":"'100%'"},"handleStyle":{"type":["Object"],"description":"<p>Style of handle. Please refer to <a href=\"http://echarts.baidu.com/gallery/editor.html?c=area-simple\" target=\"_blank\">area-simple example</a>.</p>\n","properties":{"color":{"type":["Color"],"default":"#a7b7cc"},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}},"labelPrecision":{"type":["number"],"default":"'auto'"},"labelFormatter":{"type":["string","Function"],"default":null},"showDetail":{"type":["boolean"],"default":true},"showDataShadow":{"type":["string"],"default":"'auto'"},"realtime":{"type":["boolean"],"default":true},"textStyle":{"type":["*"],"description":"","properties":{"color":{"type":["Color"],"default":"#333"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"xAxisIndex":{"type":["number","Array"],"default":null},"yAxisIndex":{"type":["number","Array"],"default":null},"radiusAxisIndex":{"type":["number","Array"],"default":null},"angleAxisIndex":{"type":["number","Array"],"default":null},"filterMode":{"type":["string"],"default":"'filter'"},"start":{"type":["number"],"default":0},"end":{"type":["number"],"default":100},"startValue":{"type":["number","string","Date"],"default":null},"endValue":{"type":["number","string","Date"],"default":null},"minSpan":{"type":["number"],"default":null},"maxSpan":{"type":["number"],"default":null},"minValueSpan":{"type":["number","string","Date"],"default":null},"maxValueSpan":{"type":["number","string","Date"],"default":null},"orient":{"type":["string"],"default":null},"zoomLock":{"type":["boolean"],"default":false},"throttle":{"type":["number"],"default":100},"rangeMode":{"type":["Array"]},"zlevel":{"type":["number"],"default":0},"z":{"type":["number"],"default":2},"left":{"type":["string","number"],"default":"'auto'"},"top":{"type":["string","number"],"default":"'auto'"},"right":{"type":["string","number"],"default":"'auto'"},"bottom":{"type":["string","number"],"default":"'auto'"}}}]},"description":"<p><code>dataZoom</code> component is used for zooming a specific area, which enables user to investigate data in detail, or get an overview of the data, or get rid of outlier points.</p>\n<p>These types of <code>dataZoom</code> component are supported:</p>\n<ul>\n<li><p><a href=\"#dataZoom-inside\">dataZoomInside</a>: Data zoom functionalities is embeded inside coordinate systems, enable user to zoom or roam coordinate system by mouse dragging, mouse move or finger touch (in touch screen).</p>\n</li>\n<li><p><a href=\"#dataZoom-slider\">dataZoomSlider</a>: A special slider bar is provided, on which coordinate systems can be zoomed or roamed by mouse dragging or finger touch (in touch screen).</p>\n</li>\n<li><p><a href=\"#toolbox.feature.dataZoom\">dataZoomSelect</a>: A marquee tool is provided for zooming or roaming coordinate system. That is <a href=\"#toolbox.feature.dataZoom\">toolbox.feature.dataZoom</a>, which can only be configured in toolbox.</p>\n</li>\n</ul>\n<p>Example:</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=doc-example/scatter-dataZoom-all&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n<p><br></p>\n<hr>\n<p><strong>✦ Relationship between dataZoom and axis ✦</strong></p>\n<p>Basically <code>dataZoom</code> component operates &quot;window&quot; on axis to zoom or roam coordinate system.</p>\n<blockquote>\n<p>Use <a href=\"#dataZoom.xAxisIndex\">dataZoom.xAxisIndex</a> or <a href=\"#dataZoom.yAxisIndex\">dataZoom.yAxisIndex</a> or <a href=\"#dataZoom.radiusAxisIndex\">dataZoom.radiusAxisIndex</a> or <a href=\"#dataZoom.angleAxisIndex\">dataZoom.angleAxisIndex</a> to specify which axes are operated by <code>dataZoom</code>.</p>\n</blockquote>\n<p>A single chart instance can contains several <code>dataZoom</code> components, each of which controls different axes. The <code>dataZoom</code> components that control the same axis will be automatically linked (i.e., all of them will be updated when one of them is updated by user action or API call).</p>\n<p><br></p>\n<hr>\n<p><strong>✦ How dataZoom componets operates axes and data ✦</strong></p>\n<p>Generally <code>dataZoom</code> component zoom or roam coordinate system through data filtering and set the windows of axes internally.</p>\n<p>Its behaviours vary according to filtering mode settings (<a href=\"#dataZoom.filterMode\">dataZoom.filterMode</a>).</p>\n<p>Possible values:</p>\n<ul>\n<li><p>&#39;filter&#39;: data that outside the window will be <strong>filtered</strong>, which may lead to some changes of windows of other axes. For each data item, it will be filtered if one of the relevant dimensions is out of the window.</p>\n</li>\n<li><p>&#39;weakFilter&#39;: data that outside the window will be <strong>filtered</strong>, which may lead to some changes of windows of other axes. For each data item, it will be filtered only if all of the relevant dimensions are out of the same side of the window.</p>\n</li>\n<li><p>&#39;empty&#39;: data that outside the window will be <strong>set to NaN</strong>, which will not lead to changes of windows of other axes.</p>\n</li>\n<li><p>&#39;none&#39;: Do not filter data.</p>\n</li>\n</ul>\n<p>How to set <code>filterMode</code> is up to users, depending on the requirments and scenarios. Expirically:</p>\n<ul>\n<li><p>If only <code>xAxis</code> or only <code>yAxis</code> is controlled by <code>dataZoom</code>, <code>filterMode: &#39;filter&#39;</code> is typically used, which enable the other axis auto adapte its window to the extent of the filtered data.</p>\n</li>\n<li><p>If both <code>xAxis</code> and <code>yAxis</code> are operated by <code>dataZoom</code>:</p>\n<ul>\n<li><p>If <code>xAxis</code> and <code>yAxis</code> should not effect mutually (e.g. a scatter chart with both axes on the type of <code>&#39;value&#39;</code>), they should be set to be <code>filterMode: &#39;empty&#39;</code>.</p>\n</li>\n<li><p>If <code>xAxis</code> is the main axis and <code>yAxis</code> is the auxiliary axis (or vise versa) (e.g., in a bar chart, when dragging <code>dataZoomX</code> to change the window of xAxis, we need the yAxis to adapt to the clipped data, but when dragging <code>dataZoomY</code> to change the window of yAxis, we need the xAxis not to be changed), in this case, <code>xAxis</code> should be set to be <code>fiterMode: &#39;filter&#39;</code>, while <code>yAxis</code> shoule be set to be <code>fiterMode: &#39;empty&#39;</code>.</p>\n</li>\n</ul>\n</li>\n</ul>\n<p>It can be demostrated by the sample:</p>\n<pre><code class=\"lang-javascript\">option = {\n    dataZoom: [\n        {\n            id: &#39;dataZoomX&#39;,\n            type: &#39;slider&#39;,\n            xAxisIndex: [0],\n            filterMode: &#39;filter&#39;\n        },\n        {\n            id: &#39;dataZoomY&#39;,\n            type: &#39;slider&#39;,\n            yAxisIndex: [0],\n            filterMode: &#39;empty&#39;\n        }\n    ],\n    xAxis: {type: &#39;value&#39;},\n    yAxis: {type: &#39;value&#39;},\n    series{\n        type: &#39;bar&#39;,\n        data: [\n            // The first column corresponds to xAxis,\n            // and the second coloum corresponds to yAxis.\n            [12, 24, 36],\n            [90, 80, 70],\n            [3, 9, 27],\n            [1, 11, 111]\n        ]\n    }\n}\n</code></pre>\n<p>In the sample above, <code>dataZoomX</code> is set as <code>filterMode: &#39;filter&#39;</code>. When use drags <code>dataZoomX</code> (do not touch <code>dataZoomY</code>) and the valueWindow of <code>xAxis</code> is changed to <code>[2, 50]</code> consequently, <code>dataZoomX</code> travel the first column of series.data and filter items that out of the window. The series.data turns out to be:</p>\n<pre><code class=\"lang-javascript\">[\n    [12, 24, 36],\n    // [90, 80, 70] This item is filtered, as 90 is out of the window.\n    [3, 9, 27]\n    // [1, 11, 111] This item is filtered, as 1 is out of the window.\n]\n</code></pre>\n<p>Before filtering, the second column, which corresponds to yAxis, has values <code>24</code>, <code>80</code>, <code>9</code>, <code>11</code>. After filtering, only <code>24</code> and <code>9</code> are left. Then the extent of <code>yAxis</code> is adjusted to adapt the two values (if <code>yAxis.min</code> and <code>yAxis.man</code> are not set).</p>\n<p>So <code>filterMode: &#39;filter&#39;</code> can be used to enable the other axis to auto adapt the filtered data.</p>\n<p>Then let&#39;s review the sample from the beginning, <code>dataZoomY</code> is set as <code>filterMode: &#39;empty&#39;</code>. So if user drags <code>dataZoomY</code> (do not touch <code>dataZoomX</code>) and its window is changed to <code>[10, 60]</code> consequently, <code>dataZoomY</code> travels the second column of series.data and set NaN to all of the values that outside the window (NaN cause the graphical elements, i.e., bar elements, do not show, but sill hold the place). The series.data turns out to be:</p>\n<pre><code class=\"lang-javascript\">[\n    [12, 24, 36],\n    [90, NaN, 70], // Set to NaN\n    [3, NaN, 27],  // Set to NaN\n    [1, 11, 111]\n]\n</code></pre>\n<p>In this case, the first colum (i.e., <code>12</code>, <code>90</code>, <code>3</code>, <code>1</code>, which corresponds to <code>xAxis</code>), will not be changed at all. So dragging <code>yAxis</code> will not change extent of <code>xAxis</code>, which is good for requirements like outlier filtering.</p>\n<p>See this example:</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=doc-example/bar-dataZoom-filterMode&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n\n\n\n<p>Moreover, when <code>min</code>, <code>max</code> of an axis is set (e.g., <code>yAxis: {min: 0, max: 400}</code>), this extent of the axis will not be modified by the behaviour of dataZoom of other axis any more.</p>\n<p><br></p>\n<hr>\n<p><strong>✦ How to set window ✦</strong></p>\n<p>You can set the current window in two forms:</p>\n<ul>\n<li><p>percent value: see <a href=\"#dataZoom.start\">dataZoom.start</a> and <a href=\"#dataZoom.end\">dataZoom.end</a>.</p>\n</li>\n<li><p>absolute value: see <a href=\"#dataZoom.startValue\">dataZoom.startValue</a> and <a href=\"#dataZoom.endValue\">dataZoom.endValue</a>.</p>\n</li>\n</ul>\n<p>Notice: If use percent value form, and it is in the senario below, the result of dataZoom depends on the sequence of dataZoom definitions appearing in <code>option</code>.</p>\n<pre><code class=\"lang-javascript\">option = {\n    dataZoom: [\n        {\n            id: &#39;dataZoomX&#39;,\n            type: &#39;slider&#39;,\n            xAxisIndex: [0],\n            filterMode: &#39;filter&#39;,   // Set as &#39;filter&#39; so that the modification\n                                    // of window of xAxis willl effect the\n                                    // window of yAxis.\n            start: 30,\n            end: 70\n        },\n        {\n            id: &#39;dataZoomY&#39;,\n            type: &#39;slider&#39;,\n            yAxisIndex: [0],\n            filterMode: &#39;empty&#39;,\n            start: 20,\n            end: 80\n        }\n    ],\n    xAxis: {\n        type: &#39;value&#39;\n    },\n    yAxis: {\n        type: &#39;value&#39;\n        // Notice there is no min or max set to\n        // restrict the view extent of yAxis.\n    },\n    series{\n        type: &#39;bar&#39;,\n        data: [\n            // The first column corresponds to xAxis,\n            // and the second column corresponds to yAxis.\n            [12, 24, 36],\n            [90, 80, 70],\n            [3, 9, 27],\n            [1, 11, 111]\n        ]\n    }\n}\n</code></pre>\n<p>What is the exact meaning of <code>start: 20, end: 80</code> in <code>dataZoomY</code> in the example above?</p>\n<ul>\n<li><p>If <code>yAxis.min</code> and <code>yAxis.max</code> are set:</p>\n<p>  <code>start: 20, end: 80</code> of <code>dataZoomY</code> means: from <code>20%</code> to <code>80%</code> out of <code>[yAxis.min, yAxis.max]</code>.</p>\n<p>  If one of <code>yAxis.min</code> and <code>yAxis.max</code> is not set, the corresponding edge of the full extend also follow rule as follows.</p>\n</li>\n<li><p>If <code>yAxis.min</code> and <code>yAxis.max</code> are not set:</p>\n<ul>\n<li><p>If <code>dataZoomX</code> is set to be <code>filterMode: &#39;empty&#39;</code>:</p>\n<p>  <code>start: 20, end: 80</code> of <code>dataZoomY</code> means: from <code>20%</code> to <code>80%</code> out of <code>[dataMinY to dataMaxY]</code> of series.data (i.e., <code>[9, 80]</code> in the example above).</p>\n</li>\n<li><p>If <code>dataZoomX</code> is set to <code>filterMode: &#39;filter&#39;</code>:</p>\n<p>  Since <code>dataZoomX</code> is defined before <code>dataZoomY</code>, <code>start: 30, end: 70</code> of <code>dataZoomX</code> means: from <code>30%</code> to <code>70%</code> out of full series.data, whereas <code>start: 20, end: 80</code> of <code>dataZoomY</code> means: from <code>20%</code> to <code>80%</code> out of the series.data having been filtered by <code>dataZoomX</code>.</p>\n<p>  If you want to change the process sequence, you can just change the sequence of the definitions apearing in <code>option</code>.</p>\n</li>\n</ul>\n</li>\n</ul>\n<p><br>\n<br></p>\n<p>Detailed configurations are listed as follows.</p>\n","properties":{}},"visualMap":{"type":"Array","items":{"anyOf":[{"type":["Object"],"description":"<p><strong>Continuous visualMap component (visualMapContinuous)</strong></p>\n<p> (See <a href=\"#visualMap\">the introduction to visual Map component (visualMap)</a>)</p>\n<p>Sample:</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=doc-example/map-visualMap-continuous&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n<p>You can set <a href=\"#visualMap.calculable\">visualMap.calculable</a> to show or hide the hanldes, which is used to change the selected range in <code>visualMapContinuous</code>.</p>\n<p><br>\n<br></p>\n","properties":{"type":{"type":["string"],"default":"continuous"},"id":{"type":["string"]},"min":{"type":["number"]},"max":{"type":["number"]},"range":{"type":["Array"]},"calculable":{"type":["boolean"],"default":false},"realtime":{"type":["boolean"],"default":true},"inverse":{"type":["boolean"],"default":false},"precision":{"type":["number"],"default":0},"itemWidth":{"type":["number"],"default":20},"itemHeight":{"type":["number"],"default":140},"align":{"type":["string"],"default":"'auto'"},"text":{"type":["Array"],"default":null},"textGap":{"type":["Array"],"default":10},"show":{"type":["boolean"],"default":true},"dimension":{"type":["string"]},"seriesIndex":{"type":["number","Array"]},"hoverLink":{"type":["boolean"],"default":true},"inRange":{"type":["Object"]},"outOfRange":{"type":["Object"]},"controller":{"type":["Object"],"description":"<p>Property <code>inRange</code> and <code>outOfRange</code> can be set within property <code>controller</code>, which means those <code>inRange</code> and <code>outOfRange</code> are only used on the controller (<code>visualMap</code> component itself), but are not used on chart (series). This property is useful in some scenario that the view of controller need to be customized in detail.</p>\n","properties":{"inRange":{"type":["Object"]},"outOfRange":{"type":["Object"]}}},"zlevel":{"type":["number"],"default":0},"z":{"type":["number"],"default":4},"left":{"type":["string","number"],"default":0},"top":{"type":["string","number"],"default":"auto"},"right":{"type":["string","number"],"default":"auto"},"bottom":{"type":["string","number"],"default":0},"orient":{"type":["string"],"default":"'vertical'"},"padding":{"type":["number","Array"],"default":5},"backgroundColor":{"type":["Color"],"default":"'rgba(0,0,0,0)'"},"borderColor":{"type":["Color"],"default":"'#ccc'"},"borderWidth":{"type":["number"],"default":0},"color":{"type":["Array"],"default":"['#bf444c', '#d88273', '#f6efa6']"},"textStyle":{"type":["*"],"description":"","properties":{"color":{"type":["Color"],"default":"#333"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"formatter":{"type":["string","Function"]}}},{"type":["Object"],"description":"<p><strong>Piecewise visualMap component (visualMapPiecewise) </strong></p>\n<p> (Reference to <a href=\"#visualMap\">the introduction of visual Map component (visualMap)</a>)</p>\n<p>Sample:</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=doc-example/scatter-visualMap-piecewise&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n\n<p>Piecewise visualMap component works in one of the three modes:</p>\n<ul>\n<li><strong>CONTINUOUS-AVERAGE</strong>: The series.data is continuous and is divided into pieces averagely according to <a href=\"#visualMap-piecewise.splitNumber\">visualMap-piecewise.splitNumber</a>.</li>\n<li><strong>CONTINUOUS-CUSTOMIZED</strong>: The series.data is continuous and is divided into pieces according to the given rule defined in <a href=\"#visualMap-piecewise.pieces\">visualMap-piecewise.pieces</a>.</li>\n<li><strong>CATEGORY</strong>: The series.data is discrete and is categorized according to <a href=\"#visualMap-piecewise.categories\">visualMap-piecewise.categories</a>.</li>\n</ul>\n<p><br>\n<br></p>\n","properties":{"type":{"type":["string"],"default":"piecewise"},"id":{"type":["string"]},"splitNumber":{"type":["number"],"default":5},"pieces":{"type":["Array"]},"categories":{"type":["Array"]},"min":{"type":["number"]},"max":{"type":["number"]},"minOpen":{"type":["boolean"]},"maxOpen":{"type":["boolean"]},"selectedMode":{"type":["string"],"default":"'multiple'"},"inverse":{"type":["boolean"],"default":false},"precision":{"type":["number"],"default":null},"itemWidth":{"type":["number"],"default":20},"itemHeight":{"type":["number"],"default":14},"align":{"type":["string"],"default":"'auto'"},"text":{"type":["Array"],"default":null},"textGap":{"type":["Array"],"default":10},"showLabel":{"type":["boolean"]},"itemGap = 10":{"type":["*"]},"itemSymbol":{"type":["string"],"default":"'roundRect'"},"show":{"type":["boolean"],"default":true},"dimension":{"type":["string"]},"seriesIndex":{"type":["number","Array"]},"hoverLink":{"type":["boolean"],"default":true},"inRange":{"type":["Object"]},"outOfRange":{"type":["Object"]},"controller":{"type":["Object"],"description":"<p>Property <code>inRange</code> and <code>outOfRange</code> can be set within property <code>controller</code>, which means those <code>inRange</code> and <code>outOfRange</code> are only used on the controller (<code>visualMap</code> component itself), but are not used on chart (series). This property is useful in some scenario that the view of controller need to be customized in detail.</p>\n","properties":{"inRange":{"type":["Object"]},"outOfRange":{"type":["Object"]}}},"zlevel":{"type":["number"],"default":0},"z":{"type":["number"],"default":4},"left":{"type":["string","number"],"default":0},"top":{"type":["string","number"],"default":"auto"},"right":{"type":["string","number"],"default":"auto"},"bottom":{"type":["string","number"],"default":0},"orient":{"type":["string"],"default":"'vertical'"},"padding":{"type":["number","Array"],"default":5},"backgroundColor":{"type":["Color"],"default":"'rgba(0,0,0,0)'"},"borderColor":{"type":["Color"],"default":"'#ccc'"},"borderWidth":{"type":["number"],"default":0},"color":{"type":["Array"],"default":"['#bf444c', '#d88273', '#f6efa6']"},"textStyle":{"type":["*"],"description":"","properties":{"color":{"type":["Color"],"default":"#333"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"formatter":{"type":["string","Function"]}}}]},"description":"<p><code>visualMap</code> is a type of component for visual encoding, which maps the data to visual channels, including:</p>\n<ul>\n<li><code>symbol</code>: Type of symbol.</li>\n<li><code>symbolSize</code>: Symbol size.</li>\n<li><code>color</code>: Symbol color.</li>\n<li><code>colorAlpha</code>: Symbol alpha channel.</li>\n<li><code>opacity</code>: Opacity of symbol and others (like labels).</li>\n<li><code>colorLightness</code>: Lightness in <a href=\"https://en.wikipedia.org/wiki/HSL_and_HSV\" target=\"_blank\">HSL</a>.</li>\n<li><code>colorSaturation</code>: Saturation in <a href=\"https://en.wikipedia.org/wiki/HSL_and_HSV\" target=\"_blank\">HSL</a>.</li>\n<li><code>colorHue</code>: Hue in <a href=\"https://en.wikipedia.org/wiki/HSL_and_HSV\" target=\"_blank\">HSL</a>.</li>\n</ul>\n<p>Myltiple <code>visualMap</code> component could be defined in a chart instance, which enable that different dimensions of a series data are mapped to different visual channels.</p>\n<p><code>visualMap</code> could be defined as <a href=\"#visualMap-piecewise\">Piecewise (visualMapPiecewise)</a> or <a href=\"#visualMap-continuous\">Continuous (visualMapContinuous)</a>, which is distinguished by the property <code>type</code>. For instance:</p>\n<pre><code class=\"lang-javascript\">option = {\n    visualMap: [\n        { // the first visualMap component\n            type: &#39;continuous&#39;, // defined to be continuous viusalMap\n            ...\n        },\n        { // the sencond visualMap component\n            type: &#39;piecewise&#39;, // defined to be piecewise visualMap\n            ...\n        }\n    ],\n    ...\n};\n</code></pre>\n<p><br>\n<strong>✦ Configure mapping ✦</strong></p>\n<p>The dimension of <a href=\"#series.data\">series.data</a> can be specified by <a href=\"#visualMap.dimension\">visualMap.dimension</a>, from which the value can be retrieved and mapped onto visual channels, which can be defined in <a href=\"#visualMap.inRange\">visualMap.inRange</a> and <a href=\"#visualMap.outOfRange\">visualMap.outOfRange</a>.</p>\n<p><br>\nIn series that controlled by visualMap, if a data item needs to escape from controlled by visualMap, you can set like this:</p>\n<pre><code>series : [\n    {name: &#39;Shanghai&#39;, value: 251},\n    {name: &#39;Haikou&#39;, value: 21},\n    // Mark as `visualMap: false`, then this item does not controlled by visualMap any more,\n    // and series visual config (like color, symbol, ...) can be used to this item.\n    {name: &#39;Beijing&#39;, value: 821, },\n    ...\n]\n</code></pre><p><br>\n<strong>✦ The relationship between visualMap of ECharts3 and dataRange of ECharts2 ✦</strong></p>\n<p><code>visualMap</code> is renamed from the <code>dataRange</code> of ECharts2, and the scope of functionalities are extended a lot. The configurations of <code>dataRange</code> are still compatible in ECharts3, which automatically convert them to <code>visualMap</code>. It is recommended to use <code>visualMap</code> instead of <code>dataRange</code> in ECharts3.</p>\n<p><br>\n<strong>✦ The detailed configurations of visualMap are elaborated as follows. ✦</strong></p>\n<p><br>\n<br></p>\n","properties":{}},"tooltip":{"type":["Object"],"description":"<p>Tooltip component.</p>\n<hr>\n<p><strong>General Introduction:</strong></p>\n<p>tooltip can be configured on different places:</p>\n<ul>\n<li><p>Configured on global: <a href=\"#tooltip\">tooltip</a></p>\n</li>\n<li><p>Configured in a coordinate system: <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>Configured in a series: <a href=\"#series.tooltip\">series.tooltip</a></p>\n</li>\n<li><p>Configured in each item of <code>series.data</code>: <a href=\"#series.data.tooltip\">series.data.tooltip</a></p>\n</li>\n</ul>\n<hr>\n","properties":{"show":{"type":["boolean"],"default":true},"trigger":{"type":["string"],"default":"'item'"},"axisPointer":{"type":["Object"],"description":"<p>Configuration item for axis indicator.</p>\n<p><code>tooltip.axisPointer</code> is like syntactic sugar of axisPointer settings on axes (for example, <a href=\"#xAxis.axisPointer\">xAxis.axisPointer</a> or <a href=\"#angleAxis.axisPointer\">angleAxis.axisPointer</a>). More detailed features can be configured on <code>someAxis.axisPointer</code>. But in common cases, using <code>tooltip.axisPinter</code> is more convenient.</p>\n<blockquote>\n<p><strong>Notice:</strong> configurations of <code>tooltip.axisPointer</code> has lower priority than that of <code>someAxis.axisPointer</code>.</p>\n</blockquote>\n<hr>\n<p><code>axisPointer</code> is a tool for displaying reference line and axis value under mouse pointer.</p>\n<p>For example:</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=doc-example/candlestick-axisPointer&edit=1&reset=1\" width=\"600\" height=\"450\" ></iframe>\n\n\n<p>In the demo above, <a href=\"#axisPointer.link\">axisPointer.link</a> is used to link axisPointer from different coordinate systems.</p>\n<p><code>axisPointer</code> can also be used on touch device, where user can drag the button to move the reference line and label.</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=line-tooltip-touch&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n<p>In the cases that more than one axis exist, axisPointer helps to look inside the data.</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=multiple-y-axis&edit=1&reset=1\" width=\"600\" height=\"300\" ></iframe>\n\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=multiple-x-axis&edit=1&reset=1\" width=\"600\" height=\"300\" ></iframe>\n\n\n\n<hr>\n<blockquote>\n<p><strong>Notice:</strong>\nGenerally, axisPointers is configured in each axes who need them (for example <a href=\"#xAxis.axisPointer\">xAxis.axisPointer</a>), or configured in <code>tooltip</code> (for example <a href=\"#tooltip.axisPointer\">tooltip.axisPointer</a>).</p>\n<p>But these configurations can only be configured in global axisPointer:\n<a href=\"#axisPointer.triggerOn\">axisPointer.triggerOn</a>, <a href=\"#axisPointer.link\">axisPointer.link</a>。</p>\n</blockquote>\n<hr>\n<hr>\n<p><strong>How to display axisPointer:</strong></p>\n<p>In <a href=\"#grid\">cartesian (grid)</a> and <a href=\"#single\">polar](~polar) and (single axis</a>, each axis has its own axisPointer.</p>\n<p>Those axisPointer will not be displayed by default, utill configured as follows:</p>\n<ul>\n<li><p>Set <code>someAxis.axisPointer.show</code> (like <a href=\"#xAxis.axisPointer.show\">xAxis.axisPointer.show</a>) as <code>true</code>. Then axisPointer of this axis will be displayed.</p>\n</li>\n<li><p>Set <a href=\"#tooltip.trigger\">tooltip.trigger</a> as <code>&#39;axis&#39;</code>, or set <a href=\"#tooltip.axisPointer.type\">tooltip.axisPointer.type</a> as <code>&#39;cross&#39;</code>. Then coordinate system will automatically chose the axes who will display their axisPointers. (<a href=\"#tooltip.axisPointer.axis\">tooltip.axisPointer.axis</a> can be used to change the choice.) Notice, <code>axis.axisPointer</code> will override <code>tooltip.axisPointer</code> settings.</p>\n</li>\n</ul>\n<hr>\n<p><strong>How to display the label of axisPointer:</strong></p>\n<p>The label of axisPointer will not be displayed by default(namely, only reference line will be displayed by default), utill configured as follows:</p>\n<ul>\n<li><p>Set <code>someAxis.axisPointer.label.show</code> (for example <a href=\"#xAxis.axisPointer.show\">xAxis.axisPointer.label.show</a>) as <code>true</code>. Then the label of the axisPointer will be displayed.</p>\n</li>\n<li><p>Set <a href=\"#tooltip.axisPointer.type\">tooltip.axisPointer.type</a> as  <code>&#39;cross&#39;</code>. Then the label of the crossed axisPointers will be displayed.</p>\n</li>\n</ul>\n<hr>\n<p><strong>How to configure axisPointer on touch device:</strong></p>\n<p>Set <code>someAxis.axisPointer.handle.show</code> (for example <a href=\"#xAxis.axisPointer.handle.show\">xAxis.axisPointer.handle.show</a> as <code>true</code>. Then the button for dragging will be displayed. (This feature is not supported on polar).</p>\n<p><strong>Notice:</strong>\nIf tooltip does not work well in this case, try to set<a href=\"#tooltip.triggerOn\">tooltip.triggerOn</a> as <code>&#39;none&#39;</code> (for the effect: show tooltip when finger holding on the button, and hide tooltip after finger left the button), or set <a href=\"#tooltip.alwaysShowContent\">tooltip.alwaysShowContent</a> as <code>true</code> (then tooltip will always be displayed).</p>\n<p>See the <a href=\"http://echarts.baidu.com/gallery/editor.html?c=line-tooltip-touch&amp;edit=1&amp;reset=1\" target=\"_blank\">example</a>.</p>\n<hr>\n<p><strong>Snap to point</strong></p>\n<p>In value axis and time axis, if <a href=\"#xAxis.axisPointer.snap\">snap</a> is set as true, axisPointer will snap to point automatically.</p>\n<hr>\n","properties":{"type":{"type":["string"],"default":"'line'"},"axis":{"type":["string"],"default":"'auto'"},"snap":{"type":["boolean"]},"z":{"type":["number"]},"label":{"type":["Object"],"description":"<p>label of axisPointer</p>\n","properties":{"show":{"type":["boolean"],"default":false},"precision":{"type":["number","string"],"default":"'auto'"},"formatter":{"type":["string","Function"],"default":null},"margin":{"type":["boolean"],"default":3},"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"padding":{"type":["string","Array"],"default":"[5, 7, 5, 7]"},"backgroundColor":{"type":["string"],"default":"'auto'"},"borderColor":{"type":["string"],"default":null},"borderWidth":{"type":["string"],"default":0},"shadowBlur":{"type":["number"],"default":3},"shadowColor":{"type":["Color"],"default":"#aaa"},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0}}},"lineStyle":{"type":["Object"],"description":"<p>It is valid when <a href=\"#tooltip.axisPointer.type\">axisPointer.type</a> is <code>&#39;line&#39;</code>.</p>\n","properties":{"color":{"type":["Color"],"default":"#555"},"width":{"type":["number"],"default":1},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}},"shadowStyle":{"type":["Object"],"description":"<p>It is valid when <a href=\"#tooltip.axisPointer.type\">axisPointer.type</a> is <code>&#39;shadow&#39;</code>.</p>\n","properties":{"color":{"type":["Color"],"default":"'rgba(150,150,150,0.3)"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}},"crossStyle":{"type":["Object"],"description":"<p>It is valid when <a href=\"#tooltip.axisPointer.type\">axisPointer.type</a> is <code>&#39;cross&#39;</code>.</p>\n","properties":{"color":{"type":["Color"],"default":"#555"},"width":{"type":["number"],"default":1},"type":{"type":["string"],"default":"dashed"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"showContent":{"type":["boolean"],"default":true},"alwaysShowContent":{"type":["boolean"],"default":false},"triggerOn":{"type":["string"],"default":"'mousemove|click'"},"showDelay":{"type":["number"],"default":0},"hideDelay":{"type":["number"],"default":100},"enterable":{"type":["boolean"],"default":true},"confine":{"type":["boolean"],"default":false},"transitionDuration":{"type":["number"],"default":0.4},"position":{"type":["string","Array"]},"formatter":{"type":["string","Function"]},"backgroundColor":{"type":["Color"],"default":"'rgba(50,50,50,0.7)'"},"borderColor":{"type":["Color"],"default":"'#333'"},"borderWidth":{"type":["number"],"default":0},"padding":{"type":["number"],"default":5},"textStyle":{"type":["Object"],"description":"<p>The text syle of tooltip&#39;s floating layer.</p>\n","properties":{"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":14},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"extraCssText":{"type":["string"]}}},"axisPointer":{"type":["Object"],"description":"<p>This is the global configurations of axisPointer.</p>\n<hr>\n<p><code>axisPointer</code> is a tool for displaying reference line and axis value under mouse pointer.</p>\n<p>For example:</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=doc-example/candlestick-axisPointer&edit=1&reset=1\" width=\"600\" height=\"450\" ></iframe>\n\n\n<p>In the demo above, <a href=\"#axisPointer.link\">axisPointer.link</a> is used to link axisPointer from different coordinate systems.</p>\n<p><code>axisPointer</code> can also be used on touch device, where user can drag the button to move the reference line and label.</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=line-tooltip-touch&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n<p>In the cases that more than one axis exist, axisPointer helps to look inside the data.</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=multiple-y-axis&edit=1&reset=1\" width=\"600\" height=\"300\" ></iframe>\n\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=multiple-x-axis&edit=1&reset=1\" width=\"600\" height=\"300\" ></iframe>\n\n\n\n<hr>\n<blockquote>\n<p><strong>Notice:</strong>\nGenerally, axisPointers is configured in each axes who need them (for example <a href=\"#xAxis.axisPointer\">xAxis.axisPointer</a>), or configured in <code>tooltip</code> (for example <a href=\"#tooltip.axisPointer\">tooltip.axisPointer</a>).</p>\n<p>But these configurations can only be configured in global axisPointer:\n<a href=\"#axisPointer.triggerOn\">axisPointer.triggerOn</a>, <a href=\"#axisPointer.link\">axisPointer.link</a>。</p>\n</blockquote>\n<hr>\n<hr>\n<p><strong>How to display axisPointer:</strong></p>\n<p>In <a href=\"#grid\">cartesian (grid)</a> and <a href=\"#single\">polar](~polar) and (single axis</a>, each axis has its own axisPointer.</p>\n<p>Those axisPointer will not be displayed by default, utill configured as follows:</p>\n<ul>\n<li><p>Set <code>someAxis.axisPointer.show</code> (like <a href=\"#xAxis.axisPointer.show\">xAxis.axisPointer.show</a>) as <code>true</code>. Then axisPointer of this axis will be displayed.</p>\n</li>\n<li><p>Set <a href=\"#tooltip.trigger\">tooltip.trigger</a> as <code>&#39;axis&#39;</code>, or set <a href=\"#tooltip.axisPointer.type\">tooltip.axisPointer.type</a> as <code>&#39;cross&#39;</code>. Then coordinate system will automatically chose the axes who will display their axisPointers. (<a href=\"#tooltip.axisPointer.axis\">tooltip.axisPointer.axis</a> can be used to change the choice.) Notice, <code>axis.axisPointer</code> will override <code>tooltip.axisPointer</code> settings.</p>\n</li>\n</ul>\n<hr>\n<p><strong>How to display the label of axisPointer:</strong></p>\n<p>The label of axisPointer will not be displayed by default(namely, only reference line will be displayed by default), utill configured as follows:</p>\n<ul>\n<li><p>Set <code>someAxis.axisPointer.label.show</code> (for example <a href=\"#xAxis.axisPointer.show\">xAxis.axisPointer.label.show</a>) as <code>true</code>. Then the label of the axisPointer will be displayed.</p>\n</li>\n<li><p>Set <a href=\"#tooltip.axisPointer.type\">tooltip.axisPointer.type</a> as  <code>&#39;cross&#39;</code>. Then the label of the crossed axisPointers will be displayed.</p>\n</li>\n</ul>\n<hr>\n<p><strong>How to configure axisPointer on touch device:</strong></p>\n<p>Set <code>someAxis.axisPointer.handle.show</code> (for example <a href=\"#xAxis.axisPointer.handle.show\">xAxis.axisPointer.handle.show</a> as <code>true</code>. Then the button for dragging will be displayed. (This feature is not supported on polar).</p>\n<p><strong>Notice:</strong>\nIf tooltip does not work well in this case, try to set<a href=\"#tooltip.triggerOn\">tooltip.triggerOn</a> as <code>&#39;none&#39;</code> (for the effect: show tooltip when finger holding on the button, and hide tooltip after finger left the button), or set <a href=\"#tooltip.alwaysShowContent\">tooltip.alwaysShowContent</a> as <code>true</code> (then tooltip will always be displayed).</p>\n<p>See the <a href=\"http://echarts.baidu.com/gallery/editor.html?c=line-tooltip-touch&amp;edit=1&amp;reset=1\" target=\"_blank\">example</a>.</p>\n<hr>\n<p><strong>Snap to point</strong></p>\n<p>In value axis and time axis, if <a href=\"#xAxis.axisPointer.snap\">snap</a> is set as true, axisPointer will snap to point automatically.</p>\n<hr>\n<hr>\n","properties":{"id":{"type":["string"]},"show":{"type":["boolean"],"default":false},"type":{"type":["string"],"default":"'line'"},"snap":{"type":["boolean"]},"z":{"type":["number"]},"label":{"type":["Object"],"description":"<p>label of axisPointer</p>\n","properties":{"show":{"type":["boolean"],"default":false},"precision":{"type":["number","string"],"default":"'auto'"},"formatter":{"type":["string","Function"],"default":null},"margin":{"type":["boolean"],"default":3},"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"padding":{"type":["string","Array"],"default":"[5, 7, 5, 7]"},"backgroundColor":{"type":["string"],"default":"'auto'"},"borderColor":{"type":["string"],"default":null},"borderWidth":{"type":["string"],"default":0},"shadowBlur":{"type":["number"],"default":3},"shadowColor":{"type":["Color"],"default":"#aaa"},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0}}},"lineStyle":{"type":["Object"],"description":"<p>It is valid when <a href=\"#tooltip.axisPointer.type\">axisPointer.type</a> is <code>&#39;line&#39;</code>.</p>\n","properties":{"color":{"type":["Color"],"default":"#555"},"width":{"type":["number"],"default":1},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}},"shadowStyle":{"type":["Object"],"description":"<p>It is valid when <a href=\"#tooltip.axisPointer.type\">axisPointer.type</a> is <code>&#39;shadow&#39;</code>.</p>\n","properties":{"color":{"type":["Color"],"default":"'rgba(150,150,150,0.3)"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}},"triggerTooltip":{"type":["boolean"],"default":true},"value":{"type":["number"],"default":null},"status":{"type":["boolean"]},"handle":{"type":["Object"],"description":"<p>A button used to drag axisPointer. This feature is applicable in touch device. See <a href=\"http://echarts.baidu.com/gallery/editor.html?c=line-tooltip-touch&amp;edit=1&amp;reset=1\" target=\"_blank\">example</a>.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"icon":{"type":["*"]},"size":{"type":["number","Array"],"default":45},"margin":{"type":["number"],"default":50},"color":{"type":["string"],"default":"'#333'"},"throttle":{"type":["number"],"default":40},"shadowBlur":{"type":["number"],"default":3},"shadowColor":{"type":["Color"],"default":"#aaa"},"shadowOffsetX":{"type":["number"],"default":2},"shadowOffsetY":{"type":["number"],"default":0}}},"link":{"type":["Array"]},"triggerOn":{"type":["string"],"default":"'mousemove|click'"}}},"toolbox":{"type":["Object"],"description":"<p>A group of utility tools, which includes <a href=\"#toolbox.feature.saveAsImage\">export</a>, <a href=\"#toolbox.feature.dataView\">data view</a>, <a href=\"#toolbox.feature.magicType\">dynamic type switching</a>, <a href=\"#toolbox.feature.dataZoom\">data area zooming</a>, and <a href=\"#toolbox.feature.reset\">reset</a>.</p>\n<p><strong>Example: </strong></p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=line-marker&reset=1&edit=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n\n\n","properties":{"id":{"type":["string"]},"show":{"type":["boolean"],"default":true},"orient":{"type":["string"],"default":"'horizontal'"},"itemSize":{"type":["number"],"default":15},"itemGap":{"type":["number"],"default":10},"showTitle":{"type":["boolean"],"default":true},"feature":{"type":["Object"],"description":"<p>The configuration item for each tool.</p>\n<p>Besides the tools we provide, user-defined toolbox is also supported.</p>\n<p>Notes: User-defined tool name could only start with <code>my</code>, like <code>myTool1</code> and <code>myTool2</code> in the below example:</p>\n<pre><code class=\"lang-javascript\">{\n    toolbox: {\n        feature: {\n            myTool1: {\n                show: true,\n                title: &#39;custom extension method 1&#39;,\n                icon: &#39;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&#39;,\n                onclick: function (){\n                    alert(&#39;myToolHandler1&#39;)\n                }\n            },\n            myTool2: {\n                show: true,\n                title: &#39;custom extension method&#39;,\n                icon: &#39;image://http://echarts.baidu.com/images/favicon.png&#39;,\n                onclick: function (){\n                    alert(&#39;myToolHandler2&#39;)\n                }\n            }\n        }\n    }\n}\n</code></pre>\n","properties":{"saveAsImage":{"type":["Object"],"description":"<p>Save as image.</p>\n","properties":{"type":{"type":["string"],"default":"'png'"},"name":{"type":["string"]},"backgroundColor":{"type":["Color"],"default":"'auto'"},"excludeComponents":{"type":["Array"],"default":"['toolbox']"},"show":{"type":["boolean"],"default":true},"title":{"type":["boolean"],"default":"'save as image'"},"icon":{"type":["*"]},"iconStyle":{"type":["Object"],"description":"<p>The style setting of save as image icon.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"#666"},"borderWidth":{"type":["number"],"default":1},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"textPosition":{"type":["string"]},"textAlign":{"type":["string"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"pixelRatio":{"type":["number"],"default":1}}},"restore":{"type":["Object"],"description":"<p>Restore configuration item.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"title":{"type":["boolean"],"default":"'restore'"},"icon":{"type":["*"]},"iconStyle":{"type":["Object"],"description":"<p>The style setting of restore icon.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"#666"},"borderWidth":{"type":["number"],"default":1},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"textPosition":{"type":["string"]},"textAlign":{"type":["string"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}}}},"dataView":{"type":["Object"],"description":"<p>Data view tool, which could display data in current chart and updates chart after being edited.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"title":{"type":["boolean"],"default":"'data view'"},"icon":{"type":["*"]},"iconStyle":{"type":["Object"],"description":"<p>The style setting of data view icon.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"#666"},"borderWidth":{"type":["number"],"default":1},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"textPosition":{"type":["string"]},"textAlign":{"type":["string"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"readOnly":{"type":["boolean"],"default":false},"optionToContent":{"type":["Function"]},"contentToOption":{"type":["Function"]},"lang":{"type":["Array"],"default":"['data view', 'turn off', 'refresh']"},"backgroundColor":{"type":["string"],"default":"'#fff'"},"textareaColor":{"type":["string"],"default":"'#fff'"},"textareaBorderColor":{"type":["string"],"default":"'#333'"},"textColor":{"type":["string"],"default":"'#000'"},"buttonColor":{"type":["string"],"default":"'#c23531'"},"buttonTextColor":{"type":["string"],"default":"'#fff'"}}},"dataZoom":{"type":["Object"],"description":"<p>Data area zooming, which only supports rectangular coordinate by now.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"title":{"type":["Object"],"description":"<p>Restored and zoomed title text.</p>\n","properties":{"zoom":{"type":["string"],"default":"'area zooming'"},"back":{"type":["string"],"default":"'restore area zooming'"}}},"icon":{"type":["Object"],"description":"<p>Zooming and restore icon path.</p>\n","properties":{"zoom":{"type":["string"]},"back":{"type":["string"]}}},"iconStyle":{"type":["Object"],"description":"<p>The style setting of data area zooming icon.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"#666"},"borderWidth":{"type":["number"],"default":1},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"textPosition":{"type":["string"]},"textAlign":{"type":["string"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"xAxisIndex":{"type":["number","Array","boolean"]},"yAxisIndex":{"type":["number","Array","boolean"]}}},"magicType":{"type":["Object"],"description":"<p>Magic type switching.\n<strong>示例: </strong></p>\n<pre><code class=\"lang-js\">feature: {\n    magicType: {\n        type: [&#39;line&#39;, &#39;bar&#39;, &#39;stack&#39;, &#39;tiled&#39;]\n    }\n}\n</code></pre>\n","properties":{"show":{"type":["boolean"],"default":true},"type":{"type":["Array"]},"title":{"type":["Object"],"description":"<p>Title for different types, can be configured seperately.</p>\n","properties":{"line":{"type":["string"],"default":"'for line charts'"},"bar":{"type":["string"],"default":"'for bar charts'"},"stack":{"type":["string"],"default":"'for stacked charts'"},"tiled":{"type":["string"],"default":"'for tiled charts'"}}},"icon":{"type":["Object"],"description":"<p>the different types of icon path , which could be configurated individually.</p>\n","properties":{"line":{"type":["string"]},"bar":{"type":["string"]},"stack":{"type":["string"]},"tiled":{"type":["string"]}}},"iconStyle":{"type":["Object"],"description":"<p>The style setting of magic type switching icon.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"#666"},"borderWidth":{"type":["number"],"default":1},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"textPosition":{"type":["string"]},"textAlign":{"type":["string"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"option":{"type":["Object"],"description":"<p>Configuration item for each type, which will be used when switching to certain type.</p>\n","properties":{"line":{"type":["Object"]},"bar":{"type":["Object"]},"stack":{"type":["Object"]},"tiled":{"type":["Object"]}}},"seriesIndex":{"type":["Object"],"description":"<p>Series list for each type.</p>\n","properties":{"line":{"type":["Array"]},"bar":{"type":["Array"]},"stack":{"type":["Array"]},"tiled":{"type":["Array"]}}}}},"brush":{"type":["Object"],"description":"<p>Brush-selecting icon.</p>\n<p>It can also be configured at <a href=\"#brush.toolbox\">brush.toolbox</a>.</p>\n","properties":{"type":{"type":["Array"]},"icon":{"type":["Object"],"description":"<p>Icon path for each icon.</p>\n","properties":{"rect":{"type":["string"]},"polygon":{"type":["string"]},"lineX":{"type":["string"]},"lineY":{"type":["string"]},"keep":{"type":["string"]},"clear":{"type":["string"]}}},"title":{"type":["Object"],"description":"<p>Title.</p>\n","properties":{"rect":{"type":["string"],"default":"'Rectangle selection'"},"polygon":{"type":["string"],"default":"'Polygon selection'"},"lineX":{"type":["string"],"default":"'Horizontal selection'"},"lineY":{"type":["string"],"default":"'Vertical selection'"},"keep":{"type":["string"],"default":"'Keep previous selection'"},"clear":{"type":["string"],"default":"'Clear selection'"}}}}}}},"iconStyle":{"type":["Object"],"description":"<p>The style setting of Shared icon.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"#666"},"borderWidth":{"type":["number"],"default":1},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"textPosition":{"type":["string"]},"textAlign":{"type":["string"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"zlevel":{"type":["number"],"default":0},"z":{"type":["number"],"default":2},"left":{"type":["string","number"],"default":"'auto'"},"top":{"type":["string","number"],"default":"'auto'"},"right":{"type":["string","number"],"default":"'auto'"},"bottom":{"type":["string","number"],"default":"'auto'"},"width":{"type":["string","number"],"default":"'auto'"},"height":{"type":["string","number"],"default":"'auto'"}}},"brush":{"type":["Object"],"description":"<p><code>brush</code> is an area-selecting component, with which user can select part of data from a chart to display in detail, or doing calculations with them.</p>\n<p>Example:</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=scatter-map-brush&edit=1&reset=1\" width=\"800\" height=\"600\" ></iframe>\n\n\n\n<p><br></p>\n<hr>\n<p><strong>Brush type and triggering button</strong></p>\n<p>Currently, supported <code>brush</code> types include: <code>scatter</code>, <code>bar</code>, <code>candlestick</code>. (Note that <code>parallel</code> contains brush function by itself, which is not provided by brush component.)</p>\n<p>Click the button in <code>toolbox</code> to enable operations like <em>area selecting</em>, or <em>canceling selecting</em>.</p>\n<p><br>\nExample of <code>horizontal brush</code>: (Click the button in <code>toolbox</code> to enable brushing.)</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=candlestick-brush&edit=1&reset=1\" width=\"800\" height=\"500\" ></iframe>\n\n\n<p><br>\nExample of <code>brush</code> in <code>bar</code> charts:</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=bar-brush&edit=1&reset=1\" width=\"800\" height=\"400\" ></iframe>\n\n\n\n<p>Button for <code>brush</code> can be assigned in <a href=\"#toolbox.feature.brush.type\"><code>toolbox</code></a> or <a href=\"#brush.toolbox\"><code>brush</code> configuration</a>.</p>\n<p>The following types of brushes are supported: <code>rect</code>, <code>polygon</code>, <code>lineX</code>, <code>lineY</code>. See <a href=\"#brush.toolbox\">brush.toolbox</a> for more information.</p>\n<p><code>keep</code> button can be used to toggle single or multiple selection.</p>\n<ul>\n<li>Only one select box is available in single selection mode, and the select-box can be removed by clicking on the blank area.</li>\n<li>Multiple select boxes are available in multiple selection mode, and the select-boxes cannot be removed by click on the blank area. Instead, you need to click the <em>clear</em> button.</li>\n</ul>\n<p><br></p>\n<hr>\n<p><strong>Relationship between brush-selecting and coordinates</strong></p>\n<p><code>brush</code> can be set to be <em>global</em>, or <em>belonging to a particular coordinate</em>.</p>\n<p><strong>Global brushes</strong></p>\n<p>Selecting is enabled for everywhere in ECharts&#39;s instance in this case. This is the default situation, when brush is not set to be global.</p>\n<p><strong>Coordinate brushes</strong></p>\n<p>Selecting is enabled only in the assigned coordinates in this case. Selecting-box will be altered according to scaling and translating of coordinate (see <code>roam</code> and <code>dataZoom</code>).</p>\n<p>In practice, you may often find coordinate brush to be a more frequently made choice, particularly in <code>geo</code> charts.</p>\n<p>By assigning <a href=\"#brush.geoIndex\">brush.geoIndex</a>, or <a href=\"#brush.xAxisIndex\">brush.xAxisIndex</a>, or <a href=\"#brush.yAxisIndex\">brush.yAxisIndex</a>, brush selecting axes can be assigned, whose value can be:</p>\n<ul>\n<li><code>&#39;all&#39;</code>: for all axes;</li>\n<li><code>number</code>: like <code>0</code>, for a particular coordinate with that index;</li>\n<li><code>Array</code>: like <code>[0, 4, 2]</code>, for coordinates with those indexes;</li>\n<li><code>&#39;none&#39;</code>, or <code>null</code>, or <code>undefined</code>: for not assigning.</li>\n</ul>\n<p>Example:</p>\n<pre><code class=\"lang-javascript\">option = {\n    geo: {\n        ...\n    },\n    brush: {\n        geoIndex: &#39;all&#39;, // brush selecting is enabled only in all geo charts above\n        ...\n    }\n};\n</code></pre>\n<p>Example:</p>\n<pre><code class=\"lang-javascript\">option = {\n    grid: [\n        {...}, // grid 0\n        {...}  // grid 1\n    ],\n    xAxis: [\n        {gridIndex: 1, ...}, // xAxis 0 for grid 1\n        {gridIndex: 0, ...}  // xAxis 1 for grid 0\n    ],\n    yAxis: [\n        {gridIndex: 1, ...}, // yAxis 0 for grid 1\n        {gridIndex: 0, ...}  // yAxis 1 for grid 0\n    ],\n    brush: {\n        xAxisIndex: [0, 1], // brush selecting is enabled only in coordinates with xAxisIndex as `0` or `1`\n        ...\n    }\n};\n</code></pre>\n<p><br></p>\n<hr>\n<p><strong>Control select-box with API</strong></p>\n<p><code>dispatchAction</code> can be used to render select-box programatically. For example:</p>\n<pre><code class=\"lang-javascript\">myChart.dispatchAction({\n    type: &#39;brush&#39;,\n    areas: [\n        {\n            geoIndex: 0,\n            // Assign select-box type\n            brushType: &#39;polygon&#39;,\n            // Assign select-box shape\n            coordRange: [[119.72,34.85],[119.68,34.85],[119.5,34.84],[119.19,34.77]]\n        }\n    ]\n});\n</code></pre>\n<p>Please refer to <a href=\"api.html#action.brush\" target=\"_blank\">action.brush</a> for more information.</p>\n<p><br></p>\n<hr>\n<p><strong>brushLink</strong></p>\n<p>Links interaction between selected items in different series.</p>\n<p>Following is an example of enabling selected effect for <code>scatter</code> and <code>parallel</code> charts once a scatter chart is selected.</p>\n<p><code>brushLink</code> is an array of <code>seriesIndex</code>es, which assignes the series that can be interacted. For example, it can be:</p>\n<ul>\n<li><code>[3, 4, 5]</code> for interacting series with seriesIndex as <code>3</code>, <code>4</code>, or <code>5</code>;</li>\n<li><code>&#39;all&#39;</code> for interacting all series;</li>\n<li><code>&#39;none&#39;</code>, or <code>null</code>, or <code>undefined</code> for disabling <code>brushLink</code>.</li>\n</ul>\n<p><strong>Attention</strong></p>\n<p><code>brushLink</code> is a mapping of <code>dataIndex</code>. So <strong><code>data</code> of every series with <code>brushLink</code> should be guaranteed to correspond to the other</strong>.</p>\n<p>Example:</p>\n<pre><code class=\"lang-javascript\">option = {\n    brush: {\n        brushLink: [0, 1]\n    },\n    series: [\n        {\n            type: &#39;bar&#39;\n            data: [232,    4434,    545,      654]     // data has 4 items\n        },\n        {\n            type: &#39;parallel&#39;,\n            data: [[4, 5], [3, 5], [66, 33], [99, 66]] // data also has 4 items, which correspond to the data above\n        }\n    ]\n};\n</code></pre>\n<p>Please refer to <a href=\"#brush.brushLink\">brush.brushLink</a>.</p>\n<p><br></p>\n<hr>\n<p><strong>throttle / debounce</strong></p>\n<p>By default, <code>brushSelected</code> is always triggered when selection-box is selected or moved, to tell the outside about the event.</p>\n<p>But efficiency problems may occur when events are triggered too frequently, or the animation result may be affected. So brush components provides <a href=\"#brush.throttleType\">brush.throttleType</a> and <a href=\"#brush.throttleDelay\">brush.throttleDelay</a> to solve this problem.</p>\n<p>Valid <code>throttleType</code> values can be:</p>\n<ul>\n<li><code>&#39;debounce&#39;</code>: for triggering events only when the action has been stopped (no action after some duration). Time threshold can be assigned with <a href=\"#brush.throttleDelay\">brush.throttleDelay</a>;</li>\n<li><code>&#39;fixRate&#39;</code>: for triggering event with a certain frequency. The frequency can be assigned with <a href=\"#brush.throttleDelay\">brush.throttleDelay</a>.</li>\n</ul>\n<p>In this <a href=\"http://echarts.baidu.com/gallery/view.html?c=scatter-map-brush&amp;edit=1&amp;reset=1\" target=\"_blank\">example</a>, <code>debounce</code> is used to make sure the bar chart is updated only when the user has stopped action. In other cases, the animation result may not be so good.</p>\n<p><br></p>\n<hr>\n<p><strong>Visual configurations of selected and unselected items</strong></p>\n<p>Refer to <a href=\"#brush.inBrush\">brush.inBrush</a> and <a href=\"#brush.outOfBrush\">brush.outOfBrush</a>.</p>\n<p><br></p>\n<hr>\n<p>Here is the configuration in details.</p>\n","properties":{"id":{"type":["string"]},"toolbox":{"type":["Array"],"default":"['rect', 'polygon', 'keep', 'clear']"},"brushLink":{"type":["Array","string"],"default":null},"seriesIndex":{"type":["Array","number","string"],"default":"'all'"},"geoIndex":{"type":["Array","number","string"],"default":null},"xAxisIndex":{"type":["Array","number","string"],"default":null},"yAxisIndex":{"type":["Array","number","string"],"default":null},"brushType":{"type":["string"],"default":"'rect'"},"brushMode":{"type":["string"],"default":"'single'"},"transformable":{"type":["boolean"],"default":true},"brushStyle":{"type":["Object"]},"throttleType":{"type":["string"],"default":"'fixRate'"},"throttleDelay":{"type":["number"],"default":0},"removeOnClick":{"type":["number"],"default":true},"inBrush":{"type":["Object"]},"outOfBrush":{"type":["Object"]},"z":{"type":["number"],"default":10000}}},"geo":{"type":["Object"],"description":"<p>Geographic coorinate system component.</p>\n<p>Geographic coorinate system component is used to draw maps, which also supports <a href=\"#series-scatter\">scatter series</a>, and <a href=\"#series-lines\">line series</a>.</p>\n<p><strong>Example of using scatter series in geographic coordinate:</strong></p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=scatter-map&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n\n<p>From <code>3.1.10</code>, geo component also supports mouse events, whose parameters are:</p>\n<pre><code class=\"lang-js\">{\n    componentType: &#39;geo&#39;,\n    // geo component&#39;s index in option\n    geoIndex: number,\n    // name of clicking area, e.g., Shanghai\n    name: string,\n    // clicking region object as input, see geo.regions\n    region: Object\n}\n</code></pre>\n<p><strong>Tip:</strong>\nThe region color can also be controlled by map series. See <a href=\"#series-map.geoIndex\">series-map.geoIndex</a>.</p>\n","properties":{"id":{"type":["string"]},"show":{"type":["boolean"],"default":true},"map":{"type":["string"],"default":"''"},"roam":{"type":["boolean"],"default":false},"center":{"type":["Array"]},"aspectScale":{"type":["number"],"default":0.75},"boundingCoords":{"type":["Array"],"default":null},"zoom":{"type":["number"],"default":1},"scaleLimit":{"type":["Object"],"description":"<p>Limit of scaling, with <code>min</code> and <code>max</code>. <code>1</code> by default.</p>\n","properties":{"min":{"type":["number"]},"max":{"type":["number"]}}},"nameMap":{"type":["Object"]},"selectedMode":{"type":["boolean","string"],"default":false},"label":{"type":["Object"],"description":"<p>Text label of , to explain some data information about graphic item like value, name and so on. <code>label</code> is placed under <code>itemStyle</code> in ECharts 2.x. In ECharts 3, to make the configuration structure flatter, <code>label</code>is taken to be at the same level with <code>itemStyle</code>, and has <code>emphasis</code> as <code>itemStyle</code> does.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Graphic style of Map Area Border, <code>emphasis</code> is the style when it is highlighted, like being hovered by mouse, or highlighted via legend connect.</p>\n","properties":{"areaColor":{"type":["Color"],"description":"<p>Area filling color.</p>\n","default":"'#eee'","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}},"emphasis":{"type":["Object"],"description":"<p>Map area style in highlighted state.</p>\n","properties":{"areaColor":{"type":["Color"],"default":"'#eee'"},"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"zlevel":{"type":["number"],"default":0},"z":{"type":["number"],"default":2},"left":{"type":["string","number"],"default":"'auto'"},"top":{"type":["string","number"],"default":"'auto'"},"right":{"type":["string","number"],"default":"'auto'"},"bottom":{"type":["string","number"],"default":"'auto'"},"layoutCenter":{"type":["Array"],"default":null},"layoutSize":{"type":["number","string"]},"regions":{"type":["Array"],"description":"<p>Configure style for specified regions.\nFor example:</p>\n<pre><code class=\"lang-js\">regions: [{\n    name: &#39;Guangdong&#39;,\n    itemStyle: {\n        areaColor: &#39;red&#39;,\n        color: &#39;red&#39;\n    }\n}]\n</code></pre>\n<p>The region color can also be controlled by map series. See <a href=\"#series-map.geoIndex\">series-map.geoIndex</a>.</p>\n","items":{"type":"Object","properties":{"name":{"type":["string"]},"selected":{"type":["boolean"],"default":false},"itemStyle":{"type":["Object"],"description":"<p>Item style of this area.</p>\n","properties":{"areaColor":{"type":["Color"],"description":"<p>Area color in the map.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}},"emphasis":{"type":["Object"],"description":"","properties":{"areaColor":{"type":["Color"]},"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"<p>Text label of , to explain some data information about graphic item like value, name and so on. <code>label</code> is placed under <code>itemStyle</code> in ECharts 2.x. In ECharts 3, to make the configuration structure flatter, <code>label</code>is taken to be at the same level with <code>itemStyle</code>, and has <code>emphasis</code> as <code>itemStyle</code> does.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}}},"silent":{"type":["boolean"],"default":false}}},"parallel":{"type":["Object"],"description":"<p><br></p>\n<hr>\n<p><strong>Introduction about Parallel coordinates</strong></p>\n<p><a href=\"https://en.wikipedia.org/wiki/Parallel_coordinates\" target=\"_blank\">Parallel Coordinates</a> is a common way of visualizing high-dimensional geometry and analyzing multivariate data.</p>\n<p>For example, <a href=\"#series-parallel.data\">series-parallel.data</a> is the following data:</p>\n<pre><code class=\"lang-javascript\">[\n    [1,  55,  9,   56,  0.46,  18,  6,  &#39;good&#39;],\n    [2,  25,  11,  21,  0.65,  34,  9,  &#39;excellent&#39;],\n    [3,  56,  7,   63,  0.3,   14,  5,  &#39;good&#39;],\n    [4,  33,  7,   29,  0.33,  16,  6,  &#39;excellent&#39;],\n    { // Data item can also be an Object, so that perticular settings of its line can be set here.\n        value: [5,  42,  24,  44,  0.76,  40,  16, &#39;excellent&#39;]\n        lineStyle: {...},\n    }\n    ...\n]\n</code></pre>\n<p>In data above, each row is a &quot;data item&quot;, and each column represents a &quot;dimension&quot;. For example, the meanings of columns above are: &quot;data&quot;, &quot;AQI&quot;, &quot;PM2.5&quot;, &quot;PM10&quot;, &quot;carbon monoxide level&quot;, &quot;nitrogen dioxide level&quot;, and &quot;sulfur dioxide level&quot;.</p>\n<p>Parallel coordinates are much used to visualize multi-dimension data shown above. Each axis represents a dimension (namely, a column), and each line represents a data item. Data can be brush-selected on axes. For example:</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=doc-example/parallel-all&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n<hr>\n<p><strong>Brief about Configuration</strong></p>\n<p>Basic configuration parallel coordinates is shown as follow:</p>\n<pre><code class=\"lang-javascript\">option = {\n    parallelAxis: [                     // Definitions of axes.\n        {dim: 0, name: schema[0].text}, // Each axis has a &#39;dim&#39; attribute, representing dimension index in data.\n        {dim: 1, name: schema[1].text},\n        {dim: 2, name: schema[2].text},\n        {dim: 3, name: schema[3].text},\n        {dim: 4, name: schema[4].text},\n        {dim: 5, name: schema[5].text},\n        {dim: 6, name: schema[6].text},\n        {dim: 7, name: schema[7].text,\n            type: &#39;category&#39;,           // Also supports category data.\n            data: [&#39;Excellent&#39;, &#39;good&#39;, &#39;light pollution&#39;, &#39;moderate pollution&#39;, &#39;heavy pollution&#39;, &#39;severe pollution&#39;]\n        }\n    ],\n    parallel: {                         // Definition of a parallel coordinate system.\n        left: &#39;5%&#39;,                     // Location of parallel coordinate system.\n        right: &#39;13%&#39;,\n        bottom: &#39;10%&#39;,\n        top: &#39;20%&#39;,\n        parallelAxisDefault: {          // A pattern for axis definition, which can avoid repeating in `parallelAxis`.\n            type: &#39;value&#39;,\n            nameLocation: &#39;end&#39;,\n            nameGap: 20\n        }\n    },\n    series: [                           // Here the three series sharing the same parallel coordinate system.\n        {\n            name: &#39;Beijing&#39;,\n            type: &#39;parallel&#39;,           // The type of this series is &#39;parallel&#39;\n            data: [\n                [1,  55,  9,   56,  0.46,  18,  6,  &#39;good&#39;],\n                [2,  25,  11,  21,  0.65,  34,  9,  &#39;excellent&#39;],\n                ...\n            ]\n        },\n        {\n            name: &#39;Shanghai&#39;,\n            type: &#39;parallel&#39;,\n            data: [\n                [3,  56,  7,   63,  0.3,   14,  5,  &#39;good&#39;],\n                [4,  33,  7,   29,  0.33,  16,  6,  &#39;excellent&#39;],\n                ...\n            ]\n        },\n        {\n            name: &#39;Guangzhou&#39;,\n            type: &#39;parallel&#39;,\n            data: [\n                [4,  33,  7,   29,  0.33,  16,  6,  &#39;excellent&#39;],\n                [5,  42,  24,  44,  0.76,  40,  16, &#39;excellent&#39;],\n                ...\n            ]\n        }\n    ]\n};\n</code></pre>\n<p>Three components are involved here: <a href=\"#parallel\">parallel</a>, <a href=\"#parallelAxis\">parallelAxis</a>, <a href=\"#series-parallel\">series-parallel</a></p>\n<ul>\n<li><p><a href=\"#parallel\">parallel</a></p>\n<p>  This component is the coordinate system. One or more series (like &quot;Beijing&quot;, &quot;Shanghai&quot;, and &quot;Guangzhou&quot; in the above example) can share one coordinate system.</p>\n<p>  Like other coordinate systems, multiple parallel coordinate systems can be created in one echarts instance.</p>\n<p>  Position setting is also carried out here.</p>\n</li>\n<li><p><a href=\"#parallelAxis\">parallelAxis</a></p>\n<p>  This is axis configuration. Multiple axes are needed in parallel coordinates.</p>\n<p>  <a href=\"#parallelAxis.parallelIndex\">parallelAxis.parallelIndex</a> is used to specify which coordinate system this axis belongs to. The first coordinate system is used by default.</p>\n</li>\n<li><p><a href=\"#series-parallel\">series-parallel</a></p>\n<p>  This is the definition of parallel series, which will be drawn on parallel coordinate system.</p>\n<p>  <a href=\"#parallelAxis.parallelIndex\">parallelAxis.parallelIndex</a> is used to specify which coordinate system this axis belongs to. The first coordinate system is used by default.</p>\n</li>\n</ul>\n<p><br></p>\n<hr>\n<p><strong>Notes and Best Practices</strong></p>\n<p>When configuring multiple <a href=\"#parallelAxis\">parallelAxis</a>, there might be some common attributes in each axis configuration. To avoid writing them repeatly, they can be put under <a href=\"#parallel.parallelAxisDefault\">parallel.parallelAxisDefault</a>. Before initializing axis, configurations in <a href=\"#parallel.parallelAxisDefault\">parallel.parallelAxisDefault</a> will be merged into <a href=\"#parallelAxis\">parallelAxis</a> to generate the final axis configuration.</p>\n<p><strong>If data is too large and cause bad performance</strong></p>\n<p>It is suggested to set <a href=\"#series-parallel.lineStyle.width\">series-parallel.lineStyle.width</a> to be <code>0.5</code> (or less), which may improve performance significantly.</p>\n<p><br></p>\n<hr>\n<p><strong>Display High-Dimension Data</strong></p>\n<p>When dimension number is extremely large, say, more than 50 dimensions, there will be more than 50 axes, which may hardly display in a page.</p>\n<p>In this case, you may use <a href=\"#parallel.axisExpandable\">parallel.axisExpandable</a> to improve the display. See this example:</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=map-parallel-prices&edit=1&reset=1\" width=\"600\" height=\"460\" ></iframe>\n\n\n\n\n\n\n\n<p><br>\n<br></p>\n","properties":{"id":{"type":["string"]},"zlevel":{"type":["number"],"default":0},"z":{"type":["number"],"default":2},"left":{"type":["string","number"],"default":80},"top":{"type":["string","number"],"default":60},"right":{"type":["string","number"],"default":80},"bottom":{"type":["string","number"],"default":60},"width":{"type":["string","number"],"default":"'auto'"},"height":{"type":["string","number"],"default":"'auto'"},"layout":{"type":["string"],"default":"'horizontal'"},"axisExpandable":{"type":["boolean"],"default":false},"axisExpandCenter":{"type":["number"],"default":null},"axisExpandCount":{"type":["number"],"default":0},"axisExpandWidth":{"type":["number"],"default":50},"axisExpandTriggerOn":{"type":["string"],"default":"'click'"},"parallelAxisDefault":{"type":["Object"],"description":"<p>When configuring multiple <a href=\"#parallelAxis\">parallelAxis</a>, there might be some common attributes in each axis configuration. To avoid writing them repeatly, they can be put under <a href=\"#parallel.parallelAxisDefault\">parallel.parallelAxisDefault</a>. Before initializing axis, configurations in <a href=\"#parallel.parallelAxisDefault\">parallel.parallelAxisDefault</a> will be merged into <a href=\"#parallelAxis\">parallelAxis</a> to generate the final axis configuration.</p>\n<p><a href=\"http://echarts.baidu.com/gallery/editor.html?c=doc-example/parallel-all&amp;edit=1&amp;reset=1\" target=\"_blank\">See the sample</a>.</p>\n<p><br></p>\n","properties":{"type":{"type":["string"],"default":"value"},"name":{"type":["string"]},"nameLocation":{"type":["string"],"default":"'start'"},"nameTextStyle":{"type":["Object"],"description":"<p>Text style of axis name.</p>\n","properties":{"color":{"type":["Color"]},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}},"nameGap":{"type":["number"],"default":15},"nameRotate":{"type":["number"],"default":null},"inverse":{"type":["boolean"],"default":false},"boundaryGap":{"type":["boolean","Array"]},"min":{"type":["number","string"],"default":null},"max":{"type":["number","string"],"default":null},"scale":{"type":["boolean"],"default":false},"splitNumber":{"type":["number"],"default":5},"minInterval":{"type":["number"]},"interval":{"type":["number"]},"logBase":{"type":["number"],"default":10},"silent":{"type":["boolean"],"default":false},"triggerEvent":{"type":["boolean"],"default":false},"axisLine":{"type":["Object"],"description":"<p>Settings related to axis line.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"symbol":{"type":["string","Array"],"default":"'none'"},"symbolSize":{"type":["Array"],"default":"[10, 15]"},"symbolOffset":{"type":["Array","number"],"default":"[0, 0]"},"lineStyle":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"'#333'"},"width":{"type":["number"],"default":1},"type":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"axisTick":{"type":["Object"],"description":"<p>Settings related to axis tick.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"alignWithLabel":{"type":["boolean"],"default":false},"interval":{"type":["number","Function"],"default":"'auto'"},"inside":{"type":["boolean"],"default":false},"length":{"type":["number"],"default":5},"lineStyle":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"]},"width":{"type":["number"],"default":1},"type":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"axisLabel":{"type":["Object"],"description":"<p>Settings related to axis label.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"interval":{"type":["number","Function"],"default":"'auto'"},"inside":{"type":["boolean"],"default":false},"rotate":{"type":["number"],"default":0},"margin":{"type":["number"],"default":8},"formatter":{"type":["string","Function"],"default":null},"showMinLabel":{"type":["boolean"],"default":null},"showMaxLabel":{"type":["boolean"],"default":null},"color":{"type":["Color","Function"]},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}},"data":{"type":["Array"],"description":"<p>Category data, available in <a href=\"#parallelAxis.type\">type</a>: &#39;category&#39; axis.</p>\n<p>If <a href=\"#parallelAxis.type\">type</a> is not specified, but <code>axis.data</code> is specified, the <a href=\"#parallelAxis.type\">type</a> is auto set as <code>&#39;category&#39;</code>.</p>\n<p>If <a href=\"#parallelAxis.type\">type</a> is specified as <code>&#39;category&#39;</code>, but <code>axis.data</code> is not specified, <code>axis.data</code> will be auto collected from <a href=\"#series.data\">series.data</a>. It brings convenience, but we should notice that <code>axis.data</code> provides then value range of the <code>&#39;category&#39;</code> axis. If  it is auto collected from <a href=\"#series.data\">series.data</a>, Only the values appearing in <a href=\"#series.data\">series.data</a> can be collected. For example, if <a href=\"#series.data\">series.data</a> is empty, nothing will be collected.</p>\n<p>Example:</p>\n<pre><code class=\"lang-js\">// Name list of all categories\ndata: [&#39;Monday&#39;, &#39;Tuesday&#39;, &#39;Wednesday&#39;, &#39;Thursday&#39;, &#39;Friday&#39;, &#39;Saturday&#39;, &#39;Sunday&#39;]\n// Each item could also be a specific configuration item.\n// In this case, `value` is used as the category name.\ndata: [{\n    value: &#39;Monday&#39;,\n    // Highlight Monday\n    textStyle: {\n        fontSize: 20,\n        color: &#39;red&#39;\n    }\n}, &#39;Tuesday&#39;, &#39;Wednesday&#39;, &#39;Thursday&#39;, &#39;Friday&#39;, &#39;Saturday&#39;, &#39;Sunday&#39;]\n</code></pre>\n","items":{"type":"Object","properties":{"value":{"type":["string"]},"textStyle":{"type":["Object"],"description":"<p>Text style of the category.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}}}}},"parallelAxis":{"type":["Object"],"description":"<p>This component is the coordinate axis for parallel coordinate.</p>\n<p><br></p>\n<hr>\n<p><strong>Introduction about Parallel coordinates</strong></p>\n<p><a href=\"https://en.wikipedia.org/wiki/Parallel_coordinates\" target=\"_blank\">Parallel Coordinates</a> is a common way of visualizing high-dimensional geometry and analyzing multivariate data.</p>\n<p>For example, <a href=\"#series-parallel.data\">series-parallel.data</a> is the following data:</p>\n<pre><code class=\"lang-javascript\">[\n    [1,  55,  9,   56,  0.46,  18,  6,  &#39;good&#39;],\n    [2,  25,  11,  21,  0.65,  34,  9,  &#39;excellent&#39;],\n    [3,  56,  7,   63,  0.3,   14,  5,  &#39;good&#39;],\n    [4,  33,  7,   29,  0.33,  16,  6,  &#39;excellent&#39;],\n    { // Data item can also be an Object, so that perticular settings of its line can be set here.\n        value: [5,  42,  24,  44,  0.76,  40,  16, &#39;excellent&#39;]\n        lineStyle: {...},\n    }\n    ...\n]\n</code></pre>\n<p>In data above, each row is a &quot;data item&quot;, and each column represents a &quot;dimension&quot;. For example, the meanings of columns above are: &quot;data&quot;, &quot;AQI&quot;, &quot;PM2.5&quot;, &quot;PM10&quot;, &quot;carbon monoxide level&quot;, &quot;nitrogen dioxide level&quot;, and &quot;sulfur dioxide level&quot;.</p>\n<p>Parallel coordinates are much used to visualize multi-dimension data shown above. Each axis represents a dimension (namely, a column), and each line represents a data item. Data can be brush-selected on axes. For example:</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=doc-example/parallel-all&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n<hr>\n<p><strong>Brief about Configuration</strong></p>\n<p>Basic configuration parallel coordinates is shown as follow:</p>\n<pre><code class=\"lang-javascript\">option = {\n    parallelAxis: [                     // Definitions of axes.\n        {dim: 0, name: schema[0].text}, // Each axis has a &#39;dim&#39; attribute, representing dimension index in data.\n        {dim: 1, name: schema[1].text},\n        {dim: 2, name: schema[2].text},\n        {dim: 3, name: schema[3].text},\n        {dim: 4, name: schema[4].text},\n        {dim: 5, name: schema[5].text},\n        {dim: 6, name: schema[6].text},\n        {dim: 7, name: schema[7].text,\n            type: &#39;category&#39;,           // Also supports category data.\n            data: [&#39;Excellent&#39;, &#39;good&#39;, &#39;light pollution&#39;, &#39;moderate pollution&#39;, &#39;heavy pollution&#39;, &#39;severe pollution&#39;]\n        }\n    ],\n    parallel: {                         // Definition of a parallel coordinate system.\n        left: &#39;5%&#39;,                     // Location of parallel coordinate system.\n        right: &#39;13%&#39;,\n        bottom: &#39;10%&#39;,\n        top: &#39;20%&#39;,\n        parallelAxisDefault: {          // A pattern for axis definition, which can avoid repeating in `parallelAxis`.\n            type: &#39;value&#39;,\n            nameLocation: &#39;end&#39;,\n            nameGap: 20\n        }\n    },\n    series: [                           // Here the three series sharing the same parallel coordinate system.\n        {\n            name: &#39;Beijing&#39;,\n            type: &#39;parallel&#39;,           // The type of this series is &#39;parallel&#39;\n            data: [\n                [1,  55,  9,   56,  0.46,  18,  6,  &#39;good&#39;],\n                [2,  25,  11,  21,  0.65,  34,  9,  &#39;excellent&#39;],\n                ...\n            ]\n        },\n        {\n            name: &#39;Shanghai&#39;,\n            type: &#39;parallel&#39;,\n            data: [\n                [3,  56,  7,   63,  0.3,   14,  5,  &#39;good&#39;],\n                [4,  33,  7,   29,  0.33,  16,  6,  &#39;excellent&#39;],\n                ...\n            ]\n        },\n        {\n            name: &#39;Guangzhou&#39;,\n            type: &#39;parallel&#39;,\n            data: [\n                [4,  33,  7,   29,  0.33,  16,  6,  &#39;excellent&#39;],\n                [5,  42,  24,  44,  0.76,  40,  16, &#39;excellent&#39;],\n                ...\n            ]\n        }\n    ]\n};\n</code></pre>\n<p>Three components are involved here: <a href=\"#parallel\">parallel</a>, <a href=\"#parallelAxis\">parallelAxis</a>, <a href=\"#series-parallel\">series-parallel</a></p>\n<ul>\n<li><p><a href=\"#parallel\">parallel</a></p>\n<p>  This component is the coordinate system. One or more series (like &quot;Beijing&quot;, &quot;Shanghai&quot;, and &quot;Guangzhou&quot; in the above example) can share one coordinate system.</p>\n<p>  Like other coordinate systems, multiple parallel coordinate systems can be created in one echarts instance.</p>\n<p>  Position setting is also carried out here.</p>\n</li>\n<li><p><a href=\"#parallelAxis\">parallelAxis</a></p>\n<p>  This is axis configuration. Multiple axes are needed in parallel coordinates.</p>\n<p>  <a href=\"#parallelAxis.parallelIndex\">parallelAxis.parallelIndex</a> is used to specify which coordinate system this axis belongs to. The first coordinate system is used by default.</p>\n</li>\n<li><p><a href=\"#series-parallel\">series-parallel</a></p>\n<p>  This is the definition of parallel series, which will be drawn on parallel coordinate system.</p>\n<p>  <a href=\"#parallelAxis.parallelIndex\">parallelAxis.parallelIndex</a> is used to specify which coordinate system this axis belongs to. The first coordinate system is used by default.</p>\n</li>\n</ul>\n<p><br></p>\n<hr>\n<p><strong>Notes and Best Practices</strong></p>\n<p>When configuring multiple <a href=\"#parallelAxis\">parallelAxis</a>, there might be some common attributes in each axis configuration. To avoid writing them repeatly, they can be put under <a href=\"#parallel.parallelAxisDefault\">parallel.parallelAxisDefault</a>. Before initializing axis, configurations in <a href=\"#parallel.parallelAxisDefault\">parallel.parallelAxisDefault</a> will be merged into <a href=\"#parallelAxis\">parallelAxis</a> to generate the final axis configuration.</p>\n<p><strong>If data is too large and cause bad performance</strong></p>\n<p>It is suggested to set <a href=\"#series-parallel.lineStyle.width\">series-parallel.lineStyle.width</a> to be <code>0.5</code> (or less), which may improve performance significantly.</p>\n<p><br></p>\n<hr>\n<p><strong>Display High-Dimension Data</strong></p>\n<p>When dimension number is extremely large, say, more than 50 dimensions, there will be more than 50 axes, which may hardly display in a page.</p>\n<p>In this case, you may use <a href=\"#parallel.axisExpandable\">parallel.axisExpandable</a> to improve the display. See this example:</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=map-parallel-prices&edit=1&reset=1\" width=\"600\" height=\"460\" ></iframe>\n\n\n\n\n\n\n\n\n<p><br>\n<br></p>\n","properties":{"id":{"type":["string"]},"dim":{"type":["number"]},"parallelIndex":{"type":["number"],"default":0},"realtime":{"type":["boolean"],"default":true},"areaSelectStyle":{"type":["Object"],"description":"<p>Area selecting is available on axes. Here is some configurations.</p>\n<p><br></p>\n","properties":{"width":{"type":["number"],"default":20},"borderWidth":{"type":["number"],"default":1},"borderColor":{"type":["Color"],"default":"'rgba(160,197,232)'"},"color":{"type":["Color"],"default":"'rgba(160,197,232)'"},"opacity":{"type":["number"],"default":0.3}}},"type":{"type":["string"],"default":"value"},"name":{"type":["string"]},"nameLocation":{"type":["string"],"default":"'start'"},"nameTextStyle":{"type":["Object"],"description":"<p>Text style of axis name.</p>\n","properties":{"color":{"type":["Color"]},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}},"nameGap":{"type":["number"],"default":15},"nameRotate":{"type":["number"],"default":null},"inverse":{"type":["boolean"],"default":false},"boundaryGap":{"type":["boolean","Array"]},"min":{"type":["number","string"],"default":null},"max":{"type":["number","string"],"default":null},"scale":{"type":["boolean"],"default":false},"splitNumber":{"type":["number"],"default":5},"minInterval":{"type":["number"]},"interval":{"type":["number"]},"logBase":{"type":["number"],"default":10},"silent":{"type":["boolean"],"default":false},"triggerEvent":{"type":["boolean"],"default":false},"axisLine":{"type":["Object"],"description":"<p>Settings related to axis line.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"symbol":{"type":["string","Array"],"default":"'none'"},"symbolSize":{"type":["Array"],"default":"[10, 15]"},"symbolOffset":{"type":["Array","number"],"default":"[0, 0]"},"lineStyle":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"'#333'"},"width":{"type":["number"],"default":1},"type":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"axisTick":{"type":["Object"],"description":"<p>Settings related to axis tick.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"alignWithLabel":{"type":["boolean"],"default":false},"interval":{"type":["number","Function"],"default":"'auto'"},"inside":{"type":["boolean"],"default":false},"length":{"type":["number"],"default":5},"lineStyle":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"]},"width":{"type":["number"],"default":1},"type":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"axisLabel":{"type":["Object"],"description":"<p>Settings related to axis label.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"interval":{"type":["number","Function"],"default":"'auto'"},"inside":{"type":["boolean"],"default":false},"rotate":{"type":["number"],"default":0},"margin":{"type":["number"],"default":8},"formatter":{"type":["string","Function"],"default":null},"showMinLabel":{"type":["boolean"],"default":null},"showMaxLabel":{"type":["boolean"],"default":null},"color":{"type":["Color","Function"]},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}},"data":{"type":["Array"],"description":"<p>Category data, available in <a href=\"#parallelAxis.type\">type</a>: &#39;category&#39; axis.</p>\n<p>If <a href=\"#parallelAxis.type\">type</a> is not specified, but <code>axis.data</code> is specified, the <a href=\"#parallelAxis.type\">type</a> is auto set as <code>&#39;category&#39;</code>.</p>\n<p>If <a href=\"#parallelAxis.type\">type</a> is specified as <code>&#39;category&#39;</code>, but <code>axis.data</code> is not specified, <code>axis.data</code> will be auto collected from <a href=\"#series.data\">series.data</a>. It brings convenience, but we should notice that <code>axis.data</code> provides then value range of the <code>&#39;category&#39;</code> axis. If  it is auto collected from <a href=\"#series.data\">series.data</a>, Only the values appearing in <a href=\"#series.data\">series.data</a> can be collected. For example, if <a href=\"#series.data\">series.data</a> is empty, nothing will be collected.</p>\n<p>Example:</p>\n<pre><code class=\"lang-js\">// Name list of all categories\ndata: [&#39;Monday&#39;, &#39;Tuesday&#39;, &#39;Wednesday&#39;, &#39;Thursday&#39;, &#39;Friday&#39;, &#39;Saturday&#39;, &#39;Sunday&#39;]\n// Each item could also be a specific configuration item.\n// In this case, `value` is used as the category name.\ndata: [{\n    value: &#39;Monday&#39;,\n    // Highlight Monday\n    textStyle: {\n        fontSize: 20,\n        color: &#39;red&#39;\n    }\n}, &#39;Tuesday&#39;, &#39;Wednesday&#39;, &#39;Thursday&#39;, &#39;Friday&#39;, &#39;Saturday&#39;, &#39;Sunday&#39;]\n</code></pre>\n","items":{"type":"Object","properties":{"value":{"type":["string"]},"textStyle":{"type":["Object"],"description":"<p>Text style of the category.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}}},"singleAxis":{"type":["Object"],"description":"<p>An axis with a single dimension. It can be used to display data in one dimension. For example:</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=scatter-single-axis&edit=1&reset=1\" width=\"700\" height=\"500\" ></iframe>\n\n\n\n","properties":{"id":{"type":["string"]},"zlevel":{"type":["number"],"default":0},"z":{"type":["number"],"default":2},"left":{"type":["string","number"],"default":"'5%'"},"top":{"type":["string","number"],"default":"'5%'"},"right":{"type":["string","number"],"default":"'5%'"},"bottom":{"type":["string","number"],"default":"'5%'"},"width":{"type":["string","number"],"default":"'auto'"},"height":{"type":["string","number"],"default":"'auto'"},"orient":{"type":["string"],"default":"'horizontal'"},"type":{"type":["string"],"default":"'value'"},"name":{"type":["string"]},"nameLocation":{"type":["string"],"default":"'start'"},"nameTextStyle":{"type":["Object"],"description":"<p>Text style of axis name.</p>\n","properties":{"color":{"type":["Color"]},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}},"nameGap":{"type":["number"],"default":15},"nameRotate":{"type":["number"],"default":null},"inverse":{"type":["boolean"],"default":false},"boundaryGap":{"type":["boolean","Array"]},"min":{"type":["number","string"],"default":null},"max":{"type":["number","string"],"default":null},"scale":{"type":["boolean"],"default":false},"splitNumber":{"type":["number"],"default":5},"minInterval":{"type":["number"]},"interval":{"type":["number"]},"logBase":{"type":["number"],"default":10},"silent":{"type":["boolean"],"default":false},"triggerEvent":{"type":["boolean"],"default":false},"axisLine":{"type":["Object"],"description":"<p>Settings related to axis line.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"symbol":{"type":["string","Array"],"default":"'none'"},"symbolSize":{"type":["Array"],"default":"[10, 15]"},"symbolOffset":{"type":["Array","number"],"default":"[0, 0]"},"lineStyle":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"'#333'"},"width":{"type":["number"],"default":1},"type":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"axisTick":{"type":["Object"],"description":"<p>Settings related to axis tick.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"alignWithLabel":{"type":["boolean"],"default":false},"interval":{"type":["number","Function"],"default":"'auto'"},"inside":{"type":["boolean"],"default":false},"length":{"type":["number"],"default":5},"lineStyle":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"]},"width":{"type":["number"],"default":1},"type":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"axisLabel":{"type":["Object"],"description":"<p>Settings related to axis label.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"interval":{"type":["number","Function"],"default":"'auto'"},"inside":{"type":["boolean"],"default":false},"rotate":{"type":["number"],"default":0},"margin":{"type":["number"],"default":8},"formatter":{"type":["string","Function"],"default":null},"showMinLabel":{"type":["boolean"],"default":null},"showMaxLabel":{"type":["boolean"],"default":null},"color":{"type":["Color","Function"]},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}},"splitLine":{"type":["Object"],"description":"<p>SplitLine of axis in <a href=\"#grid\">grid</a> area.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"interval":{"type":["number","Function"],"default":"'auto'"},"lineStyle":{"type":["Object"],"description":"","properties":{"color":{"type":["Array","string"],"default":"['#ccc']"},"width":{"type":["number"],"default":1},"type":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"splitArea":{"type":["Object"],"description":"<p>Split area of axis in <a href=\"#grid\">grid</a> area, not shown by default.</p>\n","properties":{"interval":{"type":["number","Function"],"default":"'auto'"},"show":{"type":["boolean"],"default":false},"areaStyle":{"type":["Object"],"description":"<p>Split area style.</p>\n","properties":{"color":{"type":["Array"],"default":"['rgba(250,250,250,0.3)','rgba(200,200,200,0.3)']"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["Array"],"description":"<p>Category data, available in <a href=\"#singleAxis.type\">type</a>: &#39;category&#39; axis.</p>\n<p>If <a href=\"#singleAxis.type\">type</a> is not specified, but <code>axis.data</code> is specified, the <a href=\"#singleAxis.type\">type</a> is auto set as <code>&#39;category&#39;</code>.</p>\n<p>If <a href=\"#singleAxis.type\">type</a> is specified as <code>&#39;category&#39;</code>, but <code>axis.data</code> is not specified, <code>axis.data</code> will be auto collected from <a href=\"#series.data\">series.data</a>. It brings convenience, but we should notice that <code>axis.data</code> provides then value range of the <code>&#39;category&#39;</code> axis. If  it is auto collected from <a href=\"#series.data\">series.data</a>, Only the values appearing in <a href=\"#series.data\">series.data</a> can be collected. For example, if <a href=\"#series.data\">series.data</a> is empty, nothing will be collected.</p>\n<p>Example:</p>\n<pre><code class=\"lang-js\">// Name list of all categories\ndata: [&#39;Monday&#39;, &#39;Tuesday&#39;, &#39;Wednesday&#39;, &#39;Thursday&#39;, &#39;Friday&#39;, &#39;Saturday&#39;, &#39;Sunday&#39;]\n// Each item could also be a specific configuration item.\n// In this case, `value` is used as the category name.\ndata: [{\n    value: &#39;Monday&#39;,\n    // Highlight Monday\n    textStyle: {\n        fontSize: 20,\n        color: &#39;red&#39;\n    }\n}, &#39;Tuesday&#39;, &#39;Wednesday&#39;, &#39;Thursday&#39;, &#39;Friday&#39;, &#39;Saturday&#39;, &#39;Sunday&#39;]\n</code></pre>\n","items":{"type":"Object","properties":{"value":{"type":["string"]},"textStyle":{"type":["Object"],"description":"<p>Text style of the category.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}},"axisPointer":{"type":["Object"],"description":"<p>axisPointer settings on the axis.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"type":{"type":["string"],"default":"'line'"},"snap":{"type":["boolean"]},"z":{"type":["number"]},"label":{"type":["Object"],"description":"<p>label of axisPointer</p>\n","properties":{"show":{"type":["boolean"],"default":false},"precision":{"type":["number","string"],"default":"'auto'"},"formatter":{"type":["string","Function"],"default":null},"margin":{"type":["boolean"],"default":3},"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"padding":{"type":["string","Array"],"default":"[5, 7, 5, 7]"},"backgroundColor":{"type":["string"],"default":"'auto'"},"borderColor":{"type":["string"],"default":null},"borderWidth":{"type":["string"],"default":0},"shadowBlur":{"type":["number"],"default":3},"shadowColor":{"type":["Color"],"default":"#aaa"},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0}}},"lineStyle":{"type":["Object"],"description":"<p>It is valid when <a href=\"#tooltip.axisPointer.type\">axisPointer.type</a> is <code>&#39;line&#39;</code>.</p>\n","properties":{"color":{"type":["Color"],"default":"#555"},"width":{"type":["number"],"default":1},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}},"shadowStyle":{"type":["Object"],"description":"<p>It is valid when <a href=\"#tooltip.axisPointer.type\">axisPointer.type</a> is <code>&#39;shadow&#39;</code>.</p>\n","properties":{"color":{"type":["Color"],"default":"'rgba(150,150,150,0.3)"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}},"triggerTooltip":{"type":["boolean"],"default":true},"value":{"type":["number"],"default":null},"status":{"type":["boolean"]},"handle":{"type":["Object"],"description":"<p>A button used to drag axisPointer. This feature is applicable in touch device. See <a href=\"http://echarts.baidu.com/gallery/editor.html?c=line-tooltip-touch&amp;edit=1&amp;reset=1\" target=\"_blank\">example</a>.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"icon":{"type":["*"]},"size":{"type":["number","Array"],"default":45},"margin":{"type":["number"],"default":50},"color":{"type":["string"],"default":"'#333'"},"throttle":{"type":["number"],"default":40},"shadowBlur":{"type":["number"],"default":3},"shadowColor":{"type":["Color"],"default":"#aaa"},"shadowOffsetX":{"type":["number"],"default":2},"shadowOffsetY":{"type":["number"],"default":0}}}}},"tooltip":{"type":["*"],"description":"<p>tooltip settings in the coordinate system component.</p>\n<hr>\n<p><strong>General Introduction:</strong></p>\n<p>tooltip can be configured on different places:</p>\n<ul>\n<li><p>Configured on global: <a href=\"#tooltip\">tooltip</a></p>\n</li>\n<li><p>Configured in a coordinate system: <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>Configured in a series: <a href=\"#series.tooltip\">series.tooltip</a></p>\n</li>\n<li><p>Configured in each item of <code>series.data</code>: <a href=\"#series.data.tooltip\">series.data.tooltip</a></p>\n</li>\n</ul>\n<hr>\n","properties":{"show":{"type":["boolean"],"default":true},"trigger":{"type":["string"],"default":"'item'"},"axisPointer":{"type":["Object"],"description":"<p>Configuration item for axis indicator.</p>\n<p><code>tooltip.axisPointer</code> is like syntactic sugar of axisPointer settings on axes (for example, <a href=\"#xAxis.axisPointer\">xAxis.axisPointer</a> or <a href=\"#angleAxis.axisPointer\">angleAxis.axisPointer</a>). More detailed features can be configured on <code>someAxis.axisPointer</code>. But in common cases, using <code>tooltip.axisPinter</code> is more convenient.</p>\n<blockquote>\n<p><strong>Notice:</strong> configurations of <code>tooltip.axisPointer</code> has lower priority than that of <code>someAxis.axisPointer</code>.</p>\n</blockquote>\n<hr>\n<p><code>axisPointer</code> is a tool for displaying reference line and axis value under mouse pointer.</p>\n<p>For example:</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=doc-example/candlestick-axisPointer&edit=1&reset=1\" width=\"600\" height=\"450\" ></iframe>\n\n\n<p>In the demo above, <a href=\"#axisPointer.link\">axisPointer.link</a> is used to link axisPointer from different coordinate systems.</p>\n<p><code>axisPointer</code> can also be used on touch device, where user can drag the button to move the reference line and label.</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=line-tooltip-touch&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n<p>In the cases that more than one axis exist, axisPointer helps to look inside the data.</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=multiple-y-axis&edit=1&reset=1\" width=\"600\" height=\"300\" ></iframe>\n\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=multiple-x-axis&edit=1&reset=1\" width=\"600\" height=\"300\" ></iframe>\n\n\n\n<hr>\n<blockquote>\n<p><strong>Notice:</strong>\nGenerally, axisPointers is configured in each axes who need them (for example <a href=\"#xAxis.axisPointer\">xAxis.axisPointer</a>), or configured in <code>tooltip</code> (for example <a href=\"#tooltip.axisPointer\">tooltip.axisPointer</a>).</p>\n<p>But these configurations can only be configured in global axisPointer:\n<a href=\"#axisPointer.triggerOn\">axisPointer.triggerOn</a>, <a href=\"#axisPointer.link\">axisPointer.link</a>。</p>\n</blockquote>\n<hr>\n<hr>\n<p><strong>How to display axisPointer:</strong></p>\n<p>In <a href=\"#grid\">cartesian (grid)</a> and <a href=\"#single\">polar](~polar) and (single axis</a>, each axis has its own axisPointer.</p>\n<p>Those axisPointer will not be displayed by default, utill configured as follows:</p>\n<ul>\n<li><p>Set <code>someAxis.axisPointer.show</code> (like <a href=\"#xAxis.axisPointer.show\">xAxis.axisPointer.show</a>) as <code>true</code>. Then axisPointer of this axis will be displayed.</p>\n</li>\n<li><p>Set <a href=\"#tooltip.trigger\">tooltip.trigger</a> as <code>&#39;axis&#39;</code>, or set <a href=\"#tooltip.axisPointer.type\">tooltip.axisPointer.type</a> as <code>&#39;cross&#39;</code>. Then coordinate system will automatically chose the axes who will display their axisPointers. (<a href=\"#tooltip.axisPointer.axis\">tooltip.axisPointer.axis</a> can be used to change the choice.) Notice, <code>axis.axisPointer</code> will override <code>tooltip.axisPointer</code> settings.</p>\n</li>\n</ul>\n<hr>\n<p><strong>How to display the label of axisPointer:</strong></p>\n<p>The label of axisPointer will not be displayed by default(namely, only reference line will be displayed by default), utill configured as follows:</p>\n<ul>\n<li><p>Set <code>someAxis.axisPointer.label.show</code> (for example <a href=\"#xAxis.axisPointer.show\">xAxis.axisPointer.label.show</a>) as <code>true</code>. Then the label of the axisPointer will be displayed.</p>\n</li>\n<li><p>Set <a href=\"#tooltip.axisPointer.type\">tooltip.axisPointer.type</a> as  <code>&#39;cross&#39;</code>. Then the label of the crossed axisPointers will be displayed.</p>\n</li>\n</ul>\n<hr>\n<p><strong>How to configure axisPointer on touch device:</strong></p>\n<p>Set <code>someAxis.axisPointer.handle.show</code> (for example <a href=\"#xAxis.axisPointer.handle.show\">xAxis.axisPointer.handle.show</a> as <code>true</code>. Then the button for dragging will be displayed. (This feature is not supported on polar).</p>\n<p><strong>Notice:</strong>\nIf tooltip does not work well in this case, try to set<a href=\"#tooltip.triggerOn\">tooltip.triggerOn</a> as <code>&#39;none&#39;</code> (for the effect: show tooltip when finger holding on the button, and hide tooltip after finger left the button), or set <a href=\"#tooltip.alwaysShowContent\">tooltip.alwaysShowContent</a> as <code>true</code> (then tooltip will always be displayed).</p>\n<p>See the <a href=\"http://echarts.baidu.com/gallery/editor.html?c=line-tooltip-touch&amp;edit=1&amp;reset=1\" target=\"_blank\">example</a>.</p>\n<hr>\n<p><strong>Snap to point</strong></p>\n<p>In value axis and time axis, if <a href=\"#xAxis.axisPointer.snap\">snap</a> is set as true, axisPointer will snap to point automatically.</p>\n<hr>\n","properties":{"type":{"type":["string"],"default":"'line'"},"axis":{"type":["string"],"default":"'auto'"},"snap":{"type":["boolean"]},"z":{"type":["number"]},"label":{"type":["Object"],"description":"<p>label of axisPointer</p>\n","properties":{"show":{"type":["boolean"],"default":false},"precision":{"type":["number","string"],"default":"'auto'"},"formatter":{"type":["string","Function"],"default":null},"margin":{"type":["boolean"],"default":3},"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"padding":{"type":["string","Array"],"default":"[5, 7, 5, 7]"},"backgroundColor":{"type":["string"],"default":"'auto'"},"borderColor":{"type":["string"],"default":null},"borderWidth":{"type":["string"],"default":0},"shadowBlur":{"type":["number"],"default":3},"shadowColor":{"type":["Color"],"default":"#aaa"},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0}}},"lineStyle":{"type":["Object"],"description":"<p>It is valid when <a href=\"#tooltip.axisPointer.type\">axisPointer.type</a> is <code>&#39;line&#39;</code>.</p>\n","properties":{"color":{"type":["Color"],"default":"#555"},"width":{"type":["number"],"default":1},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}},"shadowStyle":{"type":["Object"],"description":"<p>It is valid when <a href=\"#tooltip.axisPointer.type\">axisPointer.type</a> is <code>&#39;shadow&#39;</code>.</p>\n","properties":{"color":{"type":["Color"],"default":"'rgba(150,150,150,0.3)"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}},"crossStyle":{"type":["Object"],"description":"<p>It is valid when <a href=\"#tooltip.axisPointer.type\">axisPointer.type</a> is <code>&#39;cross&#39;</code>.</p>\n","properties":{"color":{"type":["Color"],"default":"#555"},"width":{"type":["number"],"default":1},"type":{"type":["string"],"default":"dashed"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"position":{"type":["string","Array"]},"formatter":{"type":["string","Function"]},"backgroundColor":{"type":["Color"],"default":"'rgba(50,50,50,0.7)'"},"borderColor":{"type":["Color"],"default":"'#333'"},"borderWidth":{"type":["number"],"default":0},"padding":{"type":["number"],"default":5},"textStyle":{"type":["Object"],"description":"<p>The text syle of tooltip&#39;s floating layer.</p>\n","properties":{"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":14},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"extraCssText":{"type":["string"]}}}}},"timeline":{"type":["Object"],"description":"<p><code>timeline</code> component, which provides functions like switching and playing between multiple ECharts <code>options</code>.</p>\n<p>Here is an example:</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=doc-example/mix-timeline-all&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n<p>Different from other components, <code>timeline</code> component requires multiple options. If the traditional way of ECharts option is called <em>atomic option</em>, then, the option used along with timeline should be call a <em>compound option</em> composed with multiple atomic options. For example:</p>\n<pre><code class=\"lang-javascript\">// In the following example, baseOption is an *atomic option*, so as each item in options array.\n// Each of the atomic option follows configuration introduced in this document.\nmyChart.setOption(\n    {\n        baseOption: {\n            timeline: {\n                ...,\n                data: [&#39;2002-01-01&#39;, &#39;2003-01-01&#39;, &#39;2004-01-01&#39;]\n            },\n            title: {\n                subtext: &#39; Data is from National Bureau of Statistics &#39;\n            },\n            grid: {...},\n            xAxis: [...],\n            yAxis: [...],\n            series: [\n                { // other configurations of series 1\n                    type: &#39;bar&#39;,\n                    ...\n                },\n                { // other configurations of series 2\n                    type: &#39;line&#39;,\n                    ...\n                },\n                { // other configurations of series 3\n                    type: &#39;pie&#39;,\n                    ...\n                }\n            ]\n        },\n        options: [\n            { // it is an option corresponding to &#39;2002-01-01&#39;\n                title: {\n                text: &#39;the statistics of the year 2002&#39;\n                },\n                series: [\n                    {data: []}, // the data of series 1\n                    {data: []}, // the data of series 2\n                    {data: []}  // the data of series 3\n                ]\n            },\n            { // it is an option corresponding to &#39;2003-01-01&#39;\n                title: {\n                    text: &#39;the statistics of the year 2003&#39;\n                },\n                series: [\n                    {data: []},\n                    {data: []},\n                    {data: []}\n                ]\n            },\n            { // it is an option corresponding to &#39;2004-01-01&#39;\n                title: {\n                    text: &#39;the statistics of the year 2004&#39;\n                },\n                series: [\n                    {data: []},\n                    {data: []},\n                    {data: []}\n                ]\n            }\n        ]\n    }\n);\n</code></pre>\n<p>In the above example, each item in <code>timeline.data</code> corresponds to each <code>option</code> of <code>options</code> array.</p>\n<p><br>\n<strong>Attention and Best Practice: </strong></p>\n<ul>\n<li><p>Shared configuration items are recommended to be set in <code>baseOption</code>. When switching in <code>timeline</code>, <code>option</code> in corresponding <code>options</code> array will be merged with <code>baseOption</code> to form the final <code>option</code>.</p>\n</li>\n<li><p>In <code>options</code> array, if an attribute is configured in one of the options, then, it should also be configured in other options. Otherwise, this attribute will be ignored.</p>\n</li>\n<li><p><code>options</code> in <em>compound option</em> doesn&#39;t support merge.</p>\n<p>  That is to say, when calling <code>chart.setOption(rawOption)</code> after the first time, if <code>rawOption</code> is a <em>compound option</em> (meaning that it contains an array of <code>options</code>), then the new <code>rawOption.options</code> will replace the old one, instead of merging with it. Of course, <code>rawOption.baseOption</code> will be merged with that of old option normally.</p>\n</li>\n</ul>\n<p><br>\n<strong>Compatibility with ECharts 2: </strong></p>\n<ul>\n<li><p>ECharts3 doesn&#39;t support <code>timeline.notMerge</code> parameter any more, which implies <em>notMerge mode</em> is no longer supported. If you need this function, you may manage the option in your own program before passing to <code>setOption(option, true)</code>.</p>\n</li>\n<li><p>Comparing ECharts 3 with ECharts 2, the definition location of timeline attributes are different. The one in ECharts 3 is moved to  <code>baseOption</code> and is regarded as a seperate component, which is also compatible with the timeline definition location of ECharts 2. But it is not recommended to do so.</p>\n</li>\n</ul>\n","properties":{"show":{"type":["boolean"],"default":true},"type":{"type":["string"],"default":"'slider'"},"axisType":{"type":["string"],"default":"'time'"},"currentIndex":{"type":["number"],"default":0},"autoPlay":{"type":["boolean"],"default":false},"rewind":{"type":["boolean"],"default":false},"loop":{"type":["boolean"],"default":true},"playInterval":{"type":["number"],"default":2000},"realtime":{"type":["boolean"],"default":true},"controlPosition":{"type":["string"],"default":"'left'"},"zlevel":{"type":["number"],"default":0},"z":{"type":["number"],"default":2},"left":{"type":["string","number"],"default":"'auto'"},"top":{"type":["string","number"],"default":"'auto'"},"right":{"type":["string","number"],"default":"'auto'"},"bottom":{"type":["string","number"],"default":"'auto'"},"padding":{"type":["number","Array"],"default":5},"orient":{"type":["string"],"default":"'horizontal'"},"inverse":{"type":["boolean"],"default":false},"symbol":{"type":["string"],"default":"'emptyCircle'"},"symbolSize":{"type":["number","Array"],"default":10},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"lineStyle":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"color":{"type":["Color"],"default":"'#304654'"},"width":{"type":["number"],"default":2},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}},"label":{"type":["Object"],"description":"<p>Label axis, <code>emphasis</code> is the highlighted style of text. For instance, text style in <code>emphasis</code> would be used when mouse hovers or legend connects.</p>\n","properties":{"position":{"type":["string","number"],"default":"'auto'"},"show":{"type":["boolean"],"default":true},"interval":{"type":["string","number"],"default":"'auto'"},"rotate":{"type":["prefix"],"default":0},"formatter":{"type":["string","Function"],"default":null},"color":{"type":["Color"],"default":"'#304654'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"interval":{"type":["string","number"],"default":"'auto'"},"rotate":{"type":["prefix"],"default":0},"formatter":{"type":["string","Function"],"default":null},"color":{"type":["Color"],"default":"'#c23531'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Graphic style of timeline , <code>emphasis</code> is the style when it is highlighted, like being hovered by mouse, or highlighted via legend connect.</p>\n","properties":{"color":{"type":["Color"],"default":"'#304654'"},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":1},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"'#c23531'"},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":1},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"checkpointStyle":{"type":["Object"],"description":"<p>Style of the selected item (<code>checkpoint</code>).</p>\n","properties":{"symbol":{"type":["string"],"default":"'circle'"},"symbolSize":{"type":["number","Array"],"default":13},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"color":{"type":["Color"],"default":"'#c23531'"},"borderWidth":{"type":["number"],"default":5},"borderColor":{"type":["Color"],"default":"'rgba(194,53,49, 0.5)'"},"animation":{"type":["boolean"],"default":true},"animationDuration":{"type":["number"],"default":300},"animationEasing":{"type":["string"],"default":"'quinticInOut'"}}},"controlStyle":{"type":["Object"],"description":"<p>The style of <em>control button</em>, which includes: <em>play button</em>, <em>previous button</em>, and <em>next button</em>.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"showPlayBtn":{"type":["boolean"],"default":true},"showPrevBtn":{"type":["boolean"],"default":true},"showNextBtn":{"type":["boolean"],"default":true},"itemSize":{"type":["number"],"default":22},"itemGap":{"type":["number"],"default":12},"position":{"type":["string"],"default":"'left'"},"playIcon":{"type":["string"]},"stopIcon":{"type":["string"]},"prevIcon":{"type":["string"]},"nextIcon":{"type":["string"]},"color":{"type":["Color"],"default":"'#304654'"},"borderColor":{"type":["Color"],"default":"'#304654'"},"borderWidth":{"type":["number"],"default":1},"emphasis":{"type":["Object"],"description":"<p>Button style in <em>highlighted state</em> (when it&#39;s hovered by mouse).</p>\n","properties":{"color":{"type":["Color"],"default":"'#c23531'"},"borderColor":{"type":["Color"],"default":"'#c23531'"},"borderWidth":{"type":["number"],"default":2}}}}},"data":{"type":["Array"]}}},"graphic":{"type":["*"],"description":"<p><code>graphic</code> component enable creating graphic elements in echarts.</p>\n<p>Those graphic type are supported.</p>\n<p><a href=\"#graphic.elements-image\">image</a>,\n<a href=\"#graphic.elements-text\">text</a>,\n<a href=\"#graphic.elements-circle\">circle</a>,\n<a href=\"#graphic.elements-sector\">sector</a>,\n<a href=\"#graphic.elements-ring\">ring</a>,\n<a href=\"#graphic.elements-polygon\">polygon</a>,\n<a href=\"#graphic.elements-polyline\">polyline</a>,\n<a href=\"#graphic.elements-rect\">rect</a>,\n<a href=\"#graphic.elements-line\">line</a>,\n<a href=\"#graphic.elements-bezierCurve\">bezierCurve</a>,\n<a href=\"#graphic.elements-arc\">arc</a>,\n<a href=\"#graphic.elements-group\">group</a>,</p>\n<p>This example shows how to make a watermark and text block:</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=line-graphic&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n<p>This example use hidden graphic elements to implement dragging:</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=line-draggable&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n\n\n<p><br></p>\n<hr>\n<p><strong>Graphic Component Configuration</strong></p>\n<p>A simple way to define a graphic element:</p>\n<pre><code class=\"lang-javascript\">myChart.setOption({\n    ...,\n    graphic: {\n        type: &#39;image&#39;,\n        ...\n    }\n});\n</code></pre>\n<p>Define multiple graphic elements:</p>\n<pre><code class=\"lang-javascript\">myChart.setOption({\n    ...,\n    graphic: [\n        { // A &#39;image&#39; element.\n            type: &#39;image&#39;,\n            ...\n        },\n        { // A &#39;text&#39; element, with id specified.\n            type: &#39;text&#39;,\n            id: &#39;text1&#39;,\n            ...\n        },\n        { // A &#39;group&#39; element, in which children can be defined.\n            type: &#39;group&#39;,\n            children: [\n                {\n                    type: &#39;rect&#39;,\n                    id: &#39;rect1&#39;,\n                    ...\n                },\n                {\n                    type: &#39;image&#39;,\n                    ...\n                },\n                ...\n            ]\n        }\n        ...\n    ]\n});\n</code></pre>\n<p>How to remove or replace existing elements by <code>setOption</code>:</p>\n<pre><code class=\"lang-javascript\">myChart.setOption({\n    ...,\n    graphic: [\n        { // Remove the element &#39;text1&#39; defined above.\n            id: &#39;text1&#39;,\n            $action: &#39;remove&#39;,\n            ...\n        },\n        { // Replace the element &#39;rect1&#39; to a new circle element.\n          // Note, although in the sample above &#39;rect1&#39; is a children of a group,\n          // it is not necessary to consider level relationship when setOption\n          // again if you use id to specify them.\n            id: &#39;rect1&#39;,\n            $action: &#39;replace&#39;,\n            type: &#39;circle&#39;,\n            ...\n        }\n    ]\n});\n</code></pre>\n<p>Notice, when using <code>setOption</code> to modify existing elements, if id is not specified, new options will be mapped to exsiting elements by their order, which might bring unexpected result sometimes. So, generally, using id is recommended.</p>\n<p><br></p>\n<hr>\n<p><strong>Graphic Element Configuration</strong></p>\n<p>Different types of graphic elements has their own configuration respectively, but they have these common configuration below:</p>\n<pre><code class=\"lang-javascript\">{\n    // id is used to specifying element when willing to update it.\n    // id can be ignored if you do not need it.\n    id: &#39;xxx&#39;,\n\n    // Specify element type. Can not be ignored when define a element at the first time.\n    type: &#39;image&#39;,\n\n    // All of the properties below can be ignored and a default value will be assigned.\n\n    // Specify the operation should be performed to the element when calling `setOption`.\n    // Default value is &#39;merge&#39;, other values can be &#39;replace&#39; or &#39;remove&#39;.\n    $action: &#39;replace&#39;,\n\n    // These four properties is used to locating the element. Each property can be absolute\n    // value (like 10, means 10 pixel) or precent (like &#39;12%&#39;) or &#39;center&#39;/&#39;middle&#39;.\n    left: 10,\n    // right: 10,\n    top: &#39;center&#39;,\n    // bottom: &#39;10%&#39;,\n\n    shape: {\n        // Here are configurations for shape, like `x`, `y`, `cx`, `cy`, `width`,\n        // `height`, `r`, `points`, ...\n        // Note, if `left`/`right`/`top`/`bottom` has been set, `x`/`y`/`cx`/`cy`\n        // do not work here.\n    },\n\n    style: {\n        // Here are configurations for style of the element, like `fill`, `stroke`,\n        // `lineWidth`, `shadowBlur`, ...\n    },\n\n    // z value of the elements.\n    z: 10,\n    // Whether response to mouse events / touch events.\n    silent: true,\n    // Whether the element is visible.\n    invisible: false,\n    // Used to specify whether the entire transformed element (containing children if is group)\n    // is confined in its container. Optional values: &#39;raw&#39;, &#39;all&#39;.\n    bounding: &#39;raw&#39;,\n    // Can be dragged or not.\n    draggable: false,\n    // Event handler, can also be onmousemove, ondrag, ... (listed below)\n    onclick: function () {...}\n}\n</code></pre>\n<p><br></p>\n<hr>\n<p><strong>Event Handlers of Graphic Element</strong></p>\n<p>These events are supported:\n<code>onclick</code>, <code>onmouseover</code>, <code>onmouseout</code>, <code>onmousemove</code>, <code>onmousewheel</code>, <code>onmousedown</code>, <code>onmouseup</code>, <code>ondrag</code>, <code>ondragstart</code>, <code>ondragend</code>, <code>ondragenter</code>, <code>ondragleave</code>, <code>ondragover</code>, <code>ondrop</code>.</p>\n<p><br></p>\n<hr>\n<p><strong>Hierarchy of Graphic Elements</strong></p>\n<p>Only <code>group</code> element has children, which enable a group of elements to be positioned and transformed together.</p>\n<p><br></p>\n<hr>\n<p><strong>Shape Configuration of Graphic Element</strong></p>\n<p>Elements with different types have different shape setting repectively. For example:</p>\n<pre><code class=\"lang-javascript\">{\n    type: &#39;rect&#39;,\n    shape: {\n        x: 10,\n        y: 10,\n        width: 100,\n        height: 200\n    }\n},\n{\n    type: &#39;circle&#39;,\n    shape: {\n        cx: 20,\n        cy: 30,\n        r: 100\n    }\n},\n{\n    type: &#39;image&#39;,\n    style: {\n        image: &#39;http://xxx.xxx.xxx/a.png&#39;,\n        x: 100,\n        y: 200,\n        width: 230,\n        height: 400\n    }\n},\n{\n    type: &#39;text&#39;,\n    style: {\n        text: &#39;This text&#39;,\n        x: 100,\n        y: 200\n    }\n\n}\n</code></pre>\n<p><br></p>\n<hr>\n<p><strong>Transforming and Absolutely Positioning of Graphic Element</strong></p>\n<p>Element can be transformed (translation, rotation, scale). For example:</p>\n<pre><code class=\"lang-javascript\">{\n    type: &#39;rect&#39;, // or any other types.\n\n    // Translation, using [0, 0] by default.\n    position: [100, 200],\n\n    // Scale, using [1, 1] by default.\n    scale: [2, 4],\n\n    // Rotation, using 0 by default. Negative value means rotating clockwise.\n    rotation: Math.PI / 4,\n\n    // Origin point of rotation and scale, using [0, 0] by default.\n    origin: [10, 20],\n\n    shape: {\n        // ...\n    }\n}\n</code></pre>\n<ul>\n<li><p>Each element is transformed in the coordinate system of its parent, namely, transform of a element and its parent can be &quot;stacked&quot;.</p>\n</li>\n<li><p>Transformation is performed by this order:</p>\n<ol>\n<li>Translate [-el.origin[0], -el.origin[1]]。</li>\n<li>Scale according to el.scale.</li>\n<li>Rotate according to el.rotation.</li>\n<li>Translate back according to el.origin.</li>\n<li>Translate according to el.position.</li>\n</ol>\n</li>\n<li>Namely, scaling and rotating firstly, and then translate. By this mechanism, translation does not affect origin of scale and rotation.</li>\n</ul>\n<p><br></p>\n<hr>\n<p><strong>Relatively Positioning</strong></p>\n<p>In real application, size of a container is always not fixed. So mechanism of relative position is required. In <code>graphic</code> component, <a href=\"#graphic.elements.left\">left</a> / <a href=\"#graphic.elements.right\">right</a> / <a href=\"#graphic.elements.top\">top</a> / <a href=\"#graphic.elements.bottom\">bottom</a> / <a href=\"#graphic.elements.width\">width</a> / <a href=\"#graphic.elements.height\">height</a> are used to position element relatively.</p>\n<p>For example:</p>\n<pre><code class=\"lang-javascript\">{ // Position the image at the bottom center of its container.\n    type: &#39;image&#39;,\n    left: &#39;center&#39;, // Position at the center horizontally.\n    bottom: &#39;10%&#39;,  // Position beyond the bottom boundary 10%.\n    style: {\n        image: &#39;http://xxx.xxx.xxx/a.png&#39;,\n        width: 45,\n        height: 45\n    }\n},\n{ // Position the entire rotated group at the right-bottom corner of its container.\n    type: &#39;group&#39;,\n    right: 0,  // Position at the right boundary.\n    bottom: 0, // Position at the bottom boundary.\n    rotation: Math.PI / 4,\n    children: [\n        {\n            type: &#39;rect&#39;,\n            left: &#39;center&#39;, // Position at horizontal center according to its parent.\n            top: &#39;middle&#39;,  // Position at vertical center according to its parent.\n            shape: {\n                width: 190,\n                height: 90\n            },\n            style: {\n                fill: &#39;#fff&#39;,\n                stroke: &#39;#999&#39;,\n                lineWidth: 2,\n                shadowBlur: 8,\n                shadowOffsetX: 3,\n                shadowOffsetY: 3,\n                shadowColor: &#39;rgba(0,0,0,0.3)&#39;\n            }\n        },\n        {\n            type: &#39;text&#39;,\n            left: &#39;center&#39;, // Position at horizontal center according to its parent.\n            top: &#39;middle&#39;,  // Position at vertical center according to its parent.\n            style: {\n                fill: &#39;#777&#39;,\n                text: [\n                    &#39;This is text&#39;,\n                    &#39;This is text&#39;,\n                    &#39;Print some text&#39;\n                ].join(&#39;\\n&#39;),\n                font: &#39;14px Microsoft YaHei&#39;\n            }\n        }\n    ]\n}\n</code></pre>\n<p>Note, <a href=\"graphic.elements.bounding\" target=\"_blank\">bounding</a> can be used to specify whether the entire transformed element (containing children if is group) is confined in its container.</p>\n<p><br></p>\n<hr>\n<p>Detailed configurations are listed as follows.</p>\n","properties":{"id":{"type":["string"]},"elements":{"type":"Array","items":{"anyOf":[{"type":["Object"],"description":"<p><code>group</code> is the only type that can contain children, so that a group of elements can be positioned and transformed together.</p>\n","properties":{"type":{"type":["string"],"default":"group"},"id":{"type":["string"],"default":"undefined"},"$action":{"type":["string"],"default":"'merge'"},"left":{"type":["number","string"],"default":"undefined"},"right":{"type":["number","string"],"default":"undefined"},"top":{"type":["number","string"],"default":"undefined"},"bottom":{"type":["number","string"],"default":"undefined"},"bounding":{"type":["strin"],"default":"'all'"},"z":{"type":["number"],"default":0},"zlevel":{"type":["number"],"default":0},"silent":{"type":["boolean"],"default":false},"invisible":{"type":["boolean"],"default":false},"cursor":{"type":["string"],"default":"'pointer'"},"draggable":{"type":["boolean"],"default":false},"progressive":{"type":["boolean"],"default":false},"width":{"type":["number"],"default":0},"height":{"type":["number"],"default":0},"children":{"type":["Array"]},"onclick":{"type":["Function"]},"onmouseover":{"type":["Function"]},"onmouseout":{"type":["Function"]},"onmousemove":{"type":["Function"]},"onmousewheel":{"type":["Function"]},"onmousedown":{"type":["Function"]},"onmouseup":{"type":["Function"]},"ondrag":{"type":["Function"]},"ondragstart":{"type":["Function"]},"ondragend":{"type":["Function"]},"ondragenter":{"type":["Function"]},"ondragleave":{"type":["Function"]},"ondragover":{"type":["Function"]},"ondrop":{"type":["Function"]}}},{"type":["Object"],"description":"","properties":{"type":{"type":["string"],"default":"image"},"id":{"type":["string"],"default":"undefined"},"$action":{"type":["string"],"default":"'merge'"},"left":{"type":["number","string"],"default":"undefined"},"right":{"type":["number","string"],"default":"undefined"},"top":{"type":["number","string"],"default":"undefined"},"bottom":{"type":["number","string"],"default":"undefined"},"bounding":{"type":["strin"],"default":"'all'"},"z":{"type":["number"],"default":0},"zlevel":{"type":["number"],"default":0},"silent":{"type":["boolean"],"default":false},"invisible":{"type":["boolean"],"default":false},"cursor":{"type":["string"],"default":"'pointer'"},"draggable":{"type":["boolean"],"default":false},"progressive":{"type":["boolean"],"default":false},"style":{"type":["Object"],"description":"","properties":{"image":{"type":["string"]},"x":{"type":["number"],"default":0},"y":{"type":["numbr"],"default":0},"width":{"type":["number"],"default":0},"height":{"type":["numbr"],"default":0},"fill":{"type":["string"],"default":"'#000'"},"stroke":{"type":["string"],"default":null},"lineWidth":{"type":["number"],"default":0},"shadowBlur":{"type":["number"],"default":"undefined"},"shadowOffsetX":{"type":["number"],"default":"undefined"},"shadowOffsetY":{"type":["number"],"default":"undefined"},"shadowColor":{"type":["number"],"default":"undefined"}}},"onclick":{"type":["Function"]},"onmouseover":{"type":["Function"]},"onmouseout":{"type":["Function"]},"onmousemove":{"type":["Function"]},"onmousewheel":{"type":["Function"]},"onmousedown":{"type":["Function"]},"onmouseup":{"type":["Function"]},"ondrag":{"type":["Function"]},"ondragstart":{"type":["Function"]},"ondragend":{"type":["Function"]},"ondragenter":{"type":["Function"]},"ondragleave":{"type":["Function"]},"ondragover":{"type":["Function"]},"ondrop":{"type":["Function"]}}},{"type":["Object"],"description":"<p>Text block.</p>\n","properties":{"type":{"type":["string"],"default":"text"},"id":{"type":["string"],"default":"undefined"},"$action":{"type":["string"],"default":"'merge'"},"left":{"type":["number","string"],"default":"undefined"},"right":{"type":["number","string"],"default":"undefined"},"top":{"type":["number","string"],"default":"undefined"},"bottom":{"type":["number","string"],"default":"undefined"},"bounding":{"type":["strin"],"default":"'all'"},"z":{"type":["number"],"default":0},"zlevel":{"type":["number"],"default":0},"silent":{"type":["boolean"],"default":false},"invisible":{"type":["boolean"],"default":false},"cursor":{"type":["string"],"default":"'pointer'"},"draggable":{"type":["boolean"],"default":false},"progressive":{"type":["boolean"],"default":false},"style":{"type":["Object"],"description":"","properties":{"text":{"type":["string"],"default":"''"},"x":{"type":["number"],"default":0},"y":{"type":["numbr"],"default":0},"font":{"type":["string"]},"textAlign":{"type":["string"],"default":"'left'"},"textVerticalAlign":{"type":["string"]},"fill":{"type":["string"],"default":"'#000'"},"stroke":{"type":["string"],"default":null},"lineWidth":{"type":["number"],"default":0},"shadowBlur":{"type":["number"],"default":"undefined"},"shadowOffsetX":{"type":["number"],"default":"undefined"},"shadowOffsetY":{"type":["number"],"default":"undefined"},"shadowColor":{"type":["number"],"default":"undefined"}}},"onclick":{"type":["Function"]},"onmouseover":{"type":["Function"]},"onmouseout":{"type":["Function"]},"onmousemove":{"type":["Function"]},"onmousewheel":{"type":["Function"]},"onmousedown":{"type":["Function"]},"onmouseup":{"type":["Function"]},"ondrag":{"type":["Function"]},"ondragstart":{"type":["Function"]},"ondragend":{"type":["Function"]},"ondragenter":{"type":["Function"]},"ondragleave":{"type":["Function"]},"ondragover":{"type":["Function"]},"ondrop":{"type":["Function"]}}},{"type":["Object"],"description":"<p>Rectangle element.</p>\n","properties":{"type":{"type":["string"],"default":"rect"},"id":{"type":["string"],"default":"undefined"},"$action":{"type":["string"],"default":"'merge'"},"left":{"type":["number","string"],"default":"undefined"},"right":{"type":["number","string"],"default":"undefined"},"top":{"type":["number","string"],"default":"undefined"},"bottom":{"type":["number","string"],"default":"undefined"},"bounding":{"type":["strin"],"default":"'all'"},"z":{"type":["number"],"default":0},"zlevel":{"type":["number"],"default":0},"silent":{"type":["boolean"],"default":false},"invisible":{"type":["boolean"],"default":false},"cursor":{"type":["string"],"default":"'pointer'"},"draggable":{"type":["boolean"],"default":false},"progressive":{"type":["boolean"],"default":false},"shape":{"type":["Object"],"description":"","properties":{"x":{"type":["number"],"default":0},"y":{"type":["numbr"],"default":0},"width":{"type":["number"],"default":0},"height":{"type":["numbr"],"default":0}}},"style":{"type":["Object"],"description":"","properties":{"fill":{"type":["string"],"default":"'#000'"},"stroke":{"type":["string"],"default":null},"lineWidth":{"type":["number"],"default":0},"shadowBlur":{"type":["number"],"default":"undefined"},"shadowOffsetX":{"type":["number"],"default":"undefined"},"shadowOffsetY":{"type":["number"],"default":"undefined"},"shadowColor":{"type":["number"],"default":"undefined"}}},"onclick":{"type":["Function"]},"onmouseover":{"type":["Function"]},"onmouseout":{"type":["Function"]},"onmousemove":{"type":["Function"]},"onmousewheel":{"type":["Function"]},"onmousedown":{"type":["Function"]},"onmouseup":{"type":["Function"]},"ondrag":{"type":["Function"]},"ondragstart":{"type":["Function"]},"ondragend":{"type":["Function"]},"ondragenter":{"type":["Function"]},"ondragleave":{"type":["Function"]},"ondragover":{"type":["Function"]},"ondrop":{"type":["Function"]}}},{"type":["Object"],"description":"<p>Circle element.</p>\n","properties":{"type":{"type":["string"],"default":"circle"},"id":{"type":["string"],"default":"undefined"},"$action":{"type":["string"],"default":"'merge'"},"left":{"type":["number","string"],"default":"undefined"},"right":{"type":["number","string"],"default":"undefined"},"top":{"type":["number","string"],"default":"undefined"},"bottom":{"type":["number","string"],"default":"undefined"},"bounding":{"type":["strin"],"default":"'all'"},"z":{"type":["number"],"default":0},"zlevel":{"type":["number"],"default":0},"silent":{"type":["boolean"],"default":false},"invisible":{"type":["boolean"],"default":false},"cursor":{"type":["string"],"default":"'pointer'"},"draggable":{"type":["boolean"],"default":false},"progressive":{"type":["boolean"],"default":false},"shape":{"type":["Object"],"description":"","properties":{"cx":{"type":["number"],"default":0},"cy":{"type":["numbr"],"default":0},"r":{"type":["number"],"default":0}}},"style":{"type":["Object"],"description":"","properties":{"fill":{"type":["string"],"default":"'#000'"},"stroke":{"type":["string"],"default":null},"lineWidth":{"type":["number"],"default":0},"shadowBlur":{"type":["number"],"default":"undefined"},"shadowOffsetX":{"type":["number"],"default":"undefined"},"shadowOffsetY":{"type":["number"],"default":"undefined"},"shadowColor":{"type":["number"],"default":"undefined"}}},"onclick":{"type":["Function"]},"onmouseover":{"type":["Function"]},"onmouseout":{"type":["Function"]},"onmousemove":{"type":["Function"]},"onmousewheel":{"type":["Function"]},"onmousedown":{"type":["Function"]},"onmouseup":{"type":["Function"]},"ondrag":{"type":["Function"]},"ondragstart":{"type":["Function"]},"ondragend":{"type":["Function"]},"ondragenter":{"type":["Function"]},"ondragleave":{"type":["Function"]},"ondragover":{"type":["Function"]},"ondrop":{"type":["Function"]}}},{"type":["Object"],"description":"<p>Ring element.</p>\n","properties":{"type":{"type":["string"],"default":"ring"},"id":{"type":["string"],"default":"undefined"},"$action":{"type":["string"],"default":"'merge'"},"left":{"type":["number","string"],"default":"undefined"},"right":{"type":["number","string"],"default":"undefined"},"top":{"type":["number","string"],"default":"undefined"},"bottom":{"type":["number","string"],"default":"undefined"},"bounding":{"type":["strin"],"default":"'all'"},"z":{"type":["number"],"default":0},"zlevel":{"type":["number"],"default":0},"silent":{"type":["boolean"],"default":false},"invisible":{"type":["boolean"],"default":false},"cursor":{"type":["string"],"default":"'pointer'"},"draggable":{"type":["boolean"],"default":false},"progressive":{"type":["boolean"],"default":false},"shape":{"type":["Object"],"description":"","properties":{"cx":{"type":["number"],"default":0},"cy":{"type":["numbr"],"default":0},"r":{"type":["number"],"default":0},"r0":{"type":["number"],"default":0}}},"style":{"type":["Object"],"description":"","properties":{"fill":{"type":["string"],"default":"'#000'"},"stroke":{"type":["string"],"default":null},"lineWidth":{"type":["number"],"default":0},"shadowBlur":{"type":["number"],"default":"undefined"},"shadowOffsetX":{"type":["number"],"default":"undefined"},"shadowOffsetY":{"type":["number"],"default":"undefined"},"shadowColor":{"type":["number"],"default":"undefined"}}},"onclick":{"type":["Function"]},"onmouseover":{"type":["Function"]},"onmouseout":{"type":["Function"]},"onmousemove":{"type":["Function"]},"onmousewheel":{"type":["Function"]},"onmousedown":{"type":["Function"]},"onmouseup":{"type":["Function"]},"ondrag":{"type":["Function"]},"ondragstart":{"type":["Function"]},"ondragend":{"type":["Function"]},"ondragenter":{"type":["Function"]},"ondragleave":{"type":["Function"]},"ondragover":{"type":["Function"]},"ondrop":{"type":["Function"]}}},{"type":["Object"],"description":"<p>Sector element.</p>\n","properties":{"type":{"type":["string"],"default":"sector"},"id":{"type":["string"],"default":"undefined"},"$action":{"type":["string"],"default":"'merge'"},"left":{"type":["number","string"],"default":"undefined"},"right":{"type":["number","string"],"default":"undefined"},"top":{"type":["number","string"],"default":"undefined"},"bottom":{"type":["number","string"],"default":"undefined"},"bounding":{"type":["strin"],"default":"'all'"},"z":{"type":["number"],"default":0},"zlevel":{"type":["number"],"default":0},"silent":{"type":["boolean"],"default":false},"invisible":{"type":["boolean"],"default":false},"cursor":{"type":["string"],"default":"'pointer'"},"draggable":{"type":["boolean"],"default":false},"progressive":{"type":["boolean"],"default":false},"shape":{"type":["Object"],"description":"","properties":{"cx":{"type":["number"],"default":0},"cy":{"type":["numbr"],"default":0},"r":{"type":["number"],"default":0},"r0":{"type":["number"],"default":0},"startAngle":{"type":["number"],"default":0},"endAngle":{"type":["number"],"default":"Math.PI * 2"},"clockwise":{"type":["boolean"],"default":true}}},"style":{"type":["Object"],"description":"","properties":{"fill":{"type":["string"],"default":"'#000'"},"stroke":{"type":["string"],"default":null},"lineWidth":{"type":["number"],"default":0},"shadowBlur":{"type":["number"],"default":"undefined"},"shadowOffsetX":{"type":["number"],"default":"undefined"},"shadowOffsetY":{"type":["number"],"default":"undefined"},"shadowColor":{"type":["number"],"default":"undefined"}}},"onclick":{"type":["Function"]},"onmouseover":{"type":["Function"]},"onmouseout":{"type":["Function"]},"onmousemove":{"type":["Function"]},"onmousewheel":{"type":["Function"]},"onmousedown":{"type":["Function"]},"onmouseup":{"type":["Function"]},"ondrag":{"type":["Function"]},"ondragstart":{"type":["Function"]},"ondragend":{"type":["Function"]},"ondragenter":{"type":["Function"]},"ondragleave":{"type":["Function"]},"ondragover":{"type":["Function"]},"ondrop":{"type":["Function"]}}},{"type":["Object"],"description":"<p>Arc element.</p>\n","properties":{"type":{"type":["string"],"default":"arc"},"id":{"type":["string"],"default":"undefined"},"$action":{"type":["string"],"default":"'merge'"},"left":{"type":["number","string"],"default":"undefined"},"right":{"type":["number","string"],"default":"undefined"},"top":{"type":["number","string"],"default":"undefined"},"bottom":{"type":["number","string"],"default":"undefined"},"bounding":{"type":["strin"],"default":"'all'"},"z":{"type":["number"],"default":0},"zlevel":{"type":["number"],"default":0},"silent":{"type":["boolean"],"default":false},"invisible":{"type":["boolean"],"default":false},"cursor":{"type":["string"],"default":"'pointer'"},"draggable":{"type":["boolean"],"default":false},"progressive":{"type":["boolean"],"default":false},"shape":{"type":["Object"],"description":"","properties":{"cx":{"type":["number"],"default":0},"cy":{"type":["numbr"],"default":0},"r":{"type":["number"],"default":0},"r0":{"type":["number"],"default":0},"startAngle":{"type":["number"],"default":0},"endAngle":{"type":["number"],"default":"Math.PI * 2"},"clockwise":{"type":["boolean"],"default":true}}},"style":{"type":["Object"],"description":"","properties":{"fill":{"type":["string"],"default":null},"stroke":{"type":["string"],"default":"\"#000\""},"lineWidth":{"type":["number"],"default":1},"shadowBlur":{"type":["number"],"default":"undefined"},"shadowOffsetX":{"type":["number"],"default":"undefined"},"shadowOffsetY":{"type":["number"],"default":"undefined"},"shadowColor":{"type":["number"],"default":"undefined"}}},"onclick":{"type":["Function"]},"onmouseover":{"type":["Function"]},"onmouseout":{"type":["Function"]},"onmousemove":{"type":["Function"]},"onmousewheel":{"type":["Function"]},"onmousedown":{"type":["Function"]},"onmouseup":{"type":["Function"]},"ondrag":{"type":["Function"]},"ondragstart":{"type":["Function"]},"ondragend":{"type":["Function"]},"ondragenter":{"type":["Function"]},"ondragleave":{"type":["Function"]},"ondragover":{"type":["Function"]},"ondrop":{"type":["Function"]}}},{"type":["Object"],"description":"<p>Polygon element.</p>\n","properties":{"type":{"type":["string"],"default":"polygon"},"id":{"type":["string"],"default":"undefined"},"$action":{"type":["string"],"default":"'merge'"},"left":{"type":["number","string"],"default":"undefined"},"right":{"type":["number","string"],"default":"undefined"},"top":{"type":["number","string"],"default":"undefined"},"bottom":{"type":["number","string"],"default":"undefined"},"bounding":{"type":["strin"],"default":"'all'"},"z":{"type":["number"],"default":0},"zlevel":{"type":["number"],"default":0},"silent":{"type":["boolean"],"default":false},"invisible":{"type":["boolean"],"default":false},"cursor":{"type":["string"],"default":"'pointer'"},"draggable":{"type":["boolean"],"default":false},"progressive":{"type":["boolean"],"default":false},"shape":{"type":["Object"],"description":"","properties":{"points":{"type":["Array"]},"smooth":{"type":["number","string"],"default":"undefined"},"smoothConstraint":{"type":["boolean"],"default":false}}},"style":{"type":["Object"],"description":"","properties":{"fill":{"type":["string"],"default":"'#000'"},"stroke":{"type":["string"],"default":null},"lineWidth":{"type":["number"],"default":0},"shadowBlur":{"type":["number"],"default":"undefined"},"shadowOffsetX":{"type":["number"],"default":"undefined"},"shadowOffsetY":{"type":["number"],"default":"undefined"},"shadowColor":{"type":["number"],"default":"undefined"}}},"onclick":{"type":["Function"]},"onmouseover":{"type":["Function"]},"onmouseout":{"type":["Function"]},"onmousemove":{"type":["Function"]},"onmousewheel":{"type":["Function"]},"onmousedown":{"type":["Function"]},"onmouseup":{"type":["Function"]},"ondrag":{"type":["Function"]},"ondragstart":{"type":["Function"]},"ondragend":{"type":["Function"]},"ondragenter":{"type":["Function"]},"ondragleave":{"type":["Function"]},"ondragover":{"type":["Function"]},"ondrop":{"type":["Function"]}}},{"type":["Object"],"description":"<p>Polyline element.</p>\n","properties":{"type":{"type":["string"],"default":"polyline"},"id":{"type":["string"],"default":"undefined"},"$action":{"type":["string"],"default":"'merge'"},"left":{"type":["number","string"],"default":"undefined"},"right":{"type":["number","string"],"default":"undefined"},"top":{"type":["number","string"],"default":"undefined"},"bottom":{"type":["number","string"],"default":"undefined"},"bounding":{"type":["strin"],"default":"'all'"},"z":{"type":["number"],"default":0},"zlevel":{"type":["number"],"default":0},"silent":{"type":["boolean"],"default":false},"invisible":{"type":["boolean"],"default":false},"cursor":{"type":["string"],"default":"'pointer'"},"draggable":{"type":["boolean"],"default":false},"progressive":{"type":["boolean"],"default":false},"shape":{"type":["Object"],"description":"","properties":{"points":{"type":["Array"]},"smooth":{"type":["number","string"],"default":"undefined"},"smoothConstraint":{"type":["boolean"],"default":false}}},"style":{"type":["Object"],"description":"","properties":{"fill":{"type":["string"],"default":null},"stroke":{"type":["string"],"default":"\"#000\""},"lineWidth":{"type":["number"],"default":5},"shadowBlur":{"type":["number"],"default":"undefined"},"shadowOffsetX":{"type":["number"],"default":"undefined"},"shadowOffsetY":{"type":["number"],"default":"undefined"},"shadowColor":{"type":["number"],"default":"undefined"}}},"onclick":{"type":["Function"]},"onmouseover":{"type":["Function"]},"onmouseout":{"type":["Function"]},"onmousemove":{"type":["Function"]},"onmousewheel":{"type":["Function"]},"onmousedown":{"type":["Function"]},"onmouseup":{"type":["Function"]},"ondrag":{"type":["Function"]},"ondragstart":{"type":["Function"]},"ondragend":{"type":["Function"]},"ondragenter":{"type":["Function"]},"ondragleave":{"type":["Function"]},"ondragover":{"type":["Function"]},"ondrop":{"type":["Function"]}}},{"type":["Object"],"description":"<p>Line element.</p>\n","properties":{"type":{"type":["string"],"default":"line"},"id":{"type":["string"],"default":"undefined"},"$action":{"type":["string"],"default":"'merge'"},"left":{"type":["number","string"],"default":"undefined"},"right":{"type":["number","string"],"default":"undefined"},"top":{"type":["number","string"],"default":"undefined"},"bottom":{"type":["number","string"],"default":"undefined"},"bounding":{"type":["strin"],"default":"'all'"},"z":{"type":["number"],"default":0},"zlevel":{"type":["number"],"default":0},"silent":{"type":["boolean"],"default":false},"invisible":{"type":["boolean"],"default":false},"cursor":{"type":["string"],"default":"'pointer'"},"draggable":{"type":["boolean"],"default":false},"progressive":{"type":["boolean"],"default":false},"shape":{"type":["Object"],"description":"","properties":{"x1":{"type":["number"],"default":0},"y1":{"type":["number"],"default":0},"x2":{"type":["number"],"default":0},"y2":{"type":["number"],"default":0},"percent":{"type":["number"],"default":1}}},"style":{"type":["Object"],"description":"","properties":{"fill":{"type":["string"],"default":null},"stroke":{"type":["string"],"default":"\"#000\""},"lineWidth":{"type":["number"],"default":5},"shadowBlur":{"type":["number"],"default":"undefined"},"shadowOffsetX":{"type":["number"],"default":"undefined"},"shadowOffsetY":{"type":["number"],"default":"undefined"},"shadowColor":{"type":["number"],"default":"undefined"}}},"onclick":{"type":["Function"]},"onmouseover":{"type":["Function"]},"onmouseout":{"type":["Function"]},"onmousemove":{"type":["Function"]},"onmousewheel":{"type":["Function"]},"onmousedown":{"type":["Function"]},"onmouseup":{"type":["Function"]},"ondrag":{"type":["Function"]},"ondragstart":{"type":["Function"]},"ondragend":{"type":["Function"]},"ondragenter":{"type":["Function"]},"ondragleave":{"type":["Function"]},"ondragover":{"type":["Function"]},"ondrop":{"type":["Function"]}}},{"type":["Object"],"description":"<p>Quadratic bezier curve or cubic bezier curve.</p>\n","properties":{"type":{"type":["string"],"default":"bezierCurve"},"id":{"type":["string"],"default":"undefined"},"$action":{"type":["string"],"default":"'merge'"},"left":{"type":["number","string"],"default":"undefined"},"right":{"type":["number","string"],"default":"undefined"},"top":{"type":["number","string"],"default":"undefined"},"bottom":{"type":["number","string"],"default":"undefined"},"bounding":{"type":["strin"],"default":"'all'"},"z":{"type":["number"],"default":0},"zlevel":{"type":["number"],"default":0},"silent":{"type":["boolean"],"default":false},"invisible":{"type":["boolean"],"default":false},"cursor":{"type":["string"],"default":"'pointer'"},"draggable":{"type":["boolean"],"default":false},"progressive":{"type":["boolean"],"default":false},"shape":{"type":["Object"],"description":"","properties":{"x1":{"type":["number"],"default":0},"y1":{"type":["number"],"default":0},"x2":{"type":["number"],"default":0},"y2":{"type":["number"],"default":0},"cpx1":{"type":["number"],"default":0},"cpy1":{"type":["number"],"default":0},"cpx2":{"type":["number"],"default":null},"cpy2":{"type":["number"],"default":null},"percent":{"type":["number"],"default":1}}},"style":{"type":["Object"],"description":"","properties":{"fill":{"type":["string"],"default":"'#000'"},"stroke":{"type":["string"],"default":null},"lineWidth":{"type":["number"],"default":0},"shadowBlur":{"type":["number"],"default":"undefined"},"shadowOffsetX":{"type":["number"],"default":"undefined"},"shadowOffsetY":{"type":["number"],"default":"undefined"},"shadowColor":{"type":["number"],"default":"undefined"}}},"onclick":{"type":["Function"]},"onmouseover":{"type":["Function"]},"onmouseout":{"type":["Function"]},"onmousemove":{"type":["Function"]},"onmousewheel":{"type":["Function"]},"onmousedown":{"type":["Function"]},"onmouseup":{"type":["Function"]},"ondrag":{"type":["Function"]},"ondragstart":{"type":["Function"]},"ondragend":{"type":["Function"]},"ondragenter":{"type":["Function"]},"ondragleave":{"type":["Function"]},"ondragover":{"type":["Function"]},"ondrop":{"type":["Function"]}}}]},"description":"<p>A list of all graphic elements.</p>\n<p>Note, the standard configuration of graphic component is:</p>\n<pre><code class=\"lang-javascript\">{\n    graphic: {\n        elements: [\n            {type: &#39;rect&#39;, ...}, {type: &#39;circle&#39;, ...}, ...\n        ]\n    }\n}\n</code></pre>\n<p>But we always use short patterns for convenience:</p>\n<pre><code class=\"lang-javascript\">{\n    graphic: { // Declare only one graphic element.\n        type: &#39;rect&#39;,\n        ...\n    }\n}\n</code></pre>\n<p>Or:</p>\n<pre><code class=\"lang-javascript\">{\n    graphic: [ // Declare multiple graphic elements.\n        {type: &#39;rect&#39;, ...}, {type: &#39;circle&#39;, ...}, ...\n    ]\n}\n</code></pre>\n"}}},"calendar":{"type":["Object"],"description":"<p>Calendar coordinates.</p>\n<p>In ECharts, we are very creative to achieve the calendar chart, by using the calendar coordinates to achieve the calendar chart,\nas shown in the following example, we can use calendar coordinates in heatmap, scatter, effectScatter, and graph.</p>\n<p>Example of using heatmap in calendar coordinates:</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=calendar-heatmap&edit=1&reset=1\" width=\"800\" height=\"400\" ></iframe>\n\n\n<p>Example of using effectScatter in calendar coordinates:</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=calendar-effectscatter&edit=1&reset=1\" width=\"800\" height=\"600\" ></iframe>\n\n\n<p>Example of using graph in calendar coordinates:</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=calendar-graph&edit=1&reset=1\" width=\"600\" height=\"600\" ></iframe>\n\n\n<p>Combination calendar coordinate system and charts, you may be able to create more wonderful effects.</p>\n<p><a href=\"http://echarts.baidu.com/gallery/editor.html?c=calendar-lunar&amp;edit=1&amp;reset=1\" target=\"_blank\">Display Text in Calendar</a>,\n<a href=\"http://echarts.baidu.com/gallery/editor.html?c=calendar-pie&amp;edit=1&amp;reset=1\" target=\"_blank\">Display Pies in Calendar</a></p>\n<hr>\n<p><strong>Calendar layout</strong></p>\n<p>Calendar coordinate system can be placed horizontally or vertically. By convention, the heatmap calendar is horizontal. But if we need bigger cell size in other cases, the total width may be too wide. So <a href=\"#calendar.orient\">calendar.orient</a> can help in this case.</p>\n<hr>\n<p><strong>Adapt to container size</strong></p>\n<p>Calendar coordinate system can be configured to adapt to container size, which is useful when page size is not sure. First of all, like other components, those location and size configurations can be specified on canlendar: <a href=\"#calendar.left\">left</a> <a href=\"#calendar.right\">right</a> <a href=\"#calendar.top\">top</a> <a href=\"bottom\" target=\"_blank\">bottom</a> <a href=\"#calendar.width\">width</a> <a href=\"#calendar.height\">height</a>, which make calendar possible to modify its size according to container size. Besides, <a href=\"#calendar.cellSize\">cellSize</a> can be specified to fix the size of each cell of calendar.</p>\n<hr>\n","properties":{"id":{"type":["string"]},"zlevel":{"type":["number"],"default":0},"z":{"type":["number"],"default":2},"left":{"type":["string","number"],"default":80},"top":{"type":["string","number"],"default":60},"right":{"type":["string","number"],"default":"'auto'"},"bottom":{"type":["string","number"],"default":"'auto'"},"width":{"type":["number","string"],"default":"auto"},"height":{"type":["number","string"],"default":"auto"},"range":{"type":["number","string","Array"]},"cellSize":{"type":["number","Array"],"default":20},"orient":{"type":["string"],"default":"'horizontal'"},"splitLine":{"type":["Object"],"description":"<p>Calendar coordinates splitLine style.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"lineStyle":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"#000"},"width":{"type":["number"],"default":1},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"itemStyle":{"type":["Object"],"description":"<p>Every rect style in calendar coordinates.</p>\n","properties":{"color":{"type":["Color"],"default":"#fff"},"borderColor":{"type":["Color"],"default":"'#ccc'"},"borderWidth":{"type":["number"],"default":1},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}},"dayLabel":{"type":["Object"],"description":"<p>Day style in calendar coordinates.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"firstDay":{"type":["number"],"default":0},"margin":{"type":["number"],"default":0},"position":{"type":["string"],"default":"'start'"},"nameMap":{"type":["string","Array"],"default":"'en'"},"color":{"type":["Color"],"default":"#000"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}},"monthLabel":{"type":["Object"],"description":"<p>Month label in calendar coordinates.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"align":{"type":["string"]},"margin":{"type":["number"],"default":5},"position":{"type":["string"],"default":"'start'"},"nameMap":{"type":["string","Array"],"default":"'en'"},"formatter":{"type":["string","Function"],"default":null},"color":{"type":["Color"],"default":"#000"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}},"yearLabel":{"type":["Object"],"description":"<p>Year label in calendar coordinates.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"margin":{"type":["number"],"default":30},"position":{"type":["string"]},"formatter":{"type":["string","Function"],"default":null},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}},"silent":{"type":["boolean"],"default":false}}},"dataset":{"type":["Object"],"description":"<p><code>dataset</code> component is published since ECharts 4. <code>dataset</code> brings convenience in data management separated with styles and enables data reuse by different series. More importantly, is enables data encoding from data to visual, which brings convenience in some scenarios.</p>\n<p>More details about <code>dataset</code> can be checked in the <a href=\"https://ecomfe.github.io/echarts-doc/public/en/tutorial.html#dataset\" target=\"_blank\">tutorial</a>.</p>\n<hr>\n","properties":{"id":{"type":["string"]},"source":{"type":["Array","Object"]},"dimensions":{"type":["Array"]},"sourceHeader":{"type":["boolean"]}}},"aria":{"type":["*"],"description":"<p>W3C defined the Accessible Rich Internet Applications Suite (<a href=\"https://www.w3.org/WAI/intro/aria\" target=\"_blank\">WAI-ARIA</a>) to make Web content and Web applications more accessible to the disabled. From ECharts 4.0, we support ARIA by generating description for charts automatically.</p>\n<p>By default, ARIA is disabled. To enable it, you should set <a href=\"#aria.show\">aria.show</a> to be <code>true</code>. After enabling, it will generate descriptions based on charts, series, data, and so on. Users may change the generated description.</p>\n<p><strong>For example:</strong></p>\n<p>For config:</p>\n<pre><code class=\"lang-js\">option = {\n    aria: {\n        show: true\n    },\n    title: {\n        text: &#39;某站点用户访问来源&#39;,\n        x: &#39;center&#39;\n    },\n    series: [\n        {\n            name: &#39;访问来源&#39;,\n            type: &#39;pie&#39;,\n            data: [\n                { value: 335, name: &#39;直接访问&#39; },\n                { value: 310, name: &#39;邮件营销&#39; },\n                { value: 234, name: &#39;联盟广告&#39; },\n                { value: 135, name: &#39;视频广告&#39; },\n                { value: 1548, name: &#39;搜索引擎&#39; }\n            ]\n        }\n    ]\n};\n</code></pre>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=doc-example/aria-pie&edit=1&reset=1\" width=\"700\" height=\"300\" ></iframe>\n\n\n<p>There should be an <code>aria-label</code> attribute on the chart DOM, which can help the disabled understand the content of charts with the help of certain devices. The value of the label is:</p>\n<pre><code>这是一个关于“某站点用户访问来源”的图表。图表类型是饼图，表示访问来源。其数据是——直接访问的数据是335，邮件营销的数据是310，联盟广告的数据是234，视频广告的数据是135，搜索引擎的数据是1548。\n</code></pre><p>The default language is in Chinese, but you can configure it with templates. The following document shows how to do it.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"description":{"type":["string"],"default":null},"general":{"type":["Object"],"description":"<p>General discription of chart.</p>\n","properties":{"withTitle":{"type":["string"],"default":"'这是一个关于“{title}”的图表。'"},"withoutTitle":{"type":["string"],"default":"'这是一个图表，'"}}},"series":{"type":["Object"],"description":"<p>Series-related configures.</p>\n","properties":{"maxCount":{"type":["number"],"default":10},"single":{"type":["Object"],"description":"<p>Description used when there is only one chart.</p>\n","properties":{"prefix":{"type":["string"],"default":"''"},"withName":{"type":["string"],"default":"'图表类型是{seriesType}，表示{seriesName}。'"},"withoutName":{"type":["string"],"default":"'图表类型是{seriesType}。'"}}},"multiple":{"type":["Object"],"description":"<p>Description used when there are more than one chart.</p>\n","properties":{"prefix":{"type":["string"],"default":"'它由{seriesCount}个图表系列组成。'"},"withName":{"type":["string"],"default":"'图表类型是{seriesType}，表示{seriesName}。'"},"withoutName":{"type":["string"],"default":"'图表类型是{seriesType}。'"},"separator":{"type":["Object"],"description":"<p>Separators between series and series.</p>\n","properties":{"middle":{"type":["string"],"default":"'；'"},"end":{"type":["string"],"default":"'。'"}}}}}}},"data":{"type":["Object"],"description":"<p>Data-related configures.</p>\n","properties":{"maxCount":{"type":["number"],"default":10},"allData":{"type":["string"],"default":"'其数据是——'"},"partialData":{"type":["string"],"default":"'其中，前{displayCnt}项是——'"},"withName":{"type":["string"],"default":"'{name}的数据是{value}'"},"withoutName":{"type":["string"],"default":"'{value}'"},"separator":{"type":["Object"],"description":"<p>Separators between data and data.</p>\n","properties":{"middle":{"type":["string"],"default":"'，'"},"end":{"type":["string"],"default":"''"}}}}}}},"series":{"type":"Array","items":{"anyOf":[{"type":["Object"],"description":"<p><strong>broken line chart</strong></p>\n<p>Broken line chart relates all the data points <a href=\"#series-line.symbol\">symbol</a> by broken lines, which is used to show the trend of data changing. It could be used in both <a href=\"#grid\">rectangular coordinate</a> and<a href=\"#polar\">polar coordinate</a>.</p>\n<p><strong>Tip:</strong> When <a href=\"#series-line.areaStyle\">areaStyle</a> is set, area chart will be drew.</p>\n<p><strong>Tip:</strong> With <a href=\"#visualMap-piecewise\">visualMap</a> component, Broken line / area chart can have different colors on different sections, as below:</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=line-aqi&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n","properties":{"type":{"type":["string"],"default":"'line'"},"id":{"type":["string"]},"name":{"type":["string"]},"coordinateSystem":{"type":["string"],"default":"'cartesian2d'"},"xAxisIndex":{"type":["number"],"default":0},"yAxisIndex":{"type":["number"],"default":0},"polarIndex":{"type":["number"],"default":0},"symbol":{"type":["string"],"default":"'circle'"},"symbolSize":{"type":["number","Array","Function"],"default":4},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"showSymbol":{"type":["boolean"],"default":true},"showAllSymbol":{"type":["boolean"],"default":false},"hoverAnimation":{"type":["boolean"],"default":true},"legendHoverLink":{"type":["boolean"],"default":true},"stack":{"type":["string"],"default":null},"cursor":{"type":["string"],"default":"'pointer'"},"clipOverflow":{"type":["boolean"],"default":true},"connectNulls":{"type":["boolean"],"default":false},"step":{"type":["string","boolean"],"default":false},"label":{"type":["Object"],"description":"<p>Text label of , to explain some data information about graphic item like value, name and so on. <code>label</code> is placed under <code>itemStyle</code> in ECharts 2.x. In ECharts 3, to make the configuration structure flatter, <code>label</code>is taken to be at the same level with <code>itemStyle</code>, and has <code>emphasis</code> as <code>itemStyle</code> does.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"'top'"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>The style of the symbol point of broken line.</p>\n","properties":{"color":{"type":["Color","Function"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"lineStyle":{"type":["Object"],"description":"<p>Line style.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"areaStyle":{"type":["Object"],"description":"<p>The style of area.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"origin":{"type":["string"],"default":"'auto'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}},"smooth":{"type":["boolean","number"],"default":false},"smoothMonotone":{"type":["string"]},"sampling":{"type":["string"]},"dimensions":{"type":["Array"]},"encode":{"type":["Object"]},"seriesLayoutBy":{"type":["string"],"default":"'column'"},"datasetIndex":{"type":["number"],"default":0},"data":{"type":["Array"],"description":"<p>Data array of series, which can be in the following forms:</p>\n<p>Notice, if no <code>data</code> specified in series, and there is <a href=\"#dataset\">dataset</a> in option, series will use the first <a href=\"#dataset\">dataset</a> as its datasource. If <code>data</code> has been specified, <a href=\"#dataset\">dataset</a> will not used.</p>\n<p><code>series.datasetIndex</code> can be used to specify other <a href=\"#dataset\">dataset</a>.</p>\n<p>Basically, data is represented by a two-dimension array, like the example below, where each colum is named as a &quot;dimension&quot;.</p>\n<pre><code class=\"lang-js\">series: [{\n    data: [\n        // dimX   dimY   other dimensions ...\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>In <a href=\"#grid\">cartesian (grid)</a>, &quot;dimX&quot; and &quot;dimY&quot; correspond to <a href=\"#xAxis\">xAxis</a> and <a href=\"#yAxis\">yAxis</a> repectively.</li>\n<li>In <a href=\"#polar\">polar</a> &quot;dimX&quot; and &quot;dimY&quot; correspond to <a href=\"#radiusAxis\">radiusAxis</a> 和 <a href=\"#anbleAxis\">angleAxis</a> repectively.</li>\n<li>Other dimensions are optional, which can be used in other place. For example:<ul>\n<li><a href=\"#visualMap\">visualMap</a> can map one or more dimensions to viusal (color, symbol size ...).</li>\n<li><a href=\"#series.symbolSize\">series.symbolSize</a> can be set as a callback function, where symbol size can be calculated by values of a certain dimension.</li>\n<li>Values in other dimensions can be shown by <a href=\"#tooltip.formatter\">tooltip.formatter</a> or <a href=\"#series.label.formatter\">series.label.formatter</a>.</li>\n</ul>\n</li>\n</ul>\n<p>Especially, when there is one and only one category axis (axis.type is <code>&#39;category&#39;</code>), data can be simply be represented by a one-dimension array, like:</p>\n<pre><code class=\"lang-js\">xAxis: {\n    data: [&#39;a&#39;, &#39;b&#39;, &#39;m&#39;, &#39;n&#39;]\n},\nseries: [{\n    // Each item corresponds to each item in xAxis.data.\n    data: [23,  44,  55,  19]\n    // In fact, it is the simplification of the format below:\n    // data: [[0, 23], [1, 44], [2, 55], [3, 19]]\n}]\n</code></pre>\n<p><br>\n<strong>Relationship between &quot;value&quot; and <a href=\"#xAxis.type\">axis.type</a></strong></p>\n<ul>\n<li><p>When a dimension corresponds to a value axis (axis.type is <code>&#39;value&#39;</code> or <code>&#39;log&#39;</code>):</p>\n<p>  The value can be a <code>number</code> (like <code>12</code>) (can also be a number in a <code>string</code> format, like <code>&#39;12&#39;</code>).</p>\n</li>\n<li><p>When a dimension corresponds to a category axis (axis.type is <code>&#39;category&#39;</code>):</p>\n<p>  The value should be the ordinal of the axis.data (based on <code>0</code>), the string value of the axis.data. For example:</p>\n<pre><code class=\"lang-js\">  xAxis: {\n      type: &#39;category&#39;,\n      data: [&#39;Monday&#39;, &#39;Tuesday&#39;, &#39;Wednesday&#39;, &#39;Thursday&#39;]\n  },\n  yAxis: {\n      type: &#39;category&#39;,\n      data: [&#39;a&#39;, &#39;b&#39;, &#39;m&#39;, &#39;n&#39;, &#39;p&#39;, &#39;q&#39;]\n  },\n  series: [{\n      data: [\n          // xAxis      yAxis\n          [  0,           0,    2  ], // This point is located at xAxis: &#39;Monday&#39;, yAxis: &#39;a&#39;.\n          [  &#39;Thursday&#39;,  2,    1  ], // This point is located at xAxis: &#39;Thursday&#39;, yAxis: &#39;m&#39;.\n          [  2,          &#39;p&#39;,   2  ], // This point is located at xAxis: &#39;Wednesday&#39;, yAxis: &#39;p&#39;.\n          [  3,           3,    5  ]\n      ]\n  }]\n</code></pre>\n<p>  There is an example of double category axes: <a href=\"http://echarts.baidu.com/gallery/editor.html?c=scatter-punchCard\" target=\"_blank\">Github Punchcard</a>.</p>\n</li>\n<li><p>When a dimension corresponds to a time axis (type is <code>&#39;time&#39;</code>), the value can be:</p>\n<ul>\n<li>a timestamp, like <code>1484141700832</code>, which represents a UTC time.</li>\n<li>a date string, in one of the formats below:<ul>\n<li>a subset of <a href=\"http://www.ecma-international.org/ecma-262/5.1/#sec-15.9.1.15\" target=\"_blank\">ISO 8601</a>, only including (all of these are treated as local time unless timezone is specified, which is consistent with <a href=\"https://momentjs.com/\" target=\"_blank\">moment</a>):<ul>\n<li>only part of year/month/date/time are specified: <code>&#39;2012-03&#39;</code>, <code>&#39;2012-03-01&#39;</code>, <code>&#39;2012-03-01 05&#39;</code>, <code>&#39;2012-03-01 05:06&#39;</code>.</li>\n<li>separated by <code>&quot;T&quot;</code> or a space: <code>&#39;2012-03-01T12:22:33.123&#39;</code>, <code>&#39;2012-03-01 12:22:33.123&#39;</code>.</li>\n<li>timezone specified: <code>&#39;2012-03-01T12:22:33Z&#39;</code>, <code>&#39;2012-03-01T12:22:33+8000&#39;</code>, <code>&#39;2012-03-01T12:22:33-05:00&#39;</code>.</li>\n</ul>\n</li>\n<li>other date string format (all of these are treated as local time):\n<code>&#39;2012&#39;</code>, <code>&#39;2012-3-1&#39;</code>, <code>&#39;2012/3/1&#39;</code>, <code>&#39;2012/03/01&#39;</code>,\n<code>&#39;2009/6/12 2:00&#39;</code>, <code>&#39;2009/6/12 2:05:08&#39;</code>, <code>&#39;2009/6/12 2:05:08.123&#39;</code>.</li>\n</ul>\n</li>\n<li>a JavaScript Date instance created by user:<ul>\n<li>Caution, when using a data string to create a Date instance, <a href=\"http://dygraphs.com/date-formats.html\" target=\"_blank\">browser differences and inconsistencies</a> should be considered.</li>\n<li>For example: In chrome, <code>new Date(&#39;2012-01-01&#39;)</code> is treated as a Jan 1st 2012 in UTC, while <code>new Date(&#39;2012-1-1&#39;)</code> and <code>new Date(&#39;2012/01/01&#39;)</code> are treated as Jan 1st 2012 in local timezone. In safari <code>new Date(&#39;2012-1-1&#39;)</code> is not supported.</li>\n<li>So if you intent to perform <code>new Date(dateString)</code>, it is strongly recommended to use a time parse library (e.g., <a href=\"https://momentjs.com/\" target=\"_blank\">moment</a>), or use <code>echarts.number.parseDate</code>, or check <a href=\"http://dygraphs.com/date-formats.html\" target=\"_blank\">this</a>.</li>\n</ul>\n</li>\n</ul>\n</li>\n</ul>\n<p><br>\n<strong>Customize a data item:</strong></p>\n<p>When needing to customize a data item, it can be set as an object, where property <code>value</code> reprensent real value. For example:</p>\n<pre><code class=\"lang-js\">[\n    12,\n    24,\n    {\n        value: [24, 32],\n        // label style, only works in this data item.\n        label: {},\n        // item style, only works in this data item.\n        itemStyle:{}\n    },\n    33\n]\n// Or\n[\n    [12, 332],\n    [24, 32],\n    {\n        value: [24, 32],\n        // label style, only works in this data item.\n        label: {},\n        // item style, only works in this data item.\n        itemStyle:{}\n    },\n    [33, 31]\n]\n</code></pre>\n<p><br>\n<strong>Empty value:</strong></p>\n<p><code>&#39;-&#39;</code> or <code>null</code> or <code>undefined</code> or <code>NaN</code> can be used to describe that a data item is not exists (ps：<em>not exist</em> does not means its value is <code>0</code>).</p>\n<p>For example, line chart can break when encounter an empty value, and scatter chart do not display graphic elements for empty values.</p>\n<p><br><br></p>\n","items":{"type":"Object","properties":{"name":{"type":["string"]},"value":{"type":["number"]},"symbol":{"type":["string"],"default":"'circle'"},"symbolSize":{"type":["number","Array"],"default":4},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"label":{"type":["Object"],"description":"<p>The style of the text of single data point.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"top"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>The style of the symbol of single data point.</p>\n","properties":{"color":{"type":["Color"],"default":"'auto'"},"barBorderColor":{"type":["Color"],"default":"'#000'"},"barBorderWidth":{"type":["number"],"default":0},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"'auto'"},"barBorderColor":{"type":["Color"],"default":"'#000'"},"barBorderWidth":{"type":["number"],"default":0},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"tooltip":{"type":["*"],"description":"<p>tooltip settings in this series data.</p>\n","properties":{"position":{"type":["string","Array"]},"formatter":{"type":["string","Function"]},"backgroundColor":{"type":["Color"],"default":"'rgba(50,50,50,0.7)'"},"borderColor":{"type":["Color"],"default":"'#333'"},"borderWidth":{"type":["number"],"default":0},"padding":{"type":["number"],"default":5},"textStyle":{"type":["Object"],"description":"<blockquote>\n<p><strong>Notice：</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code>&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The text syle of tooltip&#39;s floating layer.</p>\n","properties":{"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":14},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"extraCssText":{"type":["string"]}}}}}},"markPoint":{"type":["Object"],"description":"<p>Mark point in a chart.</p>\n","properties":{"symbol":{"type":["string"],"default":"'pin'"},"symbolSize":{"type":["number","Array","Function"],"default":50},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"silent":{"type":["boolean"],"default":false},"label":{"type":["Object"],"description":"<p>Label of mark point.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Mark point style.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["Array"],"description":"<p>Data array for mark points, each of which is an object. Here are some ways to assign mark point position.</p>\n<ol>\n<li><p>Assign coordinate according to container with <a href=\"#series-line.markPoint.data.x\">x</a>, <a href=\"#series-line.markPoint.data.y\">y</a> attribute, in which pixel values and percentage are supported.</p>\n</li>\n<li><p>Assign coordinate position with <a href=\"#series-line.markPoint.data.coord\">coord</a> attribute, in which <code>&#39;min&#39;</code>, <code>&#39;max&#39;</code>, <code>&#39;average&#39;</code> are supported for each dimension.</p>\n</li>\n<li><p>Use <a href=\"#series-line.markPoint.data.type\">type</a> attribute to mark the maximum and minimum values in the series, in which <a href=\"#series-line.markPoint.data.valueIndex\">valueIndex</a> or <a href=\"#series-line.markPoint.data.valueDim\">valueDim</a> can be used to assign the dimension.</p>\n</li>\n</ol>\n<p>When multiple attributes exist, priority is as the above order.</p>\n<p><strong>For example: </strong></p>\n<pre><code class=\"lang-js\">data: [\n    {\n        name: &#39;maximum&#39;,\n        type: &#39;max&#39;\n    }, \n    {\n        name: &#39;coordinate&#39;,\n        coord: [10, 20]\n    }, {\n        name: &#39;fixed x position&#39;,\n        yAixs: 10,\n        x: &#39;90%&#39;\n    }, \n    {\n        name: &#39;screen coordinate&#39;,\n        x: 100,\n        y: 100\n    }\n]\n</code></pre>\n","items":{"type":"Object","properties":{"name":{"type":["string"],"default":"''"},"type":{"type":["string"]},"valueIndex":{"type":["number"]},"valueDim":{"type":["string"]},"coord":{"type":["Array"]},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"itemStyle":{"type":["Object"],"description":"<p>Mark point style.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"markLine":{"type":["*"],"description":"<p>Use a line in the chart to illustrate.</p>\n","properties":{"silent":{"type":["boolean"],"default":false},"symbol":{"type":["string","Array"]},"symbolSize":{"type":["number","Array"]},"precision":{"type":["number"],"default":2},"label":{"type":["Object"],"description":"<p>Mark line text.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]}}}}},"lineStyle":{"type":["Object"],"description":"<p>Mark line style.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["*"],"description":"<p>Data array of marking line. Every array item can be an array of one or two values, representing starting and ending point of the line, and every item is an object. Here are several ways to assign the positions of starting and ending point.</p>\n<ol>\n<li><p>Assign coordinate according to container with <a href=\"#series-line.markLine.data.0.x\">x</a>, <a href=\"#series-line.markLine.data.0.y\">y</a> attribute, in which pixel values and percentage are supported.</p>\n</li>\n<li><p>Assign coordinate position with <a href=\"#series-line.markLine.data.0.coord\">coord</a> attribute, in which <code>&#39;min&#39;</code>, <code>&#39;max&#39;</code>, <code>&#39;average&#39;</code> are supported for each dimension.</p>\n</li>\n<li><p>Use <a href=\"#series-line.markLine.data.0.type\">type</a> attribute to mark the maximum and minimum values in the series, in which <a href=\"#series-line.markLine.data.0.valueIndex\">valueIndex</a> or <a href=\"#series-line.markLine.data.0.valueDim\">valueDim</a> can be used to assign the dimension.</p>\n</li>\n<li><p>You may also create a mark line in Cartesian coordinate at a specific position in X or Y axis by assigning <code>xAxis</code> or <code>yAxis</code>. See <a href=\"http://echarts.baidu.com/gallery/editor.html?c=scatter-weight\" target=\"_blank\">scatter-weight</a> for example.</p>\n</li>\n</ol>\n<p>When multiple attributes exist, priority is as the above order.</p>\n<p>You may also set the type of mark line through <code>type</code>, stating whether it is for the maximum value or average value. Likewise, dimensions can be assigned through <code>valueIndex</code>.</p>\n<pre><code>data: [\n    {\n        name: &#39;average line&#39;,\n        // &#39;average&#39;, &#39;min&#39;, and &#39;max&#39; are supported\n        type: &#39;average&#39;\n    },\n    {\n        name: &#39;Horizontal line with Y value at 100&#39;,\n        yAxis: 100\n    },\n    [\n        {\n            // Use the same name with starting and ending point\n            name: &#39;Minimum to Maximum&#39;,\n            type: &#39;min&#39;\n        },\n        {\n            type: &#39;max&#39;\n        }\n    ],\n    [\n        {\n            name: &#39;Markline between two points&#39;,\n            coord: [10, 20]\n        },\n        {\n            coord: [20, 30]\n        }\n    ], [{\n        // Mark line with a fixed X position in starting point. This is used to generate an arrow pointing to maximum line.\n        yAxis: &#39;max&#39;,\n        x: &#39;90%&#39;\n    }, {\n        type: &#39;max&#39;\n    }],\n    [\n        {\n            name: &#39;Mark line between two points&#39;,\n            x: 100,\n            y: 100\n        },\n        {\n            x: 500,\n            y: 200\n        }\n    ]\n]\n</code></pre>","properties":{"0":{"type":["Object"],"description":"<p>Data of the starting point.</p>\n","properties":{"type":{"type":["string"]},"valueIndex":{"type":["number"]},"valueDim":{"type":["string"]},"coord":{"type":["Array"]},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"lineStyle":{"type":["Object"],"description":"<p>Line style of this data item, which will be merged with <code>lineStyle</code> of starting point and ending point.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0}}}}},"label":{"type":["Object"],"description":"<p>Label of this data item, which will be merged with <code>label</code> of starting point and ending point.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]}}}}}}},"1":{"type":["Object"],"description":"<p>Data of the ending point.</p>\n","properties":{"type":{"type":["string"]},"valueIndex":{"type":["number"]},"valueDim":{"type":["string"]},"coord":{"type":["Array"]},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"lineStyle":{"type":["Object"],"description":"<p>Line style of this data item, which will be merged with <code>lineStyle</code> of starting point and ending point.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0}}}}},"label":{"type":["Object"],"description":"<p>Label of this data item, which will be merged with <code>label</code> of starting point and ending point.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]}}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"markArea":{"type":["Object"],"description":"<p>Used to mark an area in chart. For example, mark a time interval.</p>\n","properties":{"silent":{"type":["boolean"],"default":false},"label":{"type":["Object"],"description":"<p>Label in mark area.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Style of the mark area.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["*"],"description":"<p>The scope of the area is defined by <code>data</code>, which is an array with two item, representing the left-top point and the right-bottom point of rectangle area. Each item can be defined as follows:</p>\n<ol>\n<li><p>Specify the coordinate in screen coordinate system using <a href=\"#series-line.markArea.data.0.x\">x</a>, <a href=\"#series-line.markArea.data.0.y\">y</a>, where the unit is pixel (e.g., the value is <code>5</code>), or percent (e.g., the value is <code>&#39;35%&#39;</code>).</p>\n</li>\n<li><p>Specify the coordinate in data coordinate system (i.e., cartesian) using\n<a href=\"#series-line.markArea.data.0.coord\">coord</a>, which can be also set as <code>&#39;min&#39;</code>, <code>&#39;max&#39;</code>, <code>&#39;average&#39;</code> (e.g, <code>coord: [23, &#39;min&#39;]</code>, or <code>coord: [&#39;average&#39;, &#39;max&#39;]</code>)。</p>\n</li>\n</ol>\n<ol>\n<li>Locate the point on the min value or max value of <code>series.data</code> using <a href=\"#series-line.markArea.data.0.type\">type</a>, where <a href=\"#series-line.markArea.data.0.valueIndex\">valueIndex</a> or <a href=\"#series-line.markPoint.data.0.valueDim\">valueDim</a> can be used to specify the dimension on which the min, max or average are calculated.</li>\n<li>If in cartesian, you can only specify <code>xAxis</code> or <code>yAxis</code> to define a mark area based on only X or Y axis, see sample <a href=\"http://echarts.baidu.com/gallery/editor.html?c=scatter-weight\" target=\"_blank\">scatter-weight</a></li>\n</ol>\n<p>The priority follows as above if more than one above definition used.</p>\n<pre><code>data: [\n\n    [\n        {\n            name: &#39;From average to max&#39;,\n            type: &#39;average&#39;\n        },\n        {\n            type: &#39;max&#39;\n        }\n    ],\n\n    [\n        {\n            name: &#39;Mark area between two points in data coordiantes&#39;,\n            coord: [10, 20]\n        },\n        {\n            coord: [20, 30]\n        }\n    ], [\n        {\n            name: &#39;From 60 to 80&#39;,\n            yAxis: 60\n        },\n        {\n            yAxis: 80\n        }\n    ], [\n        {\n            name: &#39;Mark area covers all data&#39;\n            coord: [&#39;min&#39;, &#39;min&#39;]\n        },\n        {\n            coord: [&#39;max&#39;, &#39;max&#39;]\n        }\n    ],\n    [\n        {\n            name: &#39;Mark area in two screen points&#39;,\n            x: 100,\n            y: 100\n        }, {\n            x: &#39;90%&#39;,\n            y: &#39;10%&#39;\n        }\n    ]\n]\n</code></pre>","properties":{"0":{"type":["Object"],"description":"<p>Specify the left-top point.</p>\n","properties":{"type":{"type":["string"]},"valueIndex":{"type":["number"]},"valueDim":{"type":["string"]},"coord":{"type":["Array"]},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"itemStyle":{"type":["Object"],"description":"<p>Style of the item.\n<code>itemStyle</code> of start point and end point will be merged together.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"<p>Label style of the item.\nLabel style of start point and end point will be merged together.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}},"1":{"type":["Object"],"description":"<p>Specify the right-bottom point.</p>\n","properties":{"type":{"type":["string"]},"valueIndex":{"type":["number"]},"valueDim":{"type":["string"]},"coord":{"type":["Array"]},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"itemStyle":{"type":["Object"],"description":"<p>Style of the item.\n<code>itemStyle</code> of start point and end point will be merged together.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"<p>Label style of the item.\nLabel style of start point and end point will be merged together.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"zlevel":{"type":["number"],"default":0},"z":{"type":["number"],"default":2},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"linear"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0},"tooltip":{"type":["*"],"description":"<p>tooltip settings in this series.</p>\n","properties":{"position":{"type":["string","Array"]},"formatter":{"type":["string","Function"]},"backgroundColor":{"type":["Color"],"default":"'rgba(50,50,50,0.7)'"},"borderColor":{"type":["Color"],"default":"'#333'"},"borderWidth":{"type":["number"],"default":0},"padding":{"type":["number"],"default":5},"textStyle":{"type":["Object"],"description":"<p><br></p>\n<blockquote>\n<p><strong>Notice：</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code>&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The text syle of tooltip&#39;s floating layer.</p>\n","properties":{"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":14},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"extraCssText":{"type":["string"]}}}}},{"type":["Object"],"description":"<p><strong>bar chart</strong></p>\n<p>Bar chart shows different data through the height of a bar, which is used in <a href=\"#grid\">rectangular coordinate</a> with at least 1 category axis.</p>\n","properties":{"type":{"type":["string"],"default":"'bar'"},"id":{"type":["string"]},"name":{"type":["string"]},"legendHoverLink":{"type":["boolean"],"default":true},"coordinateSystem":{"type":["string"],"default":"'cartesian2d'"},"xAxisIndex":{"type":["number"],"default":0},"yAxisIndex":{"type":["number"],"default":0},"label":{"type":["Object"],"description":"<p>Text label of , to explain some data information about graphic item like value, name and so on. <code>label</code> is placed under <code>itemStyle</code> in ECharts 2.x. In ECharts 3, to make the configuration structure flatter, <code>label</code>is taken to be at the same level with <code>itemStyle</code>, and has <code>emphasis</code> as <code>itemStyle</code> does.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Graphic style of , <code>emphasis</code> is the style when it is highlighted, like being hovered by mouse, or highlighted via legend connect.</p>\n","properties":{"color":{"type":["Color"],"default":"'auto'"},"barBorderColor":{"type":["Color"],"default":"'#000'"},"barBorderWidth":{"type":["number"],"default":0},"barBorderRadius":{"type":["number","Array"],"default":0},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"'auto'"},"barBorderColor":{"type":["Color"],"default":"'#000'"},"barBorderWidth":{"type":["number"],"default":0},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"stack":{"type":["string"],"default":null},"cursor":{"type":["string"],"default":"'pointer'"},"barWidth":{"type":["number"],"default":null},"barMaxWidth":{"type":["number"],"default":null},"barMinHeight":{"type":["number"],"default":0},"barGap":{"type":["string"],"default":"30%"},"barCategoryGap":{"type":["string"],"default":"'20%'"},"dimensions":{"type":["Array"]},"encode":{"type":["Object"]},"seriesLayoutBy":{"type":["string"],"default":"'column'"},"datasetIndex":{"type":["number"],"default":0},"data":{"type":["Array"],"description":"<p>Data array of series, which can be in the following forms:</p>\n<p>Notice, if no <code>data</code> specified in series, and there is <a href=\"#dataset\">dataset</a> in option, series will use the first <a href=\"#dataset\">dataset</a> as its datasource. If <code>data</code> has been specified, <a href=\"#dataset\">dataset</a> will not used.</p>\n<p><code>series.datasetIndex</code> can be used to specify other <a href=\"#dataset\">dataset</a>.</p>\n<p>Basically, data is represented by a two-dimension array, like the example below, where each colum is named as a &quot;dimension&quot;.</p>\n<pre><code class=\"lang-js\">series: [{\n    data: [\n        // dimX   dimY   other dimensions ...\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>In <a href=\"#grid\">cartesian (grid)</a>, &quot;dimX&quot; and &quot;dimY&quot; correspond to <a href=\"#xAxis\">xAxis</a> and <a href=\"#yAxis\">yAxis</a> repectively.</li>\n<li>In <a href=\"#polar\">polar</a> &quot;dimX&quot; and &quot;dimY&quot; correspond to <a href=\"#radiusAxis\">radiusAxis</a> 和 <a href=\"#anbleAxis\">angleAxis</a> repectively.</li>\n<li>Other dimensions are optional, which can be used in other place. For example:<ul>\n<li><a href=\"#visualMap\">visualMap</a> can map one or more dimensions to viusal (color, symbol size ...).</li>\n<li><a href=\"#series.symbolSize\">series.symbolSize</a> can be set as a callback function, where symbol size can be calculated by values of a certain dimension.</li>\n<li>Values in other dimensions can be shown by <a href=\"#tooltip.formatter\">tooltip.formatter</a> or <a href=\"#series.label.formatter\">series.label.formatter</a>.</li>\n</ul>\n</li>\n</ul>\n<p>Especially, when there is one and only one category axis (axis.type is <code>&#39;category&#39;</code>), data can be simply be represented by a one-dimension array, like:</p>\n<pre><code class=\"lang-js\">xAxis: {\n    data: [&#39;a&#39;, &#39;b&#39;, &#39;m&#39;, &#39;n&#39;]\n},\nseries: [{\n    // Each item corresponds to each item in xAxis.data.\n    data: [23,  44,  55,  19]\n    // In fact, it is the simplification of the format below:\n    // data: [[0, 23], [1, 44], [2, 55], [3, 19]]\n}]\n</code></pre>\n<p><br>\n<strong>Relationship between &quot;value&quot; and <a href=\"#xAxis.type\">axis.type</a></strong></p>\n<ul>\n<li><p>When a dimension corresponds to a value axis (axis.type is <code>&#39;value&#39;</code> or <code>&#39;log&#39;</code>):</p>\n<p>  The value can be a <code>number</code> (like <code>12</code>) (can also be a number in a <code>string</code> format, like <code>&#39;12&#39;</code>).</p>\n</li>\n<li><p>When a dimension corresponds to a category axis (axis.type is <code>&#39;category&#39;</code>):</p>\n<p>  The value should be the ordinal of the axis.data (based on <code>0</code>), the string value of the axis.data. For example:</p>\n<pre><code class=\"lang-js\">  xAxis: {\n      type: &#39;category&#39;,\n      data: [&#39;Monday&#39;, &#39;Tuesday&#39;, &#39;Wednesday&#39;, &#39;Thursday&#39;]\n  },\n  yAxis: {\n      type: &#39;category&#39;,\n      data: [&#39;a&#39;, &#39;b&#39;, &#39;m&#39;, &#39;n&#39;, &#39;p&#39;, &#39;q&#39;]\n  },\n  series: [{\n      data: [\n          // xAxis      yAxis\n          [  0,           0,    2  ], // This point is located at xAxis: &#39;Monday&#39;, yAxis: &#39;a&#39;.\n          [  &#39;Thursday&#39;,  2,    1  ], // This point is located at xAxis: &#39;Thursday&#39;, yAxis: &#39;m&#39;.\n          [  2,          &#39;p&#39;,   2  ], // This point is located at xAxis: &#39;Wednesday&#39;, yAxis: &#39;p&#39;.\n          [  3,           3,    5  ]\n      ]\n  }]\n</code></pre>\n<p>  There is an example of double category axes: <a href=\"http://echarts.baidu.com/gallery/editor.html?c=scatter-punchCard\" target=\"_blank\">Github Punchcard</a>.</p>\n</li>\n<li><p>When a dimension corresponds to a time axis (type is <code>&#39;time&#39;</code>), the value can be:</p>\n<ul>\n<li>a timestamp, like <code>1484141700832</code>, which represents a UTC time.</li>\n<li>a date string, in one of the formats below:<ul>\n<li>a subset of <a href=\"http://www.ecma-international.org/ecma-262/5.1/#sec-15.9.1.15\" target=\"_blank\">ISO 8601</a>, only including (all of these are treated as local time unless timezone is specified, which is consistent with <a href=\"https://momentjs.com/\" target=\"_blank\">moment</a>):<ul>\n<li>only part of year/month/date/time are specified: <code>&#39;2012-03&#39;</code>, <code>&#39;2012-03-01&#39;</code>, <code>&#39;2012-03-01 05&#39;</code>, <code>&#39;2012-03-01 05:06&#39;</code>.</li>\n<li>separated by <code>&quot;T&quot;</code> or a space: <code>&#39;2012-03-01T12:22:33.123&#39;</code>, <code>&#39;2012-03-01 12:22:33.123&#39;</code>.</li>\n<li>timezone specified: <code>&#39;2012-03-01T12:22:33Z&#39;</code>, <code>&#39;2012-03-01T12:22:33+8000&#39;</code>, <code>&#39;2012-03-01T12:22:33-05:00&#39;</code>.</li>\n</ul>\n</li>\n<li>other date string format (all of these are treated as local time):\n<code>&#39;2012&#39;</code>, <code>&#39;2012-3-1&#39;</code>, <code>&#39;2012/3/1&#39;</code>, <code>&#39;2012/03/01&#39;</code>,\n<code>&#39;2009/6/12 2:00&#39;</code>, <code>&#39;2009/6/12 2:05:08&#39;</code>, <code>&#39;2009/6/12 2:05:08.123&#39;</code>.</li>\n</ul>\n</li>\n<li>a JavaScript Date instance created by user:<ul>\n<li>Caution, when using a data string to create a Date instance, <a href=\"http://dygraphs.com/date-formats.html\" target=\"_blank\">browser differences and inconsistencies</a> should be considered.</li>\n<li>For example: In chrome, <code>new Date(&#39;2012-01-01&#39;)</code> is treated as a Jan 1st 2012 in UTC, while <code>new Date(&#39;2012-1-1&#39;)</code> and <code>new Date(&#39;2012/01/01&#39;)</code> are treated as Jan 1st 2012 in local timezone. In safari <code>new Date(&#39;2012-1-1&#39;)</code> is not supported.</li>\n<li>So if you intent to perform <code>new Date(dateString)</code>, it is strongly recommended to use a time parse library (e.g., <a href=\"https://momentjs.com/\" target=\"_blank\">moment</a>), or use <code>echarts.number.parseDate</code>, or check <a href=\"http://dygraphs.com/date-formats.html\" target=\"_blank\">this</a>.</li>\n</ul>\n</li>\n</ul>\n</li>\n</ul>\n<p><br>\n<strong>Customize a data item:</strong></p>\n<p>When needing to customize a data item, it can be set as an object, where property <code>value</code> reprensent real value. For example:</p>\n<pre><code class=\"lang-js\">[\n    12,\n    24,\n    {\n        value: [24, 32],\n        // label style, only works in this data item.\n        label: {},\n        // item style, only works in this data item.\n        itemStyle:{}\n    },\n    33\n]\n// Or\n[\n    [12, 332],\n    [24, 32],\n    {\n        value: [24, 32],\n        // label style, only works in this data item.\n        label: {},\n        // item style, only works in this data item.\n        itemStyle:{}\n    },\n    [33, 31]\n]\n</code></pre>\n<p><br>\n<strong>Empty value:</strong></p>\n<p><code>&#39;-&#39;</code> or <code>null</code> or <code>undefined</code> or <code>NaN</code> can be used to describe that a data item is not exists (ps：<em>not exist</em> does not means its value is <code>0</code>).</p>\n<p>For example, line chart can break when encounter an empty value, and scatter chart do not display graphic elements for empty values.</p>\n<p><br><br></p>\n","items":{"type":"Object","properties":{"name":{"type":["string"]},"value":{"type":["number"]},"label":{"type":["Object"],"description":"<p>The style setting of the text label in a single bar.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"inside"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"'auto'"},"barBorderColor":{"type":["Color"],"default":"'#000'"},"barBorderWidth":{"type":["number"],"default":0},"barBorderRadius":{"type":["number","Array"],"default":0},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"'auto'"},"barBorderColor":{"type":["Color"],"default":"'#000'"},"barBorderWidth":{"type":["number"],"default":0},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"tooltip":{"type":["*"],"description":"<p>tooltip settings in this series data.</p>\n","properties":{"position":{"type":["string","Array"]},"formatter":{"type":["string","Function"]},"backgroundColor":{"type":["Color"],"default":"'rgba(50,50,50,0.7)'"},"borderColor":{"type":["Color"],"default":"'#333'"},"borderWidth":{"type":["number"],"default":0},"padding":{"type":["number"],"default":5},"textStyle":{"type":["Object"],"description":"<blockquote>\n<p><strong>Notice：</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code>&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The text syle of tooltip&#39;s floating layer.</p>\n","properties":{"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":14},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"extraCssText":{"type":["string"]}}}}}},"markPoint":{"type":["Object"],"description":"<p>Mark point in a chart.</p>\n","properties":{"symbol":{"type":["string"],"default":"'pin'"},"symbolSize":{"type":["number","Array","Function"],"default":50},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"silent":{"type":["boolean"],"default":false},"label":{"type":["Object"],"description":"<p>Label of mark point.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Mark point style.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["Array"],"description":"<p>Data array for mark points, each of which is an object. Here are some ways to assign mark point position.</p>\n<ol>\n<li><p>Assign coordinate according to container with <a href=\"#series-bar.markPoint.data.x\">x</a>, <a href=\"#series-bar.markPoint.data.y\">y</a> attribute, in which pixel values and percentage are supported.</p>\n</li>\n<li><p>Assign coordinate position with <a href=\"#series-bar.markPoint.data.coord\">coord</a> attribute, in which <code>&#39;min&#39;</code>, <code>&#39;max&#39;</code>, <code>&#39;average&#39;</code> are supported for each dimension.</p>\n</li>\n<li><p>Use <a href=\"#series-bar.markPoint.data.type\">type</a> attribute to mark the maximum and minimum values in the series, in which <a href=\"#series-bar.markPoint.data.valueIndex\">valueIndex</a> or <a href=\"#series-bar.markPoint.data.valueDim\">valueDim</a> can be used to assign the dimension.</p>\n</li>\n</ol>\n<p>When multiple attributes exist, priority is as the above order.</p>\n<p><strong>For example: </strong></p>\n<pre><code class=\"lang-js\">data: [\n    {\n        name: &#39;maximum&#39;,\n        type: &#39;max&#39;\n    }, \n    {\n        name: &#39;coordinate&#39;,\n        coord: [10, 20]\n    }, {\n        name: &#39;fixed x position&#39;,\n        yAixs: 10,\n        x: &#39;90%&#39;\n    }, \n    {\n        name: &#39;screen coordinate&#39;,\n        x: 100,\n        y: 100\n    }\n]\n</code></pre>\n","items":{"type":"Object","properties":{"name":{"type":["string"],"default":"''"},"type":{"type":["string"]},"valueIndex":{"type":["number"]},"valueDim":{"type":["string"]},"coord":{"type":["Array"]},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"itemStyle":{"type":["Object"],"description":"<p>Mark point style.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"markLine":{"type":["*"],"description":"<p>Use a line in the chart to illustrate.</p>\n","properties":{"silent":{"type":["boolean"],"default":false},"symbol":{"type":["string","Array"]},"symbolSize":{"type":["number","Array"]},"precision":{"type":["number"],"default":2},"label":{"type":["Object"],"description":"<p>Mark line text.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]}}}}},"lineStyle":{"type":["Object"],"description":"<p>Mark line style.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["*"],"description":"<p>Data array of marking line. Every array item can be an array of one or two values, representing starting and ending point of the line, and every item is an object. Here are several ways to assign the positions of starting and ending point.</p>\n<ol>\n<li><p>Assign coordinate according to container with <a href=\"#series-bar.markLine.data.0.x\">x</a>, <a href=\"#series-bar.markLine.data.0.y\">y</a> attribute, in which pixel values and percentage are supported.</p>\n</li>\n<li><p>Assign coordinate position with <a href=\"#series-bar.markLine.data.0.coord\">coord</a> attribute, in which <code>&#39;min&#39;</code>, <code>&#39;max&#39;</code>, <code>&#39;average&#39;</code> are supported for each dimension.</p>\n</li>\n<li><p>Use <a href=\"#series-bar.markLine.data.0.type\">type</a> attribute to mark the maximum and minimum values in the series, in which <a href=\"#series-bar.markLine.data.0.valueIndex\">valueIndex</a> or <a href=\"#series-bar.markLine.data.0.valueDim\">valueDim</a> can be used to assign the dimension.</p>\n</li>\n<li><p>You may also create a mark line in Cartesian coordinate at a specific position in X or Y axis by assigning <code>xAxis</code> or <code>yAxis</code>. See <a href=\"http://echarts.baidu.com/gallery/editor.html?c=scatter-weight\" target=\"_blank\">scatter-weight</a> for example.</p>\n</li>\n</ol>\n<p>When multiple attributes exist, priority is as the above order.</p>\n<p>You may also set the type of mark line through <code>type</code>, stating whether it is for the maximum value or average value. Likewise, dimensions can be assigned through <code>valueIndex</code>.</p>\n<pre><code>data: [\n    {\n        name: &#39;average line&#39;,\n        // &#39;average&#39;, &#39;min&#39;, and &#39;max&#39; are supported\n        type: &#39;average&#39;\n    },\n    {\n        name: &#39;Horizontal line with Y value at 100&#39;,\n        yAxis: 100\n    },\n    [\n        {\n            // Use the same name with starting and ending point\n            name: &#39;Minimum to Maximum&#39;,\n            type: &#39;min&#39;\n        },\n        {\n            type: &#39;max&#39;\n        }\n    ],\n    [\n        {\n            name: &#39;Markline between two points&#39;,\n            coord: [10, 20]\n        },\n        {\n            coord: [20, 30]\n        }\n    ], [{\n        // Mark line with a fixed X position in starting point. This is used to generate an arrow pointing to maximum line.\n        yAxis: &#39;max&#39;,\n        x: &#39;90%&#39;\n    }, {\n        type: &#39;max&#39;\n    }],\n    [\n        {\n            name: &#39;Mark line between two points&#39;,\n            x: 100,\n            y: 100\n        },\n        {\n            x: 500,\n            y: 200\n        }\n    ]\n]\n</code></pre>","properties":{"0":{"type":["Object"],"description":"<p>Data of the starting point.</p>\n","properties":{"type":{"type":["string"]},"valueIndex":{"type":["number"]},"valueDim":{"type":["string"]},"coord":{"type":["Array"]},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"lineStyle":{"type":["Object"],"description":"<p>Line style of this data item, which will be merged with <code>lineStyle</code> of starting point and ending point.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0}}}}},"label":{"type":["Object"],"description":"<p>Label of this data item, which will be merged with <code>label</code> of starting point and ending point.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]}}}}}}},"1":{"type":["Object"],"description":"<p>Data of the ending point.</p>\n","properties":{"type":{"type":["string"]},"valueIndex":{"type":["number"]},"valueDim":{"type":["string"]},"coord":{"type":["Array"]},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"lineStyle":{"type":["Object"],"description":"<p>Line style of this data item, which will be merged with <code>lineStyle</code> of starting point and ending point.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0}}}}},"label":{"type":["Object"],"description":"<p>Label of this data item, which will be merged with <code>label</code> of starting point and ending point.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]}}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"markArea":{"type":["Object"],"description":"<p>Used to mark an area in chart. For example, mark a time interval.</p>\n","properties":{"silent":{"type":["boolean"],"default":false},"label":{"type":["Object"],"description":"<p>Label in mark area.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Style of the mark area.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["*"],"description":"<p>The scope of the area is defined by <code>data</code>, which is an array with two item, representing the left-top point and the right-bottom point of rectangle area. Each item can be defined as follows:</p>\n<ol>\n<li><p>Specify the coordinate in screen coordinate system using <a href=\"#series-bar.markArea.data.0.x\">x</a>, <a href=\"#series-bar.markArea.data.0.y\">y</a>, where the unit is pixel (e.g., the value is <code>5</code>), or percent (e.g., the value is <code>&#39;35%&#39;</code>).</p>\n</li>\n<li><p>Specify the coordinate in data coordinate system (i.e., cartesian) using\n<a href=\"#series-bar.markArea.data.0.coord\">coord</a>, which can be also set as <code>&#39;min&#39;</code>, <code>&#39;max&#39;</code>, <code>&#39;average&#39;</code> (e.g, <code>coord: [23, &#39;min&#39;]</code>, or <code>coord: [&#39;average&#39;, &#39;max&#39;]</code>)。</p>\n</li>\n</ol>\n<ol>\n<li>Locate the point on the min value or max value of <code>series.data</code> using <a href=\"#series-bar.markArea.data.0.type\">type</a>, where <a href=\"#series-bar.markArea.data.0.valueIndex\">valueIndex</a> or <a href=\"#series-bar.markPoint.data.0.valueDim\">valueDim</a> can be used to specify the dimension on which the min, max or average are calculated.</li>\n<li>If in cartesian, you can only specify <code>xAxis</code> or <code>yAxis</code> to define a mark area based on only X or Y axis, see sample <a href=\"http://echarts.baidu.com/gallery/editor.html?c=scatter-weight\" target=\"_blank\">scatter-weight</a></li>\n</ol>\n<p>The priority follows as above if more than one above definition used.</p>\n<pre><code>data: [\n\n    [\n        {\n            name: &#39;From average to max&#39;,\n            type: &#39;average&#39;\n        },\n        {\n            type: &#39;max&#39;\n        }\n    ],\n\n    [\n        {\n            name: &#39;Mark area between two points in data coordiantes&#39;,\n            coord: [10, 20]\n        },\n        {\n            coord: [20, 30]\n        }\n    ], [\n        {\n            name: &#39;From 60 to 80&#39;,\n            yAxis: 60\n        },\n        {\n            yAxis: 80\n        }\n    ], [\n        {\n            name: &#39;Mark area covers all data&#39;\n            coord: [&#39;min&#39;, &#39;min&#39;]\n        },\n        {\n            coord: [&#39;max&#39;, &#39;max&#39;]\n        }\n    ],\n    [\n        {\n            name: &#39;Mark area in two screen points&#39;,\n            x: 100,\n            y: 100\n        }, {\n            x: &#39;90%&#39;,\n            y: &#39;10%&#39;\n        }\n    ]\n]\n</code></pre>","properties":{"0":{"type":["Object"],"description":"<p>Specify the left-top point.</p>\n","properties":{"type":{"type":["string"]},"valueIndex":{"type":["number"]},"valueDim":{"type":["string"]},"coord":{"type":["Array"]},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"itemStyle":{"type":["Object"],"description":"<p>Style of the item.\n<code>itemStyle</code> of start point and end point will be merged together.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"<p>Label style of the item.\nLabel style of start point and end point will be merged together.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}},"1":{"type":["Object"],"description":"<p>Specify the right-bottom point.</p>\n","properties":{"type":{"type":["string"]},"valueIndex":{"type":["number"]},"valueDim":{"type":["string"]},"coord":{"type":["Array"]},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"itemStyle":{"type":["Object"],"description":"<p>Style of the item.\n<code>itemStyle</code> of start point and end point will be merged together.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"<p>Label style of the item.\nLabel style of start point and end point will be merged together.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"zlevel":{"type":["number"],"default":0},"z":{"type":["number"],"default":2},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0},"tooltip":{"type":["*"],"description":"<p>tooltip settings in this series.</p>\n","properties":{"position":{"type":["string","Array"]},"formatter":{"type":["string","Function"]},"backgroundColor":{"type":["Color"],"default":"'rgba(50,50,50,0.7)'"},"borderColor":{"type":["Color"],"default":"'#333'"},"borderWidth":{"type":["number"],"default":0},"padding":{"type":["number"],"default":5},"textStyle":{"type":["Object"],"description":"<p><br></p>\n<blockquote>\n<p><strong>Notice：</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code>&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The text syle of tooltip&#39;s floating layer.</p>\n","properties":{"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":14},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"extraCssText":{"type":["string"]}}}}},{"type":["Object"],"description":"<p><strong>pie chart</strong></p>\n<p>The pie chart is mainly used for showing proportion of different categories. Each arc length represents the proportion of data quantity.</p>\n<p><strong>Tip:</strong> The pie chart is more suitable for illustrating the numerical proportion. If you just to present the numerical differences of various categories, the <a href=\"bar\" target=\"_blank\">bar graph</a> chart is more suggested. Because compared to tiny length difference,  people is less sensitive to the minor radian difference. Otherwise, it can also be shown as Nightingale chart by using the <a href=\"#series-pie.roseType\">roseType</a> to distinguish different data through radius.</p>\n<p><strong> The below example shows a customized Nightingale chart: </strong></p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=pie-custom&edit=1&reset=1\" width=\"500\" height=\"400\" ></iframe>\n\n\n","properties":{"type":{"type":["string"],"default":"'pie'"},"id":{"type":["string"]},"name":{"type":["string"]},"legendHoverLink":{"type":["boolean"],"default":true},"hoverAnimation":{"type":["boolean"],"default":true},"hoverOffset":{"type":["number"],"default":10},"selectedMode":{"type":["boolean","string"],"default":false},"selectedOffset":{"type":["number"],"default":10},"clockwise":{"type":["boolean"],"default":true},"startAngle":{"type":["number"],"default":90},"minAngle":{"type":["number"],"default":0},"roseType":{"type":["boolean","string"],"default":false},"avoidLabelOverlap":{"type":["boolean"],"default":true},"stillShowZeroSum":{"type":["boolean"],"default":true},"cursor":{"type":["string"],"default":"'pointer'"},"label":{"type":["Object"],"description":"<p>Text label of pie chart, to explain some data information about graphic item like value, name and so on. <code>label</code> is placed under <code>itemStyle</code> in ECharts 2.x. In ECharts 3, to make the configuration structure flatter, <code>label</code>is taken to be at the same level with <code>itemStyle</code>, and has <code>emphasis</code> as <code>itemStyle</code> does.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string"],"default":"'outside'"},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"labelLine":{"type":["Object"],"description":"<p>The style of visual guide line. Will show when <a href=\"#series-pie.label.position\">label position</a> is set as <code>&#39;outside&#39;</code>.</p>\n<p>The style of visual guide line.</p>\n","properties":{"show":{"type":["boolean"]},"length":{"type":["number"]},"length2":{"type":["number"]},"smooth":{"type":["boolean","number"],"default":false},"lineStyle":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}},"emphasis":{"type":["Object"],"description":"<p>The style of visual guide line in emphasis status.</p>\n","properties":{"show":{"type":["boolean"]},"lineStyle":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Graphic style of , <code>emphasis</code> is the style when it is highlighted, like being hovered by mouse, or highlighted via legend connect.</p>\n","properties":{"color":{"type":["Color","Function"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"zlevel":{"type":["number"],"default":0},"z":{"type":["number"],"default":2},"center":{"type":["Array"],"default":"['50%', '50%']"},"radius":{"type":["Array"],"default":"[0, '75%']"},"seriesLayoutBy":{"type":["string"],"default":"'column'"},"datasetIndex":{"type":["number"],"default":0},"data":{"type":["Array"],"description":"<p>Data array of  series, which can be a single data value, like:</p>\n<pre><code class=\"lang-js\">[12, 34, 56, 10, 23]\n</code></pre>\n<p>Or, if need extra dimensions for components like <a href=\"#visualMap\">visualMap</a> to map to graphic attributes like color, it can also be in the form of array. For example:</p>\n<pre><code class=\"lang-js\">[[12, 14], [34, 50], [56, 30], [10, 15], [23, 10]]\n</code></pre>\n<p>In this case, we can assgin the second value in each arrary item to <a href=\"#visualMap\">visualMap</a> component.</p>\n<p>More likely, we need to assign name to each data item, in which case each item should be an object:</p>\n<pre><code class=\"lang-js\">[{\n    // name of date item\n    name: &#39;data1&#39;,\n    // value of date item is 8\n    value: 10\n}, {\n    name: &#39;data2&#39;,\n    value: 20\n}]\n</code></pre>\n<p>Each data item can be further custerized:</p>\n<pre><code class=\"lang-js\">[{\n    name: &#39;data1&#39;,\n    value: 10\n}, {\n    // name of data item\n    name: &#39;data2&#39;,\n    value : 56,\n    // user-defined label format that only useful for this data item\n    label: {},\n    // user-defined special itemStyle that only useful for this data item\n    itemStyle:{}\n}]\n</code></pre>\n","items":{"type":"Object","properties":{"name":{"type":["string"]},"value":{"type":["number"]},"selected":{"type":["boolean"],"default":false},"label":{"type":["Object"],"description":"<p>The label configuration of a single sector.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string"],"default":"'outside'"},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"labelLine":{"type":["Object"],"description":"<p>The style of visual guide line.</p>\n","properties":{"show":{"type":["boolean"]},"length":{"type":["number"]},"length2":{"type":["number"]},"smooth":{"type":["boolean","number"],"default":false},"lineStyle":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}},"emphasis":{"type":["Object"],"description":"<p>The style of visual guide line in emphasis status.</p>\n","properties":{"show":{"type":["boolean"]},"lineStyle":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Graphic style of , <code>emphasis</code> is the style when it is highlighted, like being hovered by mouse, or highlighted via legend connect.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"tooltip":{"type":["*"],"description":"<p>tooltip settings in this series data.</p>\n","properties":{"position":{"type":["string","Array"]},"formatter":{"type":["string","Function"]},"backgroundColor":{"type":["Color"],"default":"'rgba(50,50,50,0.7)'"},"borderColor":{"type":["Color"],"default":"'#333'"},"borderWidth":{"type":["number"],"default":0},"padding":{"type":["number"],"default":5},"textStyle":{"type":["Object"],"description":"<blockquote>\n<p><strong>Notice：</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code>&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The text syle of tooltip&#39;s floating layer.</p>\n","properties":{"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":14},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"extraCssText":{"type":["string"]}}}}}},"markPoint":{"type":["Object"],"description":"<p>Mark point in a chart.</p>\n","properties":{"symbol":{"type":["string"],"default":"'pin'"},"symbolSize":{"type":["number","Array","Function"],"default":50},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"silent":{"type":["boolean"],"default":false},"label":{"type":["Object"],"description":"<p>Label of mark point.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Mark point style.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["Array"],"description":"<p>Data array for mark points, each of which is an object. Here are some ways to assign mark point position.</p>\n<ol>\n<li>Assign coordinate according to container with <a href=\"#series-pie.markPoint.data.x\">x</a>, <a href=\"#series-pie.markPoint.data.y\">y</a> attribute, in which pixel values and percentage are supported.</li>\n</ol>\n<p>When multiple attributes exist, priority is as the above order.</p>\n<p><strong>For example: </strong></p>\n<pre><code class=\"lang-js\">data: [\n    {\n        name: &#39;screen coordinate&#39;,\n        x: 100,\n        y: 100\n    }\n]\n</code></pre>\n","items":{"type":"Object","properties":{"name":{"type":["string"],"default":"''"},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"itemStyle":{"type":["Object"],"description":"<p>Mark point style.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"markLine":{"type":["*"],"description":"<p>Use a line in the chart to illustrate.</p>\n","properties":{"silent":{"type":["boolean"],"default":false},"symbol":{"type":["string","Array"]},"symbolSize":{"type":["number","Array"]},"precision":{"type":["number"],"default":2},"label":{"type":["Object"],"description":"<p>Mark line text.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]}}}}},"lineStyle":{"type":["Object"],"description":"<p>Mark line style.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["*"],"description":"<p>Data array of marking line. Every array item can be an array of one or two values, representing starting and ending point of the line, and every item is an object. Here are several ways to assign the positions of starting and ending point.</p>\n<ol>\n<li>Assign coordinate according to container with <a href=\"#series-pie.markLine.data.0.x\">x</a>, <a href=\"#series-pie.markLine.data.0.y\">y</a> attribute, in which pixel values and percentage are supported.</li>\n</ol>\n<p>When multiple attributes exist, priority is as the above order.</p>\n<pre><code>data: [\n    [\n        {\n            name: &#39;Mark line between two points&#39;,\n            x: 100,\n            y: 100\n        },\n        {\n            x: 500,\n            y: 200\n        }\n    ]\n]\n</code></pre>","properties":{"0":{"type":["Object"],"description":"<p>Data of the starting point.</p>\n","properties":{"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"lineStyle":{"type":["Object"],"description":"<p>Line style of this data item, which will be merged with <code>lineStyle</code> of starting point and ending point.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0}}}}},"label":{"type":["Object"],"description":"<p>Label of this data item, which will be merged with <code>label</code> of starting point and ending point.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]}}}}}}},"1":{"type":["Object"],"description":"<p>Data of the ending point.</p>\n","properties":{"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"lineStyle":{"type":["Object"],"description":"<p>Line style of this data item, which will be merged with <code>lineStyle</code> of starting point and ending point.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0}}}}},"label":{"type":["Object"],"description":"<p>Label of this data item, which will be merged with <code>label</code> of starting point and ending point.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]}}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"markArea":{"type":["Object"],"description":"<p>Used to mark an area in chart. For example, mark a time interval.</p>\n","properties":{"silent":{"type":["boolean"],"default":false},"label":{"type":["Object"],"description":"<p>Label in mark area.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Style of the mark area.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["*"],"description":"<p>The scope of the area is defined by <code>data</code>, which is an array with two item, representing the left-top point and the right-bottom point of rectangle area. Each item can be defined as follows:</p>\n<ol>\n<li>Specify the coordinate in screen coordinate system using <a href=\"#series-pie.markArea.data.0.x\">x</a>, <a href=\"#series-pie.markArea.data.0.y\">y</a>, where the unit is pixel (e.g., the value is <code>5</code>), or percent (e.g., the value is <code>&#39;35%&#39;</code>).</li>\n</ol>\n<p>The priority follows as above if more than one above definition used.</p>\n<pre><code>data: [\n    [\n        {\n            name: &#39;Mark area in two screen points&#39;,\n            x: 100,\n            y: 100\n        }, {\n            x: &#39;90%&#39;,\n            y: &#39;10%&#39;\n        }\n    ]\n]\n</code></pre>","properties":{"0":{"type":["Object"],"description":"<p>Specify the left-top point.</p>\n","properties":{"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"itemStyle":{"type":["Object"],"description":"<p>Style of the item.\n<code>itemStyle</code> of start point and end point will be merged together.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"<p>Label style of the item.\nLabel style of start point and end point will be merged together.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}},"1":{"type":["Object"],"description":"<p>Specify the right-bottom point.</p>\n","properties":{"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"itemStyle":{"type":["Object"],"description":"<p>Style of the item.\n<code>itemStyle</code> of start point and end point will be merged together.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"<p>Label style of the item.\nLabel style of start point and end point will be merged together.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"silent":{"type":["boolean"],"default":false},"animationType":{"type":["string"],"default":"'expansion'"},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0},"tooltip":{"type":["*"],"description":"<p>tooltip settings in this series.</p>\n","properties":{"position":{"type":["string","Array"]},"formatter":{"type":["string","Function"]},"backgroundColor":{"type":["Color"],"default":"'rgba(50,50,50,0.7)'"},"borderColor":{"type":["Color"],"default":"'#333'"},"borderWidth":{"type":["number"],"default":0},"padding":{"type":["number"],"default":5},"textStyle":{"type":["Object"],"description":"<p><br></p>\n<blockquote>\n<p><strong>Notice：</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code>&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The text syle of tooltip&#39;s floating layer.</p>\n","properties":{"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":14},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"extraCssText":{"type":["string"]}}}}},{"type":["Object"],"description":"<p>Scatter (bubble) chart . The scatter chart in <a href=\"#grid\">rectangular coordinate</a> could be used to present the relation between  <code>x</code> and <code>y</code>. If data have multiple dimensions, the values of the other dimensions can be visualized through <a href=\"#series-scatter.symbol\">symbol</a> with various sizes and colors, which becomes a bubble chart. These can be done by using with <a href=\"#visualMap\">visualMap</a> component.</p>\n<p>It could be used with <a href=\"#grid\">rectangular coordinate</a> and <a href=\"#polar\">polar coordinate</a> and <a href=\"#geo\">geographical coordinate</a>.</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=scatter-map&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n","properties":{"type":{"type":["string"],"default":"'scatter'"},"id":{"type":["string"]},"name":{"type":["string"]},"coordinateSystem":{"type":["string"],"default":"'cartesian2d'"},"xAxisIndex":{"type":["number"],"default":0},"yAxisIndex":{"type":["number"],"default":0},"polarIndex":{"type":["number"],"default":0},"geoIndex":{"type":["number"],"default":0},"calendarIndex":{"type":["number"],"default":0},"hoverAnimation":{"type":["boolean"]},"legendHoverLink":{"type":["boolean"],"default":true},"symbol":{"type":["string"],"default":"'circle'"},"symbolSize":{"type":["number","Array","Function"],"default":10},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"large":{"type":["boolean"],"default":true},"largeThreshold":{"type":["number"],"default":2000},"cursor":{"type":["string"],"default":"'pointer'"},"label":{"type":["Object"],"description":"<p>Text label of , to explain some data information about graphic item like value, name and so on. <code>label</code> is placed under <code>itemStyle</code> in ECharts 2.x. In ECharts 3, to make the configuration structure flatter, <code>label</code>is taken to be at the same level with <code>itemStyle</code>, and has <code>emphasis</code> as <code>itemStyle</code> does.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Graphic style of , <code>emphasis</code> is the style when it is highlighted, like being hovered by mouse, or highlighted via legend connect.</p>\n","properties":{"color":{"type":["Color","Function"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"dimensions":{"type":["Array"]},"encode":{"type":["Object"]},"seriesLayoutBy":{"type":["string"],"default":"'column'"},"datasetIndex":{"type":["number"],"default":0},"data":{"type":["Array"],"description":"<p>Data array of series, which can be in the following forms:</p>\n<p>Notice, if no <code>data</code> specified in series, and there is <a href=\"#dataset\">dataset</a> in option, series will use the first <a href=\"#dataset\">dataset</a> as its datasource. If <code>data</code> has been specified, <a href=\"#dataset\">dataset</a> will not used.</p>\n<p><code>series.datasetIndex</code> can be used to specify other <a href=\"#dataset\">dataset</a>.</p>\n<p>Basically, data is represented by a two-dimension array, like the example below, where each colum is named as a &quot;dimension&quot;.</p>\n<pre><code class=\"lang-js\">series: [{\n    data: [\n        // dimX   dimY   other dimensions ...\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>In <a href=\"#grid\">cartesian (grid)</a>, &quot;dimX&quot; and &quot;dimY&quot; correspond to <a href=\"#xAxis\">xAxis</a> and <a href=\"#yAxis\">yAxis</a> repectively.</li>\n<li>In <a href=\"#polar\">polar</a> &quot;dimX&quot; and &quot;dimY&quot; correspond to <a href=\"#radiusAxis\">radiusAxis</a> 和 <a href=\"#anbleAxis\">angleAxis</a> repectively.</li>\n<li>Other dimensions are optional, which can be used in other place. For example:<ul>\n<li><a href=\"#visualMap\">visualMap</a> can map one or more dimensions to viusal (color, symbol size ...).</li>\n<li><a href=\"#series.symbolSize\">series.symbolSize</a> can be set as a callback function, where symbol size can be calculated by values of a certain dimension.</li>\n<li>Values in other dimensions can be shown by <a href=\"#tooltip.formatter\">tooltip.formatter</a> or <a href=\"#series.label.formatter\">series.label.formatter</a>.</li>\n</ul>\n</li>\n</ul>\n<p>Especially, when there is one and only one category axis (axis.type is <code>&#39;category&#39;</code>), data can be simply be represented by a one-dimension array, like:</p>\n<pre><code class=\"lang-js\">xAxis: {\n    data: [&#39;a&#39;, &#39;b&#39;, &#39;m&#39;, &#39;n&#39;]\n},\nseries: [{\n    // Each item corresponds to each item in xAxis.data.\n    data: [23,  44,  55,  19]\n    // In fact, it is the simplification of the format below:\n    // data: [[0, 23], [1, 44], [2, 55], [3, 19]]\n}]\n</code></pre>\n<p><br>\n<strong>Relationship between &quot;value&quot; and <a href=\"#xAxis.type\">axis.type</a></strong></p>\n<ul>\n<li><p>When a dimension corresponds to a value axis (axis.type is <code>&#39;value&#39;</code> or <code>&#39;log&#39;</code>):</p>\n<p>  The value can be a <code>number</code> (like <code>12</code>) (can also be a number in a <code>string</code> format, like <code>&#39;12&#39;</code>).</p>\n</li>\n<li><p>When a dimension corresponds to a category axis (axis.type is <code>&#39;category&#39;</code>):</p>\n<p>  The value should be the ordinal of the axis.data (based on <code>0</code>), the string value of the axis.data. For example:</p>\n<pre><code class=\"lang-js\">  xAxis: {\n      type: &#39;category&#39;,\n      data: [&#39;Monday&#39;, &#39;Tuesday&#39;, &#39;Wednesday&#39;, &#39;Thursday&#39;]\n  },\n  yAxis: {\n      type: &#39;category&#39;,\n      data: [&#39;a&#39;, &#39;b&#39;, &#39;m&#39;, &#39;n&#39;, &#39;p&#39;, &#39;q&#39;]\n  },\n  series: [{\n      data: [\n          // xAxis      yAxis\n          [  0,           0,    2  ], // This point is located at xAxis: &#39;Monday&#39;, yAxis: &#39;a&#39;.\n          [  &#39;Thursday&#39;,  2,    1  ], // This point is located at xAxis: &#39;Thursday&#39;, yAxis: &#39;m&#39;.\n          [  2,          &#39;p&#39;,   2  ], // This point is located at xAxis: &#39;Wednesday&#39;, yAxis: &#39;p&#39;.\n          [  3,           3,    5  ]\n      ]\n  }]\n</code></pre>\n<p>  There is an example of double category axes: <a href=\"http://echarts.baidu.com/gallery/editor.html?c=scatter-punchCard\" target=\"_blank\">Github Punchcard</a>.</p>\n</li>\n<li><p>When a dimension corresponds to a time axis (type is <code>&#39;time&#39;</code>), the value can be:</p>\n<ul>\n<li>a timestamp, like <code>1484141700832</code>, which represents a UTC time.</li>\n<li>a date string, in one of the formats below:<ul>\n<li>a subset of <a href=\"http://www.ecma-international.org/ecma-262/5.1/#sec-15.9.1.15\" target=\"_blank\">ISO 8601</a>, only including (all of these are treated as local time unless timezone is specified, which is consistent with <a href=\"https://momentjs.com/\" target=\"_blank\">moment</a>):<ul>\n<li>only part of year/month/date/time are specified: <code>&#39;2012-03&#39;</code>, <code>&#39;2012-03-01&#39;</code>, <code>&#39;2012-03-01 05&#39;</code>, <code>&#39;2012-03-01 05:06&#39;</code>.</li>\n<li>separated by <code>&quot;T&quot;</code> or a space: <code>&#39;2012-03-01T12:22:33.123&#39;</code>, <code>&#39;2012-03-01 12:22:33.123&#39;</code>.</li>\n<li>timezone specified: <code>&#39;2012-03-01T12:22:33Z&#39;</code>, <code>&#39;2012-03-01T12:22:33+8000&#39;</code>, <code>&#39;2012-03-01T12:22:33-05:00&#39;</code>.</li>\n</ul>\n</li>\n<li>other date string format (all of these are treated as local time):\n<code>&#39;2012&#39;</code>, <code>&#39;2012-3-1&#39;</code>, <code>&#39;2012/3/1&#39;</code>, <code>&#39;2012/03/01&#39;</code>,\n<code>&#39;2009/6/12 2:00&#39;</code>, <code>&#39;2009/6/12 2:05:08&#39;</code>, <code>&#39;2009/6/12 2:05:08.123&#39;</code>.</li>\n</ul>\n</li>\n<li>a JavaScript Date instance created by user:<ul>\n<li>Caution, when using a data string to create a Date instance, <a href=\"http://dygraphs.com/date-formats.html\" target=\"_blank\">browser differences and inconsistencies</a> should be considered.</li>\n<li>For example: In chrome, <code>new Date(&#39;2012-01-01&#39;)</code> is treated as a Jan 1st 2012 in UTC, while <code>new Date(&#39;2012-1-1&#39;)</code> and <code>new Date(&#39;2012/01/01&#39;)</code> are treated as Jan 1st 2012 in local timezone. In safari <code>new Date(&#39;2012-1-1&#39;)</code> is not supported.</li>\n<li>So if you intent to perform <code>new Date(dateString)</code>, it is strongly recommended to use a time parse library (e.g., <a href=\"https://momentjs.com/\" target=\"_blank\">moment</a>), or use <code>echarts.number.parseDate</code>, or check <a href=\"http://dygraphs.com/date-formats.html\" target=\"_blank\">this</a>.</li>\n</ul>\n</li>\n</ul>\n</li>\n</ul>\n<p><br>\n<strong>Customize a data item:</strong></p>\n<p>When needing to customize a data item, it can be set as an object, where property <code>value</code> reprensent real value. For example:</p>\n<pre><code class=\"lang-js\">[\n    12,\n    24,\n    {\n        value: [24, 32],\n        // label style, only works in this data item.\n        label: {},\n        // item style, only works in this data item.\n        itemStyle:{}\n    },\n    33\n]\n// Or\n[\n    [12, 332],\n    [24, 32],\n    {\n        value: [24, 32],\n        // label style, only works in this data item.\n        label: {},\n        // item style, only works in this data item.\n        itemStyle:{}\n    },\n    [33, 31]\n]\n</code></pre>\n<p><br>\n<strong>Empty value:</strong></p>\n<p><code>&#39;-&#39;</code> or <code>null</code> or <code>undefined</code> or <code>NaN</code> can be used to describe that a data item is not exists (ps：<em>not exist</em> does not means its value is <code>0</code>).</p>\n<p>For example, line chart can break when encounter an empty value, and scatter chart do not display graphic elements for empty values.</p>\n<p><br><br></p>\n","items":{"type":"Object","properties":{"name":{"type":["string"]},"value":{"type":["Array"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"label":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"inside"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>the style setting about single data point(bubble).</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"tooltip":{"type":["*"],"description":"<p>tooltip settings in this series data.</p>\n","properties":{"position":{"type":["string","Array"]},"formatter":{"type":["string","Function"]},"backgroundColor":{"type":["Color"],"default":"'rgba(50,50,50,0.7)'"},"borderColor":{"type":["Color"],"default":"'#333'"},"borderWidth":{"type":["number"],"default":0},"padding":{"type":["number"],"default":5},"textStyle":{"type":["Object"],"description":"<blockquote>\n<p><strong>Notice：</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code>&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The text syle of tooltip&#39;s floating layer.</p>\n","properties":{"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":14},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"extraCssText":{"type":["string"]}}}}}},"markPoint":{"type":["Object"],"description":"<p>Mark point in a chart.</p>\n","properties":{"symbol":{"type":["string"],"default":"'pin'"},"symbolSize":{"type":["number","Array","Function"],"default":50},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"silent":{"type":["boolean"],"default":false},"label":{"type":["Object"],"description":"<p>Label of mark point.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Mark point style.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["Array"],"description":"<p>Data array for mark points, each of which is an object. Here are some ways to assign mark point position.</p>\n<ol>\n<li><p>Assign coordinate according to container with <a href=\"#series-scatter.markPoint.data.x\">x</a>, <a href=\"#series-scatter.markPoint.data.y\">y</a> attribute, in which pixel values and percentage are supported.</p>\n</li>\n<li><p>Assign coordinate position with <a href=\"#series-scatter.markPoint.data.coord\">coord</a> attribute, in which <code>&#39;min&#39;</code>, <code>&#39;max&#39;</code>, <code>&#39;average&#39;</code> are supported for each dimension.</p>\n</li>\n<li><p>Use <a href=\"#series-scatter.markPoint.data.type\">type</a> attribute to mark the maximum and minimum values in the series, in which <a href=\"#series-scatter.markPoint.data.valueIndex\">valueIndex</a> or <a href=\"#series-scatter.markPoint.data.valueDim\">valueDim</a> can be used to assign the dimension.</p>\n</li>\n</ol>\n<p>When multiple attributes exist, priority is as the above order.</p>\n<p><strong>For example: </strong></p>\n<pre><code class=\"lang-js\">data: [\n    {\n        name: &#39;maximum&#39;,\n        type: &#39;max&#39;\n    }, \n    {\n        name: &#39;coordinate&#39;,\n        coord: [10, 20]\n    }, {\n        name: &#39;fixed x position&#39;,\n        yAixs: 10,\n        x: &#39;90%&#39;\n    }, \n    {\n        name: &#39;screen coordinate&#39;,\n        x: 100,\n        y: 100\n    }\n]\n</code></pre>\n","items":{"type":"Object","properties":{"name":{"type":["string"],"default":"''"},"type":{"type":["string"]},"valueIndex":{"type":["number"]},"valueDim":{"type":["string"]},"coord":{"type":["Array"]},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"itemStyle":{"type":["Object"],"description":"<p>Mark point style.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"markLine":{"type":["*"],"description":"<p>Use a line in the chart to illustrate.</p>\n","properties":{"silent":{"type":["boolean"],"default":false},"symbol":{"type":["string","Array"]},"symbolSize":{"type":["number","Array"]},"precision":{"type":["number"],"default":2},"label":{"type":["Object"],"description":"<p>Mark line text.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]}}}}},"lineStyle":{"type":["Object"],"description":"<p>Mark line style.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["*"],"description":"<p>Data array of marking line. Every array item can be an array of one or two values, representing starting and ending point of the line, and every item is an object. Here are several ways to assign the positions of starting and ending point.</p>\n<ol>\n<li><p>Assign coordinate according to container with <a href=\"#series-scatter.markLine.data.0.x\">x</a>, <a href=\"#series-scatter.markLine.data.0.y\">y</a> attribute, in which pixel values and percentage are supported.</p>\n</li>\n<li><p>Assign coordinate position with <a href=\"#series-scatter.markLine.data.0.coord\">coord</a> attribute, in which <code>&#39;min&#39;</code>, <code>&#39;max&#39;</code>, <code>&#39;average&#39;</code> are supported for each dimension.</p>\n</li>\n<li><p>Use <a href=\"#series-scatter.markLine.data.0.type\">type</a> attribute to mark the maximum and minimum values in the series, in which <a href=\"#series-scatter.markLine.data.0.valueIndex\">valueIndex</a> or <a href=\"#series-scatter.markLine.data.0.valueDim\">valueDim</a> can be used to assign the dimension.</p>\n</li>\n<li><p>You may also create a mark line in Cartesian coordinate at a specific position in X or Y axis by assigning <code>xAxis</code> or <code>yAxis</code>. See <a href=\"http://echarts.baidu.com/gallery/editor.html?c=scatter-weight\" target=\"_blank\">scatter-weight</a> for example.</p>\n</li>\n</ol>\n<p>When multiple attributes exist, priority is as the above order.</p>\n<p>You may also set the type of mark line through <code>type</code>, stating whether it is for the maximum value or average value. Likewise, dimensions can be assigned through <code>valueIndex</code>.</p>\n<pre><code>data: [\n    {\n        name: &#39;average line&#39;,\n        // &#39;average&#39;, &#39;min&#39;, and &#39;max&#39; are supported\n        type: &#39;average&#39;\n    },\n    {\n        name: &#39;Horizontal line with Y value at 100&#39;,\n        yAxis: 100\n    },\n    [\n        {\n            // Use the same name with starting and ending point\n            name: &#39;Minimum to Maximum&#39;,\n            type: &#39;min&#39;\n        },\n        {\n            type: &#39;max&#39;\n        }\n    ],\n    [\n        {\n            name: &#39;Markline between two points&#39;,\n            coord: [10, 20]\n        },\n        {\n            coord: [20, 30]\n        }\n    ], [{\n        // Mark line with a fixed X position in starting point. This is used to generate an arrow pointing to maximum line.\n        yAxis: &#39;max&#39;,\n        x: &#39;90%&#39;\n    }, {\n        type: &#39;max&#39;\n    }],\n    [\n        {\n            name: &#39;Mark line between two points&#39;,\n            x: 100,\n            y: 100\n        },\n        {\n            x: 500,\n            y: 200\n        }\n    ]\n]\n</code></pre>","properties":{"0":{"type":["Object"],"description":"<p>Data of the starting point.</p>\n","properties":{"type":{"type":["string"]},"valueIndex":{"type":["number"]},"valueDim":{"type":["string"]},"coord":{"type":["Array"]},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"lineStyle":{"type":["Object"],"description":"<p>Line style of this data item, which will be merged with <code>lineStyle</code> of starting point and ending point.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0}}}}},"label":{"type":["Object"],"description":"<p>Label of this data item, which will be merged with <code>label</code> of starting point and ending point.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]}}}}}}},"1":{"type":["Object"],"description":"<p>Data of the ending point.</p>\n","properties":{"type":{"type":["string"]},"valueIndex":{"type":["number"]},"valueDim":{"type":["string"]},"coord":{"type":["Array"]},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"lineStyle":{"type":["Object"],"description":"<p>Line style of this data item, which will be merged with <code>lineStyle</code> of starting point and ending point.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0}}}}},"label":{"type":["Object"],"description":"<p>Label of this data item, which will be merged with <code>label</code> of starting point and ending point.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]}}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"markArea":{"type":["Object"],"description":"<p>Used to mark an area in chart. For example, mark a time interval.</p>\n","properties":{"silent":{"type":["boolean"],"default":false},"label":{"type":["Object"],"description":"<p>Label in mark area.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Style of the mark area.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["*"],"description":"<p>The scope of the area is defined by <code>data</code>, which is an array with two item, representing the left-top point and the right-bottom point of rectangle area. Each item can be defined as follows:</p>\n<ol>\n<li><p>Specify the coordinate in screen coordinate system using <a href=\"#series-scatter.markArea.data.0.x\">x</a>, <a href=\"#series-scatter.markArea.data.0.y\">y</a>, where the unit is pixel (e.g., the value is <code>5</code>), or percent (e.g., the value is <code>&#39;35%&#39;</code>).</p>\n</li>\n<li><p>Specify the coordinate in data coordinate system (i.e., cartesian) using\n<a href=\"#series-scatter.markArea.data.0.coord\">coord</a>, which can be also set as <code>&#39;min&#39;</code>, <code>&#39;max&#39;</code>, <code>&#39;average&#39;</code> (e.g, <code>coord: [23, &#39;min&#39;]</code>, or <code>coord: [&#39;average&#39;, &#39;max&#39;]</code>)。</p>\n</li>\n</ol>\n<ol>\n<li>Locate the point on the min value or max value of <code>series.data</code> using <a href=\"#series-scatter.markArea.data.0.type\">type</a>, where <a href=\"#series-scatter.markArea.data.0.valueIndex\">valueIndex</a> or <a href=\"#series-scatter.markPoint.data.0.valueDim\">valueDim</a> can be used to specify the dimension on which the min, max or average are calculated.</li>\n<li>If in cartesian, you can only specify <code>xAxis</code> or <code>yAxis</code> to define a mark area based on only X or Y axis, see sample <a href=\"http://echarts.baidu.com/gallery/editor.html?c=scatter-weight\" target=\"_blank\">scatter-weight</a></li>\n</ol>\n<p>The priority follows as above if more than one above definition used.</p>\n<pre><code>data: [\n\n    [\n        {\n            name: &#39;From average to max&#39;,\n            type: &#39;average&#39;\n        },\n        {\n            type: &#39;max&#39;\n        }\n    ],\n\n    [\n        {\n            name: &#39;Mark area between two points in data coordiantes&#39;,\n            coord: [10, 20]\n        },\n        {\n            coord: [20, 30]\n        }\n    ], [\n        {\n            name: &#39;From 60 to 80&#39;,\n            yAxis: 60\n        },\n        {\n            yAxis: 80\n        }\n    ], [\n        {\n            name: &#39;Mark area covers all data&#39;\n            coord: [&#39;min&#39;, &#39;min&#39;]\n        },\n        {\n            coord: [&#39;max&#39;, &#39;max&#39;]\n        }\n    ],\n    [\n        {\n            name: &#39;Mark area in two screen points&#39;,\n            x: 100,\n            y: 100\n        }, {\n            x: &#39;90%&#39;,\n            y: &#39;10%&#39;\n        }\n    ]\n]\n</code></pre>","properties":{"0":{"type":["Object"],"description":"<p>Specify the left-top point.</p>\n","properties":{"type":{"type":["string"]},"valueIndex":{"type":["number"]},"valueDim":{"type":["string"]},"coord":{"type":["Array"]},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"itemStyle":{"type":["Object"],"description":"<p>Style of the item.\n<code>itemStyle</code> of start point and end point will be merged together.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"<p>Label style of the item.\nLabel style of start point and end point will be merged together.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}},"1":{"type":["Object"],"description":"<p>Specify the right-bottom point.</p>\n","properties":{"type":{"type":["string"]},"valueIndex":{"type":["number"]},"valueDim":{"type":["string"]},"coord":{"type":["Array"]},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"itemStyle":{"type":["Object"],"description":"<p>Style of the item.\n<code>itemStyle</code> of start point and end point will be merged together.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"<p>Label style of the item.\nLabel style of start point and end point will be merged together.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"zlevel":{"type":["number"],"default":0},"z":{"type":["number"],"default":2},"silent":{"type":["boolean"],"default":false},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0},"tooltip":{"type":["*"],"description":"<p>tooltip settings in this series.</p>\n","properties":{"position":{"type":["string","Array"]},"formatter":{"type":["string","Function"]},"backgroundColor":{"type":["Color"],"default":"'rgba(50,50,50,0.7)'"},"borderColor":{"type":["Color"],"default":"'#333'"},"borderWidth":{"type":["number"],"default":0},"padding":{"type":["number"],"default":5},"textStyle":{"type":["Object"],"description":"<p><br></p>\n<blockquote>\n<p><strong>Notice：</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code>&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The text syle of tooltip&#39;s floating layer.</p>\n","properties":{"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":14},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"extraCssText":{"type":["string"]}}}}},{"type":["Object"],"description":"<p>The scatter (bubble) graph with ripple animation. The special animation effect can visually highlights some data.</p>\n<p><strong>Tip:</strong>  The effects of map was achieved through markPoint in ECharts 2.x. However, in  ECharts 3, effectScatter on geographic coordinate is recommended for achieving that effects of map.</p>\n<p><strong>Here is the example: </strong></p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=effectScatter-map&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n","properties":{"type":{"type":["string"],"default":"'effectScatter'"},"id":{"type":["string"]},"name":{"type":["string"]},"legendHoverLink":{"type":["boolean"],"default":true},"effectType":{"type":["string"],"default":"'ripple'"},"showEffectOn":{"type":["string"],"default":"'render'"},"rippleEffect":{"type":["Object"],"description":"<p>Related configurations about ripple effect.</p>\n","properties":{"period":{"type":["number"],"default":4},"scale":{"type":["number"],"default":2.5},"brushType":{"type":["string"],"default":"'fill'"}}},"coordinateSystem":{"type":["string"],"default":"'cartesian2d'"},"xAxisIndex":{"type":["number"],"default":0},"yAxisIndex":{"type":["number"],"default":0},"polarIndex":{"type":["number"],"default":0},"geoIndex":{"type":["number"],"default":0},"calendarIndex":{"type":["number"],"default":0},"symbol":{"type":["string"],"default":"'circle'"},"symbolSize":{"type":["number","Array"],"default":10},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"cursor":{"type":["string"],"default":"'pointer'"},"label":{"type":["Object"],"description":"<p>Text label of , to explain some data information about graphic item like value, name and so on. <code>label</code> is placed under <code>itemStyle</code> in ECharts 2.x. In ECharts 3, to make the configuration structure flatter, <code>label</code>is taken to be at the same level with <code>itemStyle</code>, and has <code>emphasis</code> as <code>itemStyle</code> does.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Graphic style of , <code>emphasis</code> is the style when it is highlighted, like being hovered by mouse, or highlighted via legend connect.</p>\n","properties":{"color":{"type":["Color","Function"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"dimensions":{"type":["Array"]},"encode":{"type":["Object"]},"seriesLayoutBy":{"type":["string"],"default":"'column'"},"datasetIndex":{"type":["number"],"default":0},"data":{"type":["Array"],"description":"<p>Data array of series, which can be in the following forms:</p>\n<p>Notice, if no <code>data</code> specified in series, and there is <a href=\"#dataset\">dataset</a> in option, series will use the first <a href=\"#dataset\">dataset</a> as its datasource. If <code>data</code> has been specified, <a href=\"#dataset\">dataset</a> will not used.</p>\n<p><code>series.datasetIndex</code> can be used to specify other <a href=\"#dataset\">dataset</a>.</p>\n<p>Basically, data is represented by a two-dimension array, like the example below, where each colum is named as a &quot;dimension&quot;.</p>\n<pre><code class=\"lang-js\">series: [{\n    data: [\n        // dimX   dimY   other dimensions ...\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>In <a href=\"#grid\">cartesian (grid)</a>, &quot;dimX&quot; and &quot;dimY&quot; correspond to <a href=\"#xAxis\">xAxis</a> and <a href=\"#yAxis\">yAxis</a> repectively.</li>\n<li>In <a href=\"#polar\">polar</a> &quot;dimX&quot; and &quot;dimY&quot; correspond to <a href=\"#radiusAxis\">radiusAxis</a> 和 <a href=\"#anbleAxis\">angleAxis</a> repectively.</li>\n<li>Other dimensions are optional, which can be used in other place. For example:<ul>\n<li><a href=\"#visualMap\">visualMap</a> can map one or more dimensions to viusal (color, symbol size ...).</li>\n<li><a href=\"#series.symbolSize\">series.symbolSize</a> can be set as a callback function, where symbol size can be calculated by values of a certain dimension.</li>\n<li>Values in other dimensions can be shown by <a href=\"#tooltip.formatter\">tooltip.formatter</a> or <a href=\"#series.label.formatter\">series.label.formatter</a>.</li>\n</ul>\n</li>\n</ul>\n<p>Especially, when there is one and only one category axis (axis.type is <code>&#39;category&#39;</code>), data can be simply be represented by a one-dimension array, like:</p>\n<pre><code class=\"lang-js\">xAxis: {\n    data: [&#39;a&#39;, &#39;b&#39;, &#39;m&#39;, &#39;n&#39;]\n},\nseries: [{\n    // Each item corresponds to each item in xAxis.data.\n    data: [23,  44,  55,  19]\n    // In fact, it is the simplification of the format below:\n    // data: [[0, 23], [1, 44], [2, 55], [3, 19]]\n}]\n</code></pre>\n<p><br>\n<strong>Relationship between &quot;value&quot; and <a href=\"#xAxis.type\">axis.type</a></strong></p>\n<ul>\n<li><p>When a dimension corresponds to a value axis (axis.type is <code>&#39;value&#39;</code> or <code>&#39;log&#39;</code>):</p>\n<p>  The value can be a <code>number</code> (like <code>12</code>) (can also be a number in a <code>string</code> format, like <code>&#39;12&#39;</code>).</p>\n</li>\n<li><p>When a dimension corresponds to a category axis (axis.type is <code>&#39;category&#39;</code>):</p>\n<p>  The value should be the ordinal of the axis.data (based on <code>0</code>), the string value of the axis.data. For example:</p>\n<pre><code class=\"lang-js\">  xAxis: {\n      type: &#39;category&#39;,\n      data: [&#39;Monday&#39;, &#39;Tuesday&#39;, &#39;Wednesday&#39;, &#39;Thursday&#39;]\n  },\n  yAxis: {\n      type: &#39;category&#39;,\n      data: [&#39;a&#39;, &#39;b&#39;, &#39;m&#39;, &#39;n&#39;, &#39;p&#39;, &#39;q&#39;]\n  },\n  series: [{\n      data: [\n          // xAxis      yAxis\n          [  0,           0,    2  ], // This point is located at xAxis: &#39;Monday&#39;, yAxis: &#39;a&#39;.\n          [  &#39;Thursday&#39;,  2,    1  ], // This point is located at xAxis: &#39;Thursday&#39;, yAxis: &#39;m&#39;.\n          [  2,          &#39;p&#39;,   2  ], // This point is located at xAxis: &#39;Wednesday&#39;, yAxis: &#39;p&#39;.\n          [  3,           3,    5  ]\n      ]\n  }]\n</code></pre>\n<p>  There is an example of double category axes: <a href=\"http://echarts.baidu.com/gallery/editor.html?c=scatter-punchCard\" target=\"_blank\">Github Punchcard</a>.</p>\n</li>\n<li><p>When a dimension corresponds to a time axis (type is <code>&#39;time&#39;</code>), the value can be:</p>\n<ul>\n<li>a timestamp, like <code>1484141700832</code>, which represents a UTC time.</li>\n<li>a date string, in one of the formats below:<ul>\n<li>a subset of <a href=\"http://www.ecma-international.org/ecma-262/5.1/#sec-15.9.1.15\" target=\"_blank\">ISO 8601</a>, only including (all of these are treated as local time unless timezone is specified, which is consistent with <a href=\"https://momentjs.com/\" target=\"_blank\">moment</a>):<ul>\n<li>only part of year/month/date/time are specified: <code>&#39;2012-03&#39;</code>, <code>&#39;2012-03-01&#39;</code>, <code>&#39;2012-03-01 05&#39;</code>, <code>&#39;2012-03-01 05:06&#39;</code>.</li>\n<li>separated by <code>&quot;T&quot;</code> or a space: <code>&#39;2012-03-01T12:22:33.123&#39;</code>, <code>&#39;2012-03-01 12:22:33.123&#39;</code>.</li>\n<li>timezone specified: <code>&#39;2012-03-01T12:22:33Z&#39;</code>, <code>&#39;2012-03-01T12:22:33+8000&#39;</code>, <code>&#39;2012-03-01T12:22:33-05:00&#39;</code>.</li>\n</ul>\n</li>\n<li>other date string format (all of these are treated as local time):\n<code>&#39;2012&#39;</code>, <code>&#39;2012-3-1&#39;</code>, <code>&#39;2012/3/1&#39;</code>, <code>&#39;2012/03/01&#39;</code>,\n<code>&#39;2009/6/12 2:00&#39;</code>, <code>&#39;2009/6/12 2:05:08&#39;</code>, <code>&#39;2009/6/12 2:05:08.123&#39;</code>.</li>\n</ul>\n</li>\n<li>a JavaScript Date instance created by user:<ul>\n<li>Caution, when using a data string to create a Date instance, <a href=\"http://dygraphs.com/date-formats.html\" target=\"_blank\">browser differences and inconsistencies</a> should be considered.</li>\n<li>For example: In chrome, <code>new Date(&#39;2012-01-01&#39;)</code> is treated as a Jan 1st 2012 in UTC, while <code>new Date(&#39;2012-1-1&#39;)</code> and <code>new Date(&#39;2012/01/01&#39;)</code> are treated as Jan 1st 2012 in local timezone. In safari <code>new Date(&#39;2012-1-1&#39;)</code> is not supported.</li>\n<li>So if you intent to perform <code>new Date(dateString)</code>, it is strongly recommended to use a time parse library (e.g., <a href=\"https://momentjs.com/\" target=\"_blank\">moment</a>), or use <code>echarts.number.parseDate</code>, or check <a href=\"http://dygraphs.com/date-formats.html\" target=\"_blank\">this</a>.</li>\n</ul>\n</li>\n</ul>\n</li>\n</ul>\n<p><br>\n<strong>Customize a data item:</strong></p>\n<p>When needing to customize a data item, it can be set as an object, where property <code>value</code> reprensent real value. For example:</p>\n<pre><code class=\"lang-js\">[\n    12,\n    24,\n    {\n        value: [24, 32],\n        // label style, only works in this data item.\n        label: {},\n        // item style, only works in this data item.\n        itemStyle:{}\n    },\n    33\n]\n// Or\n[\n    [12, 332],\n    [24, 32],\n    {\n        value: [24, 32],\n        // label style, only works in this data item.\n        label: {},\n        // item style, only works in this data item.\n        itemStyle:{}\n    },\n    [33, 31]\n]\n</code></pre>\n<p><br>\n<strong>Empty value:</strong></p>\n<p><code>&#39;-&#39;</code> or <code>null</code> or <code>undefined</code> or <code>NaN</code> can be used to describe that a data item is not exists (ps：<em>not exist</em> does not means its value is <code>0</code>).</p>\n<p>For example, line chart can break when encounter an empty value, and scatter chart do not display graphic elements for empty values.</p>\n<p><br><br></p>\n","items":{"type":"Object","properties":{"symbol":{"type":["string"],"default":"'circle'"},"symbolSize":{"type":["number","Array"],"default":4},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"label":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"inside"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"tooltip":{"type":["*"],"description":"<p>tooltip settings in this series data.</p>\n","properties":{"position":{"type":["string","Array"]},"formatter":{"type":["string","Function"]},"backgroundColor":{"type":["Color"],"default":"'rgba(50,50,50,0.7)'"},"borderColor":{"type":["Color"],"default":"'#333'"},"borderWidth":{"type":["number"],"default":0},"padding":{"type":["number"],"default":5},"textStyle":{"type":["Object"],"description":"<blockquote>\n<p><strong>Notice：</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code>&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The text syle of tooltip&#39;s floating layer.</p>\n","properties":{"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":14},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"extraCssText":{"type":["string"]}}}}}},"markPoint":{"type":["Object"],"description":"<p>Mark point in a chart.</p>\n","properties":{"symbol":{"type":["string"],"default":"'pin'"},"symbolSize":{"type":["number","Array","Function"],"default":50},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"silent":{"type":["boolean"],"default":false},"label":{"type":["Object"],"description":"<p>Label of mark point.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Mark point style.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["Array"],"description":"<p>Data array for mark points, each of which is an object. Here are some ways to assign mark point position.</p>\n<ol>\n<li><p>Assign coordinate according to container with <a href=\"#series-effectScatter.markPoint.data.x\">x</a>, <a href=\"#series-effectScatter.markPoint.data.y\">y</a> attribute, in which pixel values and percentage are supported.</p>\n</li>\n<li><p>Assign coordinate position with <a href=\"#series-effectScatter.markPoint.data.coord\">coord</a> attribute, in which <code>&#39;min&#39;</code>, <code>&#39;max&#39;</code>, <code>&#39;average&#39;</code> are supported for each dimension.</p>\n</li>\n<li><p>Use <a href=\"#series-effectScatter.markPoint.data.type\">type</a> attribute to mark the maximum and minimum values in the series, in which <a href=\"#series-effectScatter.markPoint.data.valueIndex\">valueIndex</a> or <a href=\"#series-effectScatter.markPoint.data.valueDim\">valueDim</a> can be used to assign the dimension.</p>\n</li>\n</ol>\n<p>When multiple attributes exist, priority is as the above order.</p>\n<p><strong>For example: </strong></p>\n<pre><code class=\"lang-js\">data: [\n    {\n        name: &#39;maximum&#39;,\n        type: &#39;max&#39;\n    }, \n    {\n        name: &#39;coordinate&#39;,\n        coord: [10, 20]\n    }, {\n        name: &#39;fixed x position&#39;,\n        yAixs: 10,\n        x: &#39;90%&#39;\n    }, \n    {\n        name: &#39;screen coordinate&#39;,\n        x: 100,\n        y: 100\n    }\n]\n</code></pre>\n","items":{"type":"Object","properties":{"name":{"type":["string"],"default":"''"},"type":{"type":["string"]},"valueIndex":{"type":["number"]},"valueDim":{"type":["string"]},"coord":{"type":["Array"]},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"itemStyle":{"type":["Object"],"description":"<p>Mark point style.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"markLine":{"type":["*"],"description":"<p>Use a line in the chart to illustrate.</p>\n","properties":{"silent":{"type":["boolean"],"default":false},"symbol":{"type":["string","Array"]},"symbolSize":{"type":["number","Array"]},"precision":{"type":["number"],"default":2},"label":{"type":["Object"],"description":"<p>Mark line text.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]}}}}},"lineStyle":{"type":["Object"],"description":"<p>Mark line style.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["*"],"description":"<p>Data array of marking line. Every array item can be an array of one or two values, representing starting and ending point of the line, and every item is an object. Here are several ways to assign the positions of starting and ending point.</p>\n<ol>\n<li><p>Assign coordinate according to container with <a href=\"#series-effectScatter.markLine.data.0.x\">x</a>, <a href=\"#series-effectScatter.markLine.data.0.y\">y</a> attribute, in which pixel values and percentage are supported.</p>\n</li>\n<li><p>Assign coordinate position with <a href=\"#series-effectScatter.markLine.data.0.coord\">coord</a> attribute, in which <code>&#39;min&#39;</code>, <code>&#39;max&#39;</code>, <code>&#39;average&#39;</code> are supported for each dimension.</p>\n</li>\n<li><p>Use <a href=\"#series-effectScatter.markLine.data.0.type\">type</a> attribute to mark the maximum and minimum values in the series, in which <a href=\"#series-effectScatter.markLine.data.0.valueIndex\">valueIndex</a> or <a href=\"#series-effectScatter.markLine.data.0.valueDim\">valueDim</a> can be used to assign the dimension.</p>\n</li>\n<li><p>You may also create a mark line in Cartesian coordinate at a specific position in X or Y axis by assigning <code>xAxis</code> or <code>yAxis</code>. See <a href=\"http://echarts.baidu.com/gallery/editor.html?c=scatter-weight\" target=\"_blank\">scatter-weight</a> for example.</p>\n</li>\n</ol>\n<p>When multiple attributes exist, priority is as the above order.</p>\n<p>You may also set the type of mark line through <code>type</code>, stating whether it is for the maximum value or average value. Likewise, dimensions can be assigned through <code>valueIndex</code>.</p>\n<pre><code>data: [\n    {\n        name: &#39;average line&#39;,\n        // &#39;average&#39;, &#39;min&#39;, and &#39;max&#39; are supported\n        type: &#39;average&#39;\n    },\n    {\n        name: &#39;Horizontal line with Y value at 100&#39;,\n        yAxis: 100\n    },\n    [\n        {\n            // Use the same name with starting and ending point\n            name: &#39;Minimum to Maximum&#39;,\n            type: &#39;min&#39;\n        },\n        {\n            type: &#39;max&#39;\n        }\n    ],\n    [\n        {\n            name: &#39;Markline between two points&#39;,\n            coord: [10, 20]\n        },\n        {\n            coord: [20, 30]\n        }\n    ], [{\n        // Mark line with a fixed X position in starting point. This is used to generate an arrow pointing to maximum line.\n        yAxis: &#39;max&#39;,\n        x: &#39;90%&#39;\n    }, {\n        type: &#39;max&#39;\n    }],\n    [\n        {\n            name: &#39;Mark line between two points&#39;,\n            x: 100,\n            y: 100\n        },\n        {\n            x: 500,\n            y: 200\n        }\n    ]\n]\n</code></pre>","properties":{"0":{"type":["Object"],"description":"<p>Data of the starting point.</p>\n","properties":{"type":{"type":["string"]},"valueIndex":{"type":["number"]},"valueDim":{"type":["string"]},"coord":{"type":["Array"]},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"lineStyle":{"type":["Object"],"description":"<p>Line style of this data item, which will be merged with <code>lineStyle</code> of starting point and ending point.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0}}}}},"label":{"type":["Object"],"description":"<p>Label of this data item, which will be merged with <code>label</code> of starting point and ending point.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]}}}}}}},"1":{"type":["Object"],"description":"<p>Data of the ending point.</p>\n","properties":{"type":{"type":["string"]},"valueIndex":{"type":["number"]},"valueDim":{"type":["string"]},"coord":{"type":["Array"]},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"lineStyle":{"type":["Object"],"description":"<p>Line style of this data item, which will be merged with <code>lineStyle</code> of starting point and ending point.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0}}}}},"label":{"type":["Object"],"description":"<p>Label of this data item, which will be merged with <code>label</code> of starting point and ending point.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]}}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"markArea":{"type":["Object"],"description":"<p>Used to mark an area in chart. For example, mark a time interval.</p>\n","properties":{"silent":{"type":["boolean"],"default":false},"label":{"type":["Object"],"description":"<p>Label in mark area.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Style of the mark area.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["*"],"description":"<p>The scope of the area is defined by <code>data</code>, which is an array with two item, representing the left-top point and the right-bottom point of rectangle area. Each item can be defined as follows:</p>\n<ol>\n<li><p>Specify the coordinate in screen coordinate system using <a href=\"#series-effectScatter.markArea.data.0.x\">x</a>, <a href=\"#series-effectScatter.markArea.data.0.y\">y</a>, where the unit is pixel (e.g., the value is <code>5</code>), or percent (e.g., the value is <code>&#39;35%&#39;</code>).</p>\n</li>\n<li><p>Specify the coordinate in data coordinate system (i.e., cartesian) using\n<a href=\"#series-effectScatter.markArea.data.0.coord\">coord</a>, which can be also set as <code>&#39;min&#39;</code>, <code>&#39;max&#39;</code>, <code>&#39;average&#39;</code> (e.g, <code>coord: [23, &#39;min&#39;]</code>, or <code>coord: [&#39;average&#39;, &#39;max&#39;]</code>)。</p>\n</li>\n</ol>\n<ol>\n<li>Locate the point on the min value or max value of <code>series.data</code> using <a href=\"#series-effectScatter.markArea.data.0.type\">type</a>, where <a href=\"#series-effectScatter.markArea.data.0.valueIndex\">valueIndex</a> or <a href=\"#series-effectScatter.markPoint.data.0.valueDim\">valueDim</a> can be used to specify the dimension on which the min, max or average are calculated.</li>\n<li>If in cartesian, you can only specify <code>xAxis</code> or <code>yAxis</code> to define a mark area based on only X or Y axis, see sample <a href=\"http://echarts.baidu.com/gallery/editor.html?c=scatter-weight\" target=\"_blank\">scatter-weight</a></li>\n</ol>\n<p>The priority follows as above if more than one above definition used.</p>\n<pre><code>data: [\n\n    [\n        {\n            name: &#39;From average to max&#39;,\n            type: &#39;average&#39;\n        },\n        {\n            type: &#39;max&#39;\n        }\n    ],\n\n    [\n        {\n            name: &#39;Mark area between two points in data coordiantes&#39;,\n            coord: [10, 20]\n        },\n        {\n            coord: [20, 30]\n        }\n    ], [\n        {\n            name: &#39;From 60 to 80&#39;,\n            yAxis: 60\n        },\n        {\n            yAxis: 80\n        }\n    ], [\n        {\n            name: &#39;Mark area covers all data&#39;\n            coord: [&#39;min&#39;, &#39;min&#39;]\n        },\n        {\n            coord: [&#39;max&#39;, &#39;max&#39;]\n        }\n    ],\n    [\n        {\n            name: &#39;Mark area in two screen points&#39;,\n            x: 100,\n            y: 100\n        }, {\n            x: &#39;90%&#39;,\n            y: &#39;10%&#39;\n        }\n    ]\n]\n</code></pre>","properties":{"0":{"type":["Object"],"description":"<p>Specify the left-top point.</p>\n","properties":{"type":{"type":["string"]},"valueIndex":{"type":["number"]},"valueDim":{"type":["string"]},"coord":{"type":["Array"]},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"itemStyle":{"type":["Object"],"description":"<p>Style of the item.\n<code>itemStyle</code> of start point and end point will be merged together.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"<p>Label style of the item.\nLabel style of start point and end point will be merged together.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}},"1":{"type":["Object"],"description":"<p>Specify the right-bottom point.</p>\n","properties":{"type":{"type":["string"]},"valueIndex":{"type":["number"]},"valueDim":{"type":["string"]},"coord":{"type":["Array"]},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"itemStyle":{"type":["Object"],"description":"<p>Style of the item.\n<code>itemStyle</code> of start point and end point will be merged together.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"<p>Label style of the item.\nLabel style of start point and end point will be merged together.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"zlevel":{"type":["number"],"default":0},"z":{"type":["number"],"default":2},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0},"tooltip":{"type":["*"],"description":"<p>tooltip settings in this series.</p>\n","properties":{"position":{"type":["string","Array"]},"formatter":{"type":["string","Function"]},"backgroundColor":{"type":["Color"],"default":"'rgba(50,50,50,0.7)'"},"borderColor":{"type":["Color"],"default":"'#333'"},"borderWidth":{"type":["number"],"default":0},"padding":{"type":["number"],"default":5},"textStyle":{"type":["Object"],"description":"<p><br></p>\n<blockquote>\n<p><strong>Notice：</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code>&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The text syle of tooltip&#39;s floating layer.</p>\n","properties":{"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":14},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"extraCssText":{"type":["string"]}}}}},{"type":["Object"],"description":"<p><strong>radar chart</strong></p>\n<p>Radar chart is mainly used to show multi-variable data, such as the analysis of a football player&#39;s varied attributes. It relies <a href=\"#radar\">radar</a> component.</p>\n<p>Here is the example of AQI data which is presented in radar chart.</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=radar-aqi&edit=1&reset=1\" width=\"600\" height=\"500\" ></iframe>\n\n\n","properties":{"type":{"type":["string"],"default":"'radar'"},"id":{"type":["string"]},"name":{"type":["string"]},"radarIndex":{"type":["number"]},"symbol":{"type":["string"],"default":"'circle'"},"symbolSize":{"type":["number","Array","Function"],"default":4},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"label":{"type":["Object"],"description":"<p>Text label of , to explain some data information about graphic item like value, name and so on. <code>label</code> is placed under <code>itemStyle</code> in ECharts 2.x. In ECharts 3, to make the configuration structure flatter, <code>label</code>is taken to be at the same level with <code>itemStyle</code>, and has <code>emphasis</code> as <code>itemStyle</code> does.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"'top'"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Item style of the inflection point of the lines.</p>\n","properties":{"color":{"type":["Color","Function"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"lineStyle":{"type":["Object"],"description":"<p>Line style.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"areaStyle":{"type":["Object"],"description":"<p>Area filling style.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["Array"],"description":"<p>The data in radar chart is multi-variable (dimension). Here is an example:</p>\n<pre><code class=\"lang-js\">data : [\n    {\n        value : [4300, 10000, 28000, 35000, 50000, 19000],\n        name : &#39;Allocated Budget&#39;\n    },\n    {\n        value : [5000, 14000, 28000, 31000, 42000, 21000],\n        name : &#39;Actual Spending&#39;\n    }\n]\n</code></pre>\n<p>Among them, <code>value</code> item array contains data that is corresponding to <a href=\"#radar.indicator\">radar.indicator</a>.</p>\n","items":{"type":"Object","properties":{"name":{"type":["string"]},"value":{"type":["number"]},"symbol":{"type":["string"],"default":"'circle'"},"symbolSize":{"type":["number","Array"],"default":4},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"label":{"type":["Object"],"description":"<p>Style setting of the text on single inflection point.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"top"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Style setting of the symbol on single inflection point.</p>\n","properties":{"color":{"type":["Color"],"default":"'auto'"},"barBorderColor":{"type":["Color"],"default":"'#000'"},"barBorderWidth":{"type":["number"],"default":0},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"'auto'"},"barBorderColor":{"type":["Color"],"default":"'#000'"},"barBorderWidth":{"type":["number"],"default":0},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"lineStyle":{"type":["Object"],"description":"<p>Line style of a single item.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"areaStyle":{"type":["Object"],"description":"<p>Area filling style of a single item.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"tooltip":{"type":["*"],"description":"<p>tooltip settings in this series data.</p>\n","properties":{"position":{"type":["string","Array"]},"formatter":{"type":["string","Function"]},"backgroundColor":{"type":["Color"],"default":"'rgba(50,50,50,0.7)'"},"borderColor":{"type":["Color"],"default":"'#333'"},"borderWidth":{"type":["number"],"default":0},"padding":{"type":["number"],"default":5},"textStyle":{"type":["Object"],"description":"<blockquote>\n<p><strong>Notice：</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code>&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The text syle of tooltip&#39;s floating layer.</p>\n","properties":{"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":14},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"extraCssText":{"type":["string"]}}}}}},"zlevel":{"type":["number"],"default":0},"z":{"type":["number"],"default":2},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0},"tooltip":{"type":["*"],"description":"<p>tooltip settings in this series.</p>\n","properties":{"position":{"type":["string","Array"]},"formatter":{"type":["string","Function"]},"backgroundColor":{"type":["Color"],"default":"'rgba(50,50,50,0.7)'"},"borderColor":{"type":["Color"],"default":"'#333'"},"borderWidth":{"type":["number"],"default":0},"padding":{"type":["number"],"default":5},"textStyle":{"type":["Object"],"description":"<p><br></p>\n<blockquote>\n<p><strong>Notice：</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code>&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The text syle of tooltip&#39;s floating layer.</p>\n","properties":{"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":14},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"extraCssText":{"type":["string"]}}}}},{"type":["Object"],"description":"<p><strong>Tree Diagram</strong></p>\n<p>The tree diagram is mainly used to visualize the tree data structure, which is a special hierarchical type with a unique root node, left subtree, and right subtree.</p>\n<p><strong>Note: Forests are not currently supported directly in a single series, and can be implemented by configuring multiple series in an option</strong></p>\n<p><strong>Tree example：</strong></p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=tree-vertical&edit=1&reset=1\" width=\"900\" height=\"780\" ></iframe>\n\n\n<p><strong>Multiple series are combined into forest：</strong></p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=tree-legend&edit=1&reset=1\" width=\"800\" height=\"680\" ></iframe>\n\n","properties":{"type":{"type":["string"],"default":"'tree'"},"id":{"type":["string"]},"name":{"type":["string"]},"zlevel":{"type":["number"],"default":0},"z":{"type":["number"],"default":2},"left":{"type":["string","number"],"default":"12%"},"top":{"type":["string","number"],"default":"12%"},"right":{"type":["string","number"],"default":"12%"},"bottom":{"type":["string","number"],"default":"12%"},"width":{"type":["string","number"],"default":null},"height":{"type":["string","number"],"default":null},"layout":{"type":["string"],"default":"'orthogonal'"},"orient":{"type":["string"],"default":"'LR'"},"symbol":{"type":["string"],"default":"'emptyCircle'"},"symbolSize":{"type":["number","Array","Function"],"default":7},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"expandAndCollapse":{"type":["boolean"],"default":true},"initialTreeDepth":{"type":["number"],"default":2},"itemStyle":{"type":["Object"],"description":"<p>The style of each node in the tree, where [itemStyle.color] (~ series-tree.itemStyle.color) represents the fill color of the node, to distinguish the state of the subtree corresponding to <code>collapsing</code> or <code>expansion</code>.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"'#c23531'"},"borderWidth":{"type":["number"],"default":1.5},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"<p><code>label</code> describes the style of the text corresponding to each node.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"lineStyle":{"type":["Object"],"description":"<p>Defines the style of the tree edge.</p>\n","properties":{"color":{"type":["Color"],"default":"\"'#ccc'\""},"width":{"type":["number"],"default":1.5},"curveness":{"type":["number"],"default":0.5},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"'#ccc'\""},"width":{"type":["number"],"default":1.5},"curveness":{"type":["number"],"default":0.5},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0}}}}},"leaves":{"type":["Object"],"description":"<p>Leaf node special configuration, such as the above tree diagram example, the leaf node and non-leaf node label location is different.</p>\n","properties":{"label":{"type":["Object"],"description":"<p>Describes the style of the text label corresponding to the leaf node.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>The style of the leaf node in the tree.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}}}},"data":{"type":["Object"],"description":"<p><a href=\"#series-tree.data\">series-tree.data</a> the data format is a tree structure，for example：</p>\n<pre><code class=\"lang-javascript\">{ // note that the outermost layer is an object that represents the root node of the tree.\n    name: &quot;flare&quot;,    // the name of the node, the text corresponding to the current node label.\n    label: {          // the special label configuration (if necessary).\n        ...           // the format of the label is shown in the series-tree.label.\n    },\n    itemStyle: {      // the special itemStyle configuration (if necessary).\n        ...           // the format of the itemstyle is shown in the series-tree.itemStyle。\n    },\n    children: [\n        {\n            name: &quot;flex&quot;,\n            value: 4116,    // value, which only displayed in tooltip.\n            label: {\n                ...\n            },\n            itemStyle: {\n                ...\n            },\n            collapsed: null, // If set as `true`, the node is collpased in the initialization.\n            children: [...]  // leaf nodes do not have children, can not write.\n        },\n        ...\n    ]\n};\n</code></pre>\n","properties":{"name":{"type":["string"]},"value":{"type":["number"]},"itemStyle":{"type":["Object"],"description":"<p>The style of the node.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"<p>The label of the node.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"tooltip":{"type":["*"],"description":"<p>tooltip settings in this series data.</p>\n","properties":{"position":{"type":["string","Array"]},"formatter":{"type":["string","Function"]},"backgroundColor":{"type":["Color"],"default":"'rgba(50,50,50,0.7)'"},"borderColor":{"type":["Color"],"default":"'#333'"},"borderWidth":{"type":["number"],"default":0},"padding":{"type":["number"],"default":5},"textStyle":{"type":["Object"],"description":"<blockquote>\n<p><strong>Notice：</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code>&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The text syle of tooltip&#39;s floating layer.</p>\n","properties":{"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":14},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"extraCssText":{"type":["string"]}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"'linear'"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"tooltip":{"type":["*"],"description":"<p>tooltip settings in this series.</p>\n","properties":{"position":{"type":["string","Array"]},"formatter":{"type":["string","Function"]},"backgroundColor":{"type":["Color"],"default":"'rgba(50,50,50,0.7)'"},"borderColor":{"type":["Color"],"default":"'#333'"},"borderWidth":{"type":["number"],"default":0},"padding":{"type":["number"],"default":5},"textStyle":{"type":["Object"],"description":"<p><br></p>\n<blockquote>\n<p><strong>Notice：</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code>&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The text syle of tooltip&#39;s floating layer.</p>\n","properties":{"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":14},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"extraCssText":{"type":["string"]}}}}},{"type":["Object"],"description":"<p><a href=\"https://en.wikipedia.org/wiki/Treemapping\" target=\"_blank\">Treemap</a> is a common way to present &quot;hierarchical data&quot; or &quot;tree data&quot;.It primarily highlights the important nodes at all hierarchies in 『Tree』with area.</p>\n<p><strong>Example:</strong></p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=treemap-obama&edit=1&reset=1\" width=\"700\" height=\"580\" ></iframe>\n\n\n\n<p><br>\n<strong>Visual Mapping:</strong></p>\n<p>treemap maps the numerical values to area.</p>\n<p>Moreover, it is able to map some dimensions of data to other visual channel, like colors, lightness of colors and etc.</p>\n<p>About visual encoding, see details in <a href=\"#series-treemap.levels\">series-treemap.levels</a>.</p>\n<p><br>\n<strong>Drill Down:</strong></p>\n<p>The feature <code>drill down</code> means: when clicking a tree node, this node will be set as root and its children will be shown. When <a href=\"#series-treemap.leafDepth\">leafDepth</a> is set, this feature is enabled.</p>\n<p><strong>An example about drill down:</strong></p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=treemap-drill-down&edit=1&reset=1\" width=\"800\" height=\"500\" ></iframe>\n\n\n<p><br>\n<br>\n<br>\nNotice: There are some difference in treemap configuration between ECharts3 and ECharts2. Some immature configuration ways are no longer supported:</p>\n<ul>\n<li><p>The position method using <code>center/size</code> is no longer supported, and <code>left/top/bottom/right/width/height</code> are used to position treemap, as other components do.</p>\n</li>\n<li><p>The configuration item <code>breadcrumb</code> is moved outside <code>itemStyle/itemStyle.emphasis</code>, and it is in the same level with <code>itemStyle</code> now.</p>\n</li>\n<li><p>The configuration item <code>root</code> is not avaliable temporarily.User can zoom treemap to see some tiny or deep descendants, or using <a href=\"#series-treemap.leafDepth\">leafDepth</a> to enable the feature of &quot;drill down&quot;.</p>\n</li>\n<li><p>The configuration item <code>label</code> is moved outside the <code>itemStyle/itemStyle.emphasis</code>, and it is in the same level with <code>itemStyle</code> now.</p>\n</li>\n<li><p>The configuration items <code>itemStyle.childBorderWidth</code> and <code>itemStyle.childBorderColor</code> are not supported anymore (because in this way only 2 levels can be defined). <a href=\"#series-treemap.levels\">series-treemap.levels</a> is used to define all levels now.</p>\n</li>\n</ul>\n<p><br>\n<br></p>\n","properties":{"type":{"type":["string"],"default":"'treemap'"},"id":{"type":["string"]},"name":{"type":["string"]},"zlevel":{"type":["number"],"default":0},"z":{"type":["number"],"default":2},"left":{"type":["string","number"],"default":"center"},"top":{"type":["string","number"],"default":"middle"},"right":{"type":["string","number"],"default":"'auto'"},"bottom":{"type":["string","number"],"default":"'auto'"},"width":{"type":["string","number"],"default":"80%"},"height":{"type":["string","number"],"default":"80%"},"squareRatio":{"type":["number"]},"leafDepth":{"type":["number"],"default":null},"drillDownIcon":{"type":["string"],"default":"'▶'"},"roam":{"type":["boolean","string"],"default":true},"nodeClick":{"type":["boolean","string"],"default":"'zoomToNode'"},"zoomToNodeRatio":{"type":["number"],"default":"0.32*0.32"},"levels":{"type":["Array"],"description":"<p><strong>Multiple Levels Configuration</strong></p>\n<p>treemap adopts 4-level configuration:</p>\n<pre><code>&quot;each node&quot; --&gt; &quot;each level&quot; --&gt; &quot;each series&quot;.\n</code></pre><p>That is, we can configurate each node, can also configurate each level of the tree, or set overall configurations on each series. The highest priority is node configuration.</p>\n<p><code>levels</code> is configurations on each levels, which is used most.</p>\n<p>For example:</p>\n<pre><code class=\"lang-javascript\">// Notice that in fact the data structure is not &quot;tree&quot;, but is &quot;forest&quot;.\ndata: [\n    {\n        name: &#39;nodeA&#39;,\n        children: [\n            {name: &#39;nodeAA&#39;},\n            {name: &#39;nodeAB&#39;},\n        ]\n    },\n    {\n        name: &#39;nodeB&#39;,\n        children: [\n            {name: &#39;nodeBA&#39;}\n        ]\n    }\n],\nlevels: [\n    {...}, // configurations of the top level of the data structure &quot;forest&quot;\n        // (the level that contains &#39;nodeA&#39;, &#39;nodeB&#39; shown above).\n    {...}, // configurations of the next level\n        // (the level that contains &#39;nodeAA&#39;, &#39;nodeAB&#39;, &#39;nodeBA&#39; shown above)\n    {...}, // configurations of the next level\n    ...\n]\n</code></pre>\n<p><br>\n<strong>The Rules about Visual Mapping</strong></p>\n<p>When designing a treemap, we primarily focus on how to visually distinguish &quot;different levels&quot;, &quot;different categories in the same level&quot;, which requires appropriate settings of &quot;rectangular color&quot;, &quot;border thickness&quot;, &quot;border color&quot; and even &quot;color saturation of rectangular&quot; and so on on each level.</p>\n<p>See <a href=\"http://echarts.baidu.com/gallery/editor.html?c=treemap-disk&amp;edit=1&amp;reset=1\" target=\"_blank\">example</a>. The top level is divided into several parts by colors &quot;red&quot;, &quot;green&quot;, &quot;blue&quot;, and etc ... In each color block, <code>colorSaturation</code> is used to distinguish nodes in sublevel. The border color of the top level is &quot;white&quot;, while the border color of the sublevel is the color that based on the current block color and processed by <code>borderColorSaturation</code>.</p>\n<p><code>treemap</code> uses this rule of visual configuration: each level computes its visual value based on the configurations (<code>color</code>, <code>colorSaturation</code>, <code>borderColor</code>, <code>colorSaturation</code>) on this level. If there is no certain configuration in a node, it inherits the configuration from its parent.</p>\n<p>In this way, this effect can be configured: set a <code>color</code> list on the parent level, and set <code>colorSaturation</code> on the child level, and then each node in the parent level would obtain a color from the <code>color</code> list, and each node in the child level would obtain a value from <code>colorSaturation</code> and compound it with the color inherited from its parent node to get its final color.</p>\n<p><br>\n<strong>Dimensions and &quot;Extra Visual Mapping&quot;</strong></p>\n<p>See the example below: every <code>value</code> field is set as an Array, in which each item in the array represents a dimension respectively.</p>\n<pre><code class=\"lang-javascript\">[\n    {\n        value: [434, 6969, 8382],\n        children: [\n            {\n                value: [1212, 4943, 5453],\n                id: &#39;someid-1&#39;,\n                name: &#39;description of this node&#39;,\n                children: [...]\n            },\n            {\n                value: [4545, 192, 439],\n                id: &#39;someid-2&#39;,\n                name: &#39;description of this node&#39;,\n                children: [...]\n            },\n            ...\n        ]\n    },\n    {\n        value: [23, 59, 12],\n        children: [...]\n    },\n    ...\n]\n</code></pre>\n<p><code>treemap</code> will map the first dimension (the first item of the array) to &quot;area&quot;. If we want to express more information, we could map another dimension (specified by <a href=\"#series-treemap.viusalDimension\">series-treemap.visualDimension</a>) to another visual types, such as <code>colorSaturation</code> and so on. See the <a href=\"http://echarts.baidu.com/gallery/editor.html?c=treemap-obama&amp;edit=1&amp;reset=1\" target=\"_blank\">example</a> and select the legend &#39;Growth&#39;.</p>\n<p><br></p>\n<p><strong>How to avoid confusion by setting border/gap of node</strong></p>\n<p>If all of the border/gaps are set with the same color, confusion might occur when rectangulars in different levels display at the same time.</p>\n<p>See the <a href=\"http://echarts.baidu.com/gallery/editor.html?c=doc-example/treemap-borderColor&amp;edit=1&amp;reset=1\" target=\"_blank\">example</a>. Noticed that the child rectangles in the red area are in the deeper level than rectangles that are saparated by white gap. So in the red area, basically we set gap color with red, and use <code>borderColorSaturation</code> to lift the saturation.</p>\n<p><br>\n<strong>Explanation about borderWidth, gapWidth, borderColor</strong></p>\n<p><img width=\"500\" height=\"auto\" src=\"documents/asset/img/treemap-border-gap.png\"></p>\n","default":"[]","items":{"type":"Object","properties":{"visualDimension":{"type":["number"],"default":0},"visualMin":{"type":["number"],"default":null},"visualMax":{"type":["number"],"default":null},"color":{"type":["Array"]},"colorAlpha":{"type":["Array"],"default":null},"colorSaturation":{"type":["number"],"default":null},"colorMappingBy":{"type":["string"],"default":"'index'"},"visibleMin":{"type":["number"],"default":10},"childrenVisibleMin":{"type":["number"],"default":null},"label":{"type":["Object"],"description":"<p><code>label</code> decribes the style of the label in each node.</p>\n<p><br></p>\n<blockquote>\n<p>Tps: In treemap, <code>label</code> attribute could appear in more than one places:</p>\n<ul>\n<li>It could appear in <a href=\"#series-treemap\">sereis-treemap</a>, indicating the unified setting of the series.</li>\n</ul>\n<ul>\n<li><p>It could appear in each array element of  <a href=\"#series-treemap.levels\">series-treemap.levels</a>, indicating the unified setting of each level of the tree.</p>\n</li>\n<li><p>It could appear in each node of <a href=\"#series-treemap.data\">series-treemap.data</a>, indicating the particular setting of each node.</p>\n</li>\n</ul>\n</blockquote>\n<p><br></p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"ellipsis":{"type":["boolean"],"default":true},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"ellipsis":{"type":["boolean"],"default":true}}}}},"upperLabel":{"type":["Object"],"description":"<p><code>upperLabel</code> is used to specify whether show label when the node has children. When <a href=\"#series-treemap.upperLabel.show\">upperLabel.show</a> is set as <code>true</code>, the feature that &quot;show parent label&quot; is enabled.</p>\n<p>The same as <a href=\"#series-treemap.label\">series-treemap.label</a>, the option <code>upperLabel</code> can be placed at the root of <a href=\"#series-treemap\">series-treemap</a> directly, or in <a href=\"#series-treemap.level\">series-treemap.level</a>, or in each item of <a href=\"#series-treemap.data\">series-treemap.data</a>.</p>\n<p>Specifically, <a href=\"#series-treemap.label\">series-treemap.label</a> specifies the style when a node is a leaf, while <code>upperLabel</code> specifies the style when a node has children, in which case the label is displayed in the inner top of the node.</p>\n<p>See:</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=treemap-show-parent&edit=1&reset=1\" width=\"700\" height=\"500\" ></iframe>\n\n\n\n\n<p><br></p>\n<blockquote>\n<p>Tps: In treemap, <code>label</code> attribute could appear in more than one places:</p>\n<ul>\n<li>It could appear in <a href=\"#series-treemap\">sereis-treemap</a>, indicating the unified setting of the series.</li>\n</ul>\n<ul>\n<li><p>It could appear in each array element of  <a href=\"#series-treemap.levels\">series-treemap.levels</a>, indicating the unified setting of each level of the tree.</p>\n</li>\n<li><p>It could appear in each node of <a href=\"#series-treemap.data\">series-treemap.data</a>, indicating the particular setting of each node.</p>\n</li>\n</ul>\n</blockquote>\n<p><br></p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number"],"default":20},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"ellipsis":{"type":["boolean"],"default":true},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"ellipsis":{"type":["boolean"],"default":true}}}}},"itemStyle":{"type":["Object"],"description":"<p><br></p>\n<blockquote>\n<p>Tps: In treemap, <code>itemStyle</code> attribute could appear in more than one places:</p>\n<ul>\n<li>It could appear in <a href=\"#series-treemap\">sereis-treemap</a>, indicating the unified setting of the series.</li>\n</ul>\n<ul>\n<li><p>It could appear in each array element of  <a href=\"#series-treemap.levels\">series-treemap.levels</a>, indicating the unified setting of each level of the tree.</p>\n</li>\n<li><p>It could appear in each node of <a href=\"#series-treemap.data\">series-treemap.data</a>, indicating the particular setting of each node.</p>\n</li>\n</ul>\n</blockquote>\n<p><br></p>\n","properties":{"color":{"type":["Color"],"default":null},"colorAlpha":{"type":["number"],"default":null},"colorSaturation":{"type":["number"],"default":null},"borderWidth":{"type":["number"],"default":0},"gapWidth":{"type":["number"],"default":0},"borderColor":{"type":["Color"],"default":"'#fff',"},"borderColorSaturation":{"type":["Color"],"default":null},"strokeColor":{"type":["Color"],"default":null},"strokeWidth":{"type":["number"],"default":null},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null}}}}}}}},"silent":{"type":["boolean"],"description":"<p>Whether to ignore mouse events. Default value is false, for triggering and responding to mouse events.</p>\n","default":false,"properties":{"link":{"type":["string"]},"target":{"type":["string"],"default":"'blank'"},"children":{"type":["Array"]},"tooltip":{"type":["*"],"description":"<p>tooltip settings in this series data.</p>\n","properties":{"position":{"type":["string","Array"]},"formatter":{"type":["string","Function"]},"backgroundColor":{"type":["Color"],"default":"'rgba(50,50,50,0.7)'"},"borderColor":{"type":["Color"],"default":"'#333'"},"borderWidth":{"type":["number"],"default":0},"padding":{"type":["number"],"default":5},"textStyle":{"type":["Object"],"description":"<blockquote>\n<p><strong>Notice：</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code>&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The text syle of tooltip&#39;s floating layer.</p>\n","properties":{"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":14},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"extraCssText":{"type":["string"]}}}}},"visualDimension":{"type":["number"],"default":0},"visualMin":{"type":["number"],"default":null},"visualMax":{"type":["number"],"default":null},"colorAlpha":{"type":["Array"],"default":null},"colorSaturation":{"type":["number"],"default":null},"colorMappingBy":{"type":["string"],"default":"'index'"},"visibleMin":{"type":["number"],"default":10},"childrenVisibleMin":{"type":["number"],"default":null},"label":{"type":["Object"],"description":"<p><code>label</code> decribes the style of the label in each node.</p>\n<p><br></p>\n<blockquote>\n<p>Tps: In treemap, <code>label</code> attribute could appear in more than one places:</p>\n<ul>\n<li>It could appear in <a href=\"#series-treemap\">sereis-treemap</a>, indicating the unified setting of the series.</li>\n</ul>\n<ul>\n<li><p>It could appear in each array element of  <a href=\"#series-treemap.levels\">series-treemap.levels</a>, indicating the unified setting of each level of the tree.</p>\n</li>\n<li><p>It could appear in each node of <a href=\"#series-treemap.data\">series-treemap.data</a>, indicating the particular setting of each node.</p>\n</li>\n</ul>\n</blockquote>\n<p><br></p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"ellipsis":{"type":["boolean"],"default":true},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"ellipsis":{"type":["boolean"],"default":true}}}}},"upperLabel":{"type":["Object"],"description":"<p><code>upperLabel</code> is used to specify whether show label when the node has children. When <a href=\"#series-treemap.upperLabel.show\">upperLabel.show</a> is set as <code>true</code>, the feature that &quot;show parent label&quot; is enabled.</p>\n<p>The same as <a href=\"#series-treemap.label\">series-treemap.label</a>, the option <code>upperLabel</code> can be placed at the root of <a href=\"#series-treemap\">series-treemap</a> directly, or in <a href=\"#series-treemap.level\">series-treemap.level</a>, or in each item of <a href=\"#series-treemap.data\">series-treemap.data</a>.</p>\n<p>Specifically, <a href=\"#series-treemap.label\">series-treemap.label</a> specifies the style when a node is a leaf, while <code>upperLabel</code> specifies the style when a node has children, in which case the label is displayed in the inner top of the node.</p>\n<p>See:</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=treemap-show-parent&edit=1&reset=1\" width=\"700\" height=\"500\" ></iframe>\n\n\n\n\n<p><br></p>\n<blockquote>\n<p>Tps: In treemap, <code>label</code> attribute could appear in more than one places:</p>\n<ul>\n<li>It could appear in <a href=\"#series-treemap\">sereis-treemap</a>, indicating the unified setting of the series.</li>\n</ul>\n<ul>\n<li><p>It could appear in each array element of  <a href=\"#series-treemap.levels\">series-treemap.levels</a>, indicating the unified setting of each level of the tree.</p>\n</li>\n<li><p>It could appear in each node of <a href=\"#series-treemap.data\">series-treemap.data</a>, indicating the particular setting of each node.</p>\n</li>\n</ul>\n</blockquote>\n<p><br></p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number"],"default":20},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"ellipsis":{"type":["boolean"],"default":true},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"ellipsis":{"type":["boolean"],"default":true}}}}},"itemStyle":{"type":["Object"],"description":"<p><br></p>\n<blockquote>\n<p>Tps: In treemap, <code>itemStyle</code> attribute could appear in more than one places:</p>\n<ul>\n<li>It could appear in <a href=\"#series-treemap\">sereis-treemap</a>, indicating the unified setting of the series.</li>\n</ul>\n<ul>\n<li><p>It could appear in each array element of  <a href=\"#series-treemap.levels\">series-treemap.levels</a>, indicating the unified setting of each level of the tree.</p>\n</li>\n<li><p>It could appear in each node of <a href=\"#series-treemap.data\">series-treemap.data</a>, indicating the particular setting of each node.</p>\n</li>\n</ul>\n</blockquote>\n<p><br></p>\n","properties":{"color":{"type":["Color"],"default":null},"colorAlpha":{"type":["number"],"default":null},"colorSaturation":{"type":["number"],"default":null},"borderWidth":{"type":["number"],"default":0},"gapWidth":{"type":["number"],"default":0},"borderColor":{"type":["Color"],"default":"'#fff',"},"borderColorSaturation":{"type":["Color"],"default":null},"strokeColor":{"type":["Color"],"default":null},"strokeWidth":{"type":["number"],"default":null},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null}}}}},"breadcrumb":{"type":["Object"],"description":"<p>breadcrumb, showing the path of the current node.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"left":{"type":["string","number"],"default":"'center'"},"top":{"type":["string","number"],"default":"'auto'"},"right":{"type":["string","number"],"default":"'auto'"},"bottom":{"type":["string","number"],"default":0},"height":{"type":["number"],"default":22},"emptyItemWidth":{"type":["number"],"default":25},"itemStyle":{"type":["Object"],"description":"<p>Graphic style of , <code>emphasis</code> is the style when it is highlighted, like being hovered by mouse, or highlighted via legend connect.</p>\n","properties":{"color":{"type":["Color"],"default":"rgba(0,0,0,0.7)"},"borderColor":{"type":["Color"],"default":"rgba(255,255,255,0.7)"},"borderWidth":{"type":["number"],"default":1},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"],"default":3},"shadowColor":{"type":["Color"],"default":"rgba(150,150,150,1)"},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"textStyle":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"#fff"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}},"emphasis":{"type":["*"],"description":"","properties":{"color":{"type":["Color"],"default":"rgba(0,0,0,0.7)"},"borderColor":{"type":["Color"],"default":"rgba(255,255,255,0.7)"},"borderWidth":{"type":["number"],"default":1},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"],"default":3},"shadowColor":{"type":["Color"],"default":"rgba(150,150,150,1)"},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"textStyle":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"#fff"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}}}},"data":{"type":["Array"],"description":"<p>the the data format of <a href=\"#series-treemap.data\">series-treemap.data</a> is a forest. For example:</p>\n<pre><code class=\"lang-javascript\">[ // Tips, the top level is an array.\n    {\n        value: 1212,\n        children: [\n            {\n                value: 2323,    // The value of this node, indicating the area size.\n                                // it could also be an array, such as [2323, 43, 55], in which the first item of array indicates the area size.\n                                // The other items of the array can be used for extra visual mapping. See details in series-treemp.levels.\n                id: &#39;someid-1&#39;, // id is not mandatory.\n                                // But if using API, id is used to locate node.\n                name: &#39;description of this node&#39;, // show the description text in rectangle.\n                children: [...],\n                label: {        // The label config of this node (if necessary).\n                    ...         // see series-treemap.label.\n                },\n                itemStyle: {    // the itemStyle of this node (if necessary).\n                    ...         // the see series-treemap.itemStyle.\n                }\n            },\n            {\n                value: 4545,\n                id: &#39;someid-2&#39;,\n                name: &#39;description of this node&#39;,\n                children: [\n                    {\n                        value: 5656,\n                        id: &#39;someid-3&#39;,\n                        name: &#39;description of this node&#39;,\n                        children: [...]\n                    },\n                    ...\n                ]\n            }\n        ]\n    },\n    {\n        value: [23, 59, 12]\n        // if there is no children, here could be nothing.\n    },\n    ...\n]\n</code></pre>\n","items":{"type":"Object","properties":{"value":{"type":["number","Array"]},"id":{"type":["string"]},"name":{"type":["string"]},"visualDimension":{"type":["number"],"default":0},"visualMin":{"type":["number"],"default":null},"visualMax":{"type":["number"],"default":null},"color":{"type":["Array"]},"colorAlpha":{"type":["Array"],"default":null},"colorSaturation":{"type":["number"],"default":null},"colorMappingBy":{"type":["string"],"default":"'index'"},"visibleMin":{"type":["number"],"default":10},"childrenVisibleMin":{"type":["number"],"default":null},"label":{"type":["Object"],"description":"<p><code>label</code> decribes the style of the label in each node.</p>\n<p><br></p>\n<blockquote>\n<p>Tps: In treemap, <code>label</code> attribute could appear in more than one places:</p>\n<ul>\n<li>It could appear in <a href=\"#series-treemap\">sereis-treemap</a>, indicating the unified setting of the series.</li>\n</ul>\n<ul>\n<li><p>It could appear in each array element of  <a href=\"#series-treemap.levels\">series-treemap.levels</a>, indicating the unified setting of each level of the tree.</p>\n</li>\n<li><p>It could appear in each node of <a href=\"#series-treemap.data\">series-treemap.data</a>, indicating the particular setting of each node.</p>\n</li>\n</ul>\n</blockquote>\n<p><br></p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"ellipsis":{"type":["boolean"],"default":true},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"ellipsis":{"type":["boolean"],"default":true}}}}},"upperLabel":{"type":["Object"],"description":"<p><code>upperLabel</code> is used to specify whether show label when the node has children. When <a href=\"#series-treemap.upperLabel.show\">upperLabel.show</a> is set as <code>true</code>, the feature that &quot;show parent label&quot; is enabled.</p>\n<p>The same as <a href=\"#series-treemap.label\">series-treemap.label</a>, the option <code>upperLabel</code> can be placed at the root of <a href=\"#series-treemap\">series-treemap</a> directly, or in <a href=\"#series-treemap.level\">series-treemap.level</a>, or in each item of <a href=\"#series-treemap.data\">series-treemap.data</a>.</p>\n<p>Specifically, <a href=\"#series-treemap.label\">series-treemap.label</a> specifies the style when a node is a leaf, while <code>upperLabel</code> specifies the style when a node has children, in which case the label is displayed in the inner top of the node.</p>\n<p>See:</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=treemap-show-parent&edit=1&reset=1\" width=\"700\" height=\"500\" ></iframe>\n\n\n\n\n<p><br></p>\n<blockquote>\n<p>Tps: In treemap, <code>label</code> attribute could appear in more than one places:</p>\n<ul>\n<li>It could appear in <a href=\"#series-treemap\">sereis-treemap</a>, indicating the unified setting of the series.</li>\n</ul>\n<ul>\n<li><p>It could appear in each array element of  <a href=\"#series-treemap.levels\">series-treemap.levels</a>, indicating the unified setting of each level of the tree.</p>\n</li>\n<li><p>It could appear in each node of <a href=\"#series-treemap.data\">series-treemap.data</a>, indicating the particular setting of each node.</p>\n</li>\n</ul>\n</blockquote>\n<p><br></p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number"],"default":20},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"ellipsis":{"type":["boolean"],"default":true},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"ellipsis":{"type":["boolean"],"default":true}}}}},"itemStyle":{"type":["Object"],"description":"<p><br></p>\n<blockquote>\n<p>Tps: In treemap, <code>itemStyle</code> attribute could appear in more than one places:</p>\n<ul>\n<li>It could appear in <a href=\"#series-treemap\">sereis-treemap</a>, indicating the unified setting of the series.</li>\n</ul>\n<ul>\n<li><p>It could appear in each array element of  <a href=\"#series-treemap.levels\">series-treemap.levels</a>, indicating the unified setting of each level of the tree.</p>\n</li>\n<li><p>It could appear in each node of <a href=\"#series-treemap.data\">series-treemap.data</a>, indicating the particular setting of each node.</p>\n</li>\n</ul>\n</blockquote>\n<p><br></p>\n","properties":{"color":{"type":["Color"],"default":null},"colorAlpha":{"type":["number"],"default":null},"colorSaturation":{"type":["number"],"default":null},"borderWidth":{"type":["number"],"default":0},"gapWidth":{"type":["number"],"default":0},"borderColor":{"type":["Color"],"default":"'#fff',"},"borderColorSaturation":{"type":["Color"],"default":null},"strokeColor":{"type":["Color"],"default":null},"strokeWidth":{"type":["number"],"default":null},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null}}}}}}}},"animationDuration":{"type":["number","Function"],"default":1500},"animationEasing":{"type":["string"],"default":"quinticInOut"},"animationDelay":{"type":["number","Function"],"default":0},"tooltip":{"type":["*"],"description":"<p>tooltip settings in this series.</p>\n","properties":{"position":{"type":["string","Array"]},"formatter":{"type":["string","Function"]},"backgroundColor":{"type":["Color"],"default":"'rgba(50,50,50,0.7)'"},"borderColor":{"type":["Color"],"default":"'#333'"},"borderWidth":{"type":["number"],"default":0},"padding":{"type":["number"],"default":5},"textStyle":{"type":["Object"],"description":"<p><br></p>\n<blockquote>\n<p><strong>Notice：</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code>&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The text syle of tooltip&#39;s floating layer.</p>\n","properties":{"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":14},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"extraCssText":{"type":["string"]}}}}},{"type":["Object"],"description":"<p><a href=\"https://en.wikipedia.org/wiki/Pie_chart#Ring_chart_/_Sunburst_chart_/_Multilevel_pie_chart\" target=\"_blank\">Sunburst Chart</a> is composed of multiple pie charts. From the view of data structure, inner rings are the parent nodes of outer rings. Therefore, it can show the partial-overall relationship as <a href=\"#series-pie\">Pie</a> charts, and also level relation as <a href=\"#series-treemap\">Treemap</a> charts.</p>\n<p><strong>For example:</strong></p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=sunburst-monochrome&edit=1&reset=1\" width=\"700\" height=\"500\" ></iframe>\n\n\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=sunburst-drink&edit=1&reset=1\" width=\"700\" height=\"700\" ></iframe>\n\n\n<p><strong>Data mining</strong></p>\n<p>Sunburst charts support data mining by default. That means, when a user clicks a sector, it will be used as root node, and there will be a circle in the center for return to parent node. If data mining is not needed, it can be disabled by <a href=\"#series-treemap.nodeClick\">series-sunburst.nodeClick</a>.</p>\n","properties":{"type":{"type":["string"],"default":"'sunburst'"},"id":{"type":["string"]},"name":{"type":["string"]},"zlevel":{"type":["number"],"default":0},"z":{"type":["number"],"default":2},"center":{"type":["Array"],"default":"['50%', '50%']"},"radius":{"type":["Array"],"default":"[0, '75%']"},"data":{"type":["Array"],"description":"<p>The data structure of <a href=\"#series-sunburst.data\">series-sunburst.data</a> is like tree. For example:</p>\n<pre><code class=\"lang-js\">[{\n    name: &#39;parent1&#39;,\n    value: 10,          // value of parent node can be left unset, and sum of\n                        // children values will be used in this case.\n                        // If is set, and is larger than sum of children nodes,\n                        // the reset can be used for other parts in parent.\n    children: [{\n        value: 5,\n        name: &#39;child1&#39;,\n        children: [{\n            value: 2,\n            name: &#39;grandchild1&#39;,\n            itemStyle: {\n                // every data can have its own itemStyle,\n                // which will overwrites series.itemStyle and level.itemStyle\n            },\n            label: {\n                // label style, the same to above\n            }\n        }]\n    }, {\n        value: 3,\n        name: &#39;child2&#39;\n    }],\n    itemStyle: {\n        // itemStyle of parent1, which will not be inherited for children\n    },\n    label: {\n        // label of parent1, which will not be inherited for children\n    }\n}, {\n    name: &#39;parent2&#39;,\n    value: 4\n}]\n</code></pre>\n","items":{"type":"Object","properties":{"value":{"type":["number"]},"name":{"type":["string"]},"link":{"type":["string"]},"target":{"type":["string"],"default":"'blank'"},"label":{"type":["Object"],"description":"<p><code>label</code> sets the text style for every sectors.</p>\n<p><strong>Priority: <a href=\"#series-sunburst.data.label\">series.data.label</a> &gt; <a href=\"#series-sunburst.levels.label\">series.levels.label</a> &gt; <a href=\"#series-sunburst.label\">series.label</a>.</strong></p>\n<p>Text label of , to explain some data information about graphic item like value, name and so on. <code>label</code> is placed under <code>itemStyle</code> in ECharts 2.x. In ECharts 3, to make the configuration structure flatter, <code>label</code>is taken to be at the same level with <code>itemStyle</code>, and has <code>emphasis</code> as <code>itemStyle</code> does.</p>\n","properties":{"rotate":{"type":["string","number"],"default":"'radial'"},"align":{"type":["string"],"default":"'center'"},"minAngle":{"type":["number"],"default":null},"show":{"type":["boolean"],"default":true},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Style of Sunburst sectors.</p>\n<p>Style can be set in <a href=\"#series-sunburst.itemStyle\">series.itemStyle</a> for sectors of this series, or <a href=\"#series-sunburst.levels.itemStyle\">series.levels.itemStyle</a> for the whole level, or<a href=\"#series-sunburst.data.itemStyle\">series.data.itemStyle</a> for single sector. If <a href=\"#series-sunburst.data.itemStyle\">series.data.itemStyle</a> is defined, it will cover the setting of <a href=\"#series-sunburst.itemStyle\">series.itemStyle</a> and <a href=\"#series-sunburst.levels.itemStyle\">series.levels.itemStyle</a>.</p>\n<p><strong>Priority: <a href=\"#series-sunburst.data.itemStyle\">series.data.itemStyle</a> &gt; <a href=\"#series-sunburst.levels.itemStyle\">series.levels.itemStyle</a> &gt; <a href=\"#series-sunburst.itemStyle\">series.itemStyle</a>.</strong></p>\n<p>In ECharts, <em>emphasis</em> is for styles when mouse hovers. For Sunburst charts, there are two extra states: <em>highlight</em> for highlighting items that relates to the emphasized one, and <em>downplay</em> for others when emphasizing an item. See <a href=\"#series-sunburst.highlightPolicy\">highlightPolicy</a>.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"'white'"},"borderWidth":{"type":["number"],"default":1},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"],"default":1}}},"emphasis":{"type":["Object"],"description":"<p>Item style when mouse is hovering. See <a href=\"#series-sunburst.highlightPolicy\">highlightPolicy</a>.</p>\n","properties":{"label":{"type":["Object"],"description":"<p><code>label</code> sets the text style for every sectors.</p>\n<p><strong>Priority: <a href=\"#series-sunburst.data.label\">series.data.label</a> &gt; <a href=\"#series-sunburst.levels.label\">series.levels.label</a> &gt; <a href=\"#series-sunburst.label\">series.label</a>.</strong></p>\n<p>Text label of , to explain some data information about graphic item like value, name and so on. <code>label</code> is placed under <code>itemStyle</code> in ECharts 2.x. In ECharts 3, to make the configuration structure flatter, <code>label</code>is taken to be at the same level with <code>itemStyle</code>, and has <code>emphasis</code> as <code>itemStyle</code> does.</p>\n","properties":{"rotate":{"type":["string","number"],"default":"'radial'"},"align":{"type":["string"],"default":"'center'"},"minAngle":{"type":["number"],"default":null},"show":{"type":["boolean"],"default":true},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Style of Sunburst sectors.</p>\n<p>Style can be set in <a href=\"#series-sunburst.itemStyle\">series.itemStyle</a> for sectors of this series, or <a href=\"#series-sunburst.levels.itemStyle\">series.levels.itemStyle</a> for the whole level, or<a href=\"#series-sunburst.data.itemStyle\">series.data.itemStyle</a> for single sector. If <a href=\"#series-sunburst.data.itemStyle\">series.data.itemStyle</a> is defined, it will cover the setting of <a href=\"#series-sunburst.itemStyle\">series.itemStyle</a> and <a href=\"#series-sunburst.levels.itemStyle\">series.levels.itemStyle</a>.</p>\n<p><strong>Priority: <a href=\"#series-sunburst.data.itemStyle\">series.data.itemStyle</a> &gt; <a href=\"#series-sunburst.levels.itemStyle\">series.levels.itemStyle</a> &gt; <a href=\"#series-sunburst.itemStyle\">series.itemStyle</a>.</strong></p>\n<p>In ECharts, <em>emphasis</em> is for styles when mouse hovers. For Sunburst charts, there are two extra states: <em>highlight</em> for highlighting items that relates to the emphasized one, and <em>downplay</em> for others when emphasizing an item. See <a href=\"#series-sunburst.highlightPolicy\">highlightPolicy</a>.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"'white'"},"borderWidth":{"type":["number"],"default":1},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"],"default":1}}}}},"highlight":{"type":["Object"],"description":"<p>Item style when mouse is hovering related items. See <a href=\"#series-sunburst.highlightPolicy\">highlightPolicy</a>.</p>\n","properties":{"label":{"type":["Object"],"description":"<p><code>label</code> sets the text style for every sectors.</p>\n<p><strong>Priority: <a href=\"#series-sunburst.data.label\">series.data.label</a> &gt; <a href=\"#series-sunburst.levels.label\">series.levels.label</a> &gt; <a href=\"#series-sunburst.label\">series.label</a>.</strong></p>\n<p>Text label of , to explain some data information about graphic item like value, name and so on. <code>label</code> is placed under <code>itemStyle</code> in ECharts 2.x. In ECharts 3, to make the configuration structure flatter, <code>label</code>is taken to be at the same level with <code>itemStyle</code>, and has <code>emphasis</code> as <code>itemStyle</code> does.</p>\n","properties":{"rotate":{"type":["string","number"],"default":"'radial'"},"align":{"type":["string"],"default":"'center'"},"minAngle":{"type":["number"],"default":null},"show":{"type":["boolean"],"default":true},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Style of Sunburst sectors.</p>\n<p>Style can be set in <a href=\"#series-sunburst.itemStyle\">series.itemStyle</a> for sectors of this series, or <a href=\"#series-sunburst.levels.itemStyle\">series.levels.itemStyle</a> for the whole level, or<a href=\"#series-sunburst.data.itemStyle\">series.data.itemStyle</a> for single sector. If <a href=\"#series-sunburst.data.itemStyle\">series.data.itemStyle</a> is defined, it will cover the setting of <a href=\"#series-sunburst.itemStyle\">series.itemStyle</a> and <a href=\"#series-sunburst.levels.itemStyle\">series.levels.itemStyle</a>.</p>\n<p><strong>Priority: <a href=\"#series-sunburst.data.itemStyle\">series.data.itemStyle</a> &gt; <a href=\"#series-sunburst.levels.itemStyle\">series.levels.itemStyle</a> &gt; <a href=\"#series-sunburst.itemStyle\">series.itemStyle</a>.</strong></p>\n<p>In ECharts, <em>emphasis</em> is for styles when mouse hovers. For Sunburst charts, there are two extra states: <em>highlight</em> for highlighting items that relates to the emphasized one, and <em>downplay</em> for others when emphasizing an item. See <a href=\"#series-sunburst.highlightPolicy\">highlightPolicy</a>.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"'white'"},"borderWidth":{"type":["number"],"default":1},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"],"default":1}}}}},"downplay":{"type":["Object"],"description":"<p>Item style when mouse is hovering unrelated items. See <a href=\"#series-sunburst.highlightPolicy\">highlightPolicy</a>.</p>\n","properties":{"label":{"type":["Object"],"description":"<p><code>label</code> sets the text style for every sectors.</p>\n<p><strong>Priority: <a href=\"#series-sunburst.data.label\">series.data.label</a> &gt; <a href=\"#series-sunburst.levels.label\">series.levels.label</a> &gt; <a href=\"#series-sunburst.label\">series.label</a>.</strong></p>\n<p>Text label of , to explain some data information about graphic item like value, name and so on. <code>label</code> is placed under <code>itemStyle</code> in ECharts 2.x. In ECharts 3, to make the configuration structure flatter, <code>label</code>is taken to be at the same level with <code>itemStyle</code>, and has <code>emphasis</code> as <code>itemStyle</code> does.</p>\n","properties":{"rotate":{"type":["string","number"],"default":"'radial'"},"align":{"type":["string"],"default":"'center'"},"minAngle":{"type":["number"],"default":null},"show":{"type":["boolean"],"default":true},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Style of Sunburst sectors.</p>\n<p>Style can be set in <a href=\"#series-sunburst.itemStyle\">series.itemStyle</a> for sectors of this series, or <a href=\"#series-sunburst.levels.itemStyle\">series.levels.itemStyle</a> for the whole level, or<a href=\"#series-sunburst.data.itemStyle\">series.data.itemStyle</a> for single sector. If <a href=\"#series-sunburst.data.itemStyle\">series.data.itemStyle</a> is defined, it will cover the setting of <a href=\"#series-sunburst.itemStyle\">series.itemStyle</a> and <a href=\"#series-sunburst.levels.itemStyle\">series.levels.itemStyle</a>.</p>\n<p><strong>Priority: <a href=\"#series-sunburst.data.itemStyle\">series.data.itemStyle</a> &gt; <a href=\"#series-sunburst.levels.itemStyle\">series.levels.itemStyle</a> &gt; <a href=\"#series-sunburst.itemStyle\">series.itemStyle</a>.</strong></p>\n<p>In ECharts, <em>emphasis</em> is for styles when mouse hovers. For Sunburst charts, there are two extra states: <em>highlight</em> for highlighting items that relates to the emphasized one, and <em>downplay</em> for others when emphasizing an item. See <a href=\"#series-sunburst.highlightPolicy\">highlightPolicy</a>.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"'white'"},"borderWidth":{"type":["number"],"default":1},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"],"default":1}}}}},"children":{"type":["Array"]}}}},"label":{"type":["Object"],"description":"<p><code>label</code> sets the text style for every sectors.</p>\n<p><strong>Priority: <a href=\"#series-sunburst.data.label\">series.data.label</a> &gt; <a href=\"#series-sunburst.levels.label\">series.levels.label</a> &gt; <a href=\"#series-sunburst.label\">series.label</a>.</strong></p>\n<p>Text label of , to explain some data information about graphic item like value, name and so on. <code>label</code> is placed under <code>itemStyle</code> in ECharts 2.x. In ECharts 3, to make the configuration structure flatter, <code>label</code>is taken to be at the same level with <code>itemStyle</code>, and has <code>emphasis</code> as <code>itemStyle</code> does.</p>\n","properties":{"rotate":{"type":["string","number"],"default":"'radial'"},"align":{"type":["string"],"default":"'center'"},"minAngle":{"type":["number"],"default":null},"show":{"type":["boolean"],"default":true},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Style of Sunburst sectors.</p>\n<p>Style can be set in <a href=\"#series-sunburst.itemStyle\">series.itemStyle</a> for sectors of this series, or <a href=\"#series-sunburst.levels.itemStyle\">series.levels.itemStyle</a> for the whole level, or<a href=\"#series-sunburst.data.itemStyle\">series.data.itemStyle</a> for single sector. If <a href=\"#series-sunburst.data.itemStyle\">series.data.itemStyle</a> is defined, it will cover the setting of <a href=\"#series-sunburst.itemStyle\">series.itemStyle</a> and <a href=\"#series-sunburst.levels.itemStyle\">series.levels.itemStyle</a>.</p>\n<p><strong>Priority: <a href=\"#series-sunburst.data.itemStyle\">series.data.itemStyle</a> &gt; <a href=\"#series-sunburst.levels.itemStyle\">series.levels.itemStyle</a> &gt; <a href=\"#series-sunburst.itemStyle\">series.itemStyle</a>.</strong></p>\n<p>In ECharts, <em>emphasis</em> is for styles when mouse hovers. For Sunburst charts, there are two extra states: <em>highlight</em> for highlighting items that relates to the emphasized one, and <em>downplay</em> for others when emphasizing an item. See <a href=\"#series-sunburst.highlightPolicy\">highlightPolicy</a>.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"'white'"},"borderWidth":{"type":["number"],"default":1},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"],"default":1}}},"highlightPolicy":{"type":["string"],"default":"'descendant'"},"nodeClick":{"type":["boolean","string"],"default":"'rootToNode'"},"sort":{"type":["string","Function"],"default":"'desc'"},"renderLabelForZeroData":{"type":["boolean"],"default":false},"emphasis":{"type":["Object"],"description":"<p>Item style when mouse is hovering. See <a href=\"#series-sunburst.highlightPolicy\">highlightPolicy</a>.</p>\n","properties":{"label":{"type":["Object"],"description":"<p><code>label</code> sets the text style for every sectors.</p>\n<p><strong>Priority: <a href=\"#series-sunburst.data.label\">series.data.label</a> &gt; <a href=\"#series-sunburst.levels.label\">series.levels.label</a> &gt; <a href=\"#series-sunburst.label\">series.label</a>.</strong></p>\n<p>Text label of , to explain some data information about graphic item like value, name and so on. <code>label</code> is placed under <code>itemStyle</code> in ECharts 2.x. In ECharts 3, to make the configuration structure flatter, <code>label</code>is taken to be at the same level with <code>itemStyle</code>, and has <code>emphasis</code> as <code>itemStyle</code> does.</p>\n","properties":{"rotate":{"type":["string","number"],"default":"'radial'"},"align":{"type":["string"],"default":"'center'"},"minAngle":{"type":["number"],"default":null},"show":{"type":["boolean"],"default":true},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Style of Sunburst sectors.</p>\n<p>Style can be set in <a href=\"#series-sunburst.itemStyle\">series.itemStyle</a> for sectors of this series, or <a href=\"#series-sunburst.levels.itemStyle\">series.levels.itemStyle</a> for the whole level, or<a href=\"#series-sunburst.data.itemStyle\">series.data.itemStyle</a> for single sector. If <a href=\"#series-sunburst.data.itemStyle\">series.data.itemStyle</a> is defined, it will cover the setting of <a href=\"#series-sunburst.itemStyle\">series.itemStyle</a> and <a href=\"#series-sunburst.levels.itemStyle\">series.levels.itemStyle</a>.</p>\n<p><strong>Priority: <a href=\"#series-sunburst.data.itemStyle\">series.data.itemStyle</a> &gt; <a href=\"#series-sunburst.levels.itemStyle\">series.levels.itemStyle</a> &gt; <a href=\"#series-sunburst.itemStyle\">series.itemStyle</a>.</strong></p>\n<p>In ECharts, <em>emphasis</em> is for styles when mouse hovers. For Sunburst charts, there are two extra states: <em>highlight</em> for highlighting items that relates to the emphasized one, and <em>downplay</em> for others when emphasizing an item. See <a href=\"#series-sunburst.highlightPolicy\">highlightPolicy</a>.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"'white'"},"borderWidth":{"type":["number"],"default":1},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"],"default":1}}}}},"highlight":{"type":["Object"],"description":"<p>Item style when mouse is hovering related items. See <a href=\"#series-sunburst.highlightPolicy\">highlightPolicy</a>.</p>\n","properties":{"label":{"type":["Object"],"description":"<p><code>label</code> sets the text style for every sectors.</p>\n<p><strong>Priority: <a href=\"#series-sunburst.data.label\">series.data.label</a> &gt; <a href=\"#series-sunburst.levels.label\">series.levels.label</a> &gt; <a href=\"#series-sunburst.label\">series.label</a>.</strong></p>\n<p>Text label of , to explain some data information about graphic item like value, name and so on. <code>label</code> is placed under <code>itemStyle</code> in ECharts 2.x. In ECharts 3, to make the configuration structure flatter, <code>label</code>is taken to be at the same level with <code>itemStyle</code>, and has <code>emphasis</code> as <code>itemStyle</code> does.</p>\n","properties":{"rotate":{"type":["string","number"],"default":"'radial'"},"align":{"type":["string"],"default":"'center'"},"minAngle":{"type":["number"],"default":null},"show":{"type":["boolean"],"default":true},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Style of Sunburst sectors.</p>\n<p>Style can be set in <a href=\"#series-sunburst.itemStyle\">series.itemStyle</a> for sectors of this series, or <a href=\"#series-sunburst.levels.itemStyle\">series.levels.itemStyle</a> for the whole level, or<a href=\"#series-sunburst.data.itemStyle\">series.data.itemStyle</a> for single sector. If <a href=\"#series-sunburst.data.itemStyle\">series.data.itemStyle</a> is defined, it will cover the setting of <a href=\"#series-sunburst.itemStyle\">series.itemStyle</a> and <a href=\"#series-sunburst.levels.itemStyle\">series.levels.itemStyle</a>.</p>\n<p><strong>Priority: <a href=\"#series-sunburst.data.itemStyle\">series.data.itemStyle</a> &gt; <a href=\"#series-sunburst.levels.itemStyle\">series.levels.itemStyle</a> &gt; <a href=\"#series-sunburst.itemStyle\">series.itemStyle</a>.</strong></p>\n<p>In ECharts, <em>emphasis</em> is for styles when mouse hovers. For Sunburst charts, there are two extra states: <em>highlight</em> for highlighting items that relates to the emphasized one, and <em>downplay</em> for others when emphasizing an item. See <a href=\"#series-sunburst.highlightPolicy\">highlightPolicy</a>.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"'white'"},"borderWidth":{"type":["number"],"default":1},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"],"default":1}}}}},"downplay":{"type":["Object"],"description":"<p>Item style when mouse is hovering unrelated items. See <a href=\"#series-sunburst.highlightPolicy\">highlightPolicy</a>.</p>\n","properties":{"label":{"type":["Object"],"description":"<p><code>label</code> sets the text style for every sectors.</p>\n<p><strong>Priority: <a href=\"#series-sunburst.data.label\">series.data.label</a> &gt; <a href=\"#series-sunburst.levels.label\">series.levels.label</a> &gt; <a href=\"#series-sunburst.label\">series.label</a>.</strong></p>\n<p>Text label of , to explain some data information about graphic item like value, name and so on. <code>label</code> is placed under <code>itemStyle</code> in ECharts 2.x. In ECharts 3, to make the configuration structure flatter, <code>label</code>is taken to be at the same level with <code>itemStyle</code>, and has <code>emphasis</code> as <code>itemStyle</code> does.</p>\n","properties":{"rotate":{"type":["string","number"],"default":"'radial'"},"align":{"type":["string"],"default":"'center'"},"minAngle":{"type":["number"],"default":null},"show":{"type":["boolean"],"default":true},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Style of Sunburst sectors.</p>\n<p>Style can be set in <a href=\"#series-sunburst.itemStyle\">series.itemStyle</a> for sectors of this series, or <a href=\"#series-sunburst.levels.itemStyle\">series.levels.itemStyle</a> for the whole level, or<a href=\"#series-sunburst.data.itemStyle\">series.data.itemStyle</a> for single sector. If <a href=\"#series-sunburst.data.itemStyle\">series.data.itemStyle</a> is defined, it will cover the setting of <a href=\"#series-sunburst.itemStyle\">series.itemStyle</a> and <a href=\"#series-sunburst.levels.itemStyle\">series.levels.itemStyle</a>.</p>\n<p><strong>Priority: <a href=\"#series-sunburst.data.itemStyle\">series.data.itemStyle</a> &gt; <a href=\"#series-sunburst.levels.itemStyle\">series.levels.itemStyle</a> &gt; <a href=\"#series-sunburst.itemStyle\">series.itemStyle</a>.</strong></p>\n<p>In ECharts, <em>emphasis</em> is for styles when mouse hovers. For Sunburst charts, there are two extra states: <em>highlight</em> for highlighting items that relates to the emphasized one, and <em>downplay</em> for others when emphasizing an item. See <a href=\"#series-sunburst.highlightPolicy\">highlightPolicy</a>.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"'white'"},"borderWidth":{"type":["number"],"default":1},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"],"default":1}}}}},"levels":{"type":["Array"],"description":"<p><strong>Multiple levels</strong></p>\n<p>Sunburst chart has a leveled structure. To make it convenient, we provide a <code>levels</code> option, which is an array. The first element of it is for returning to parent node when data mining. The following elements are for levels from center to outside.</p>\n<p>For example, if we don&#39;t want the data mining, and want to set the most inside sector to be red, and text to be blue, we can set the option like:</p>\n<pre><code class=\"lang-js\">series: {\n    // ...\n    levels: [\n        {\n            // Blank setting for data mining\n        },\n        {\n            // The most inside level\n            itemStyle: {\n                color: &#39;red&#39;\n            },\n            label: {\n                color: &#39;blue&#39;\n            }\n        },\n        {\n            // The second level\n        }\n    ]\n}\n</code></pre>\n","default":"[]","items":{"type":"Object","properties":{"label":{"type":["Object"],"description":"<p><code>label</code> sets the text style for every sectors.</p>\n<p><strong>Priority: <a href=\"#series-sunburst.data.label\">series.data.label</a> &gt; <a href=\"#series-sunburst.levels.label\">series.levels.label</a> &gt; <a href=\"#series-sunburst.label\">series.label</a>.</strong></p>\n<p>Text label of , to explain some data information about graphic item like value, name and so on. <code>label</code> is placed under <code>itemStyle</code> in ECharts 2.x. In ECharts 3, to make the configuration structure flatter, <code>label</code>is taken to be at the same level with <code>itemStyle</code>, and has <code>emphasis</code> as <code>itemStyle</code> does.</p>\n","properties":{"rotate":{"type":["string","number"],"default":"'radial'"},"align":{"type":["string"],"default":"'center'"},"minAngle":{"type":["number"],"default":null},"show":{"type":["boolean"],"default":true},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Style of Sunburst sectors.</p>\n<p>Style can be set in <a href=\"#series-sunburst.itemStyle\">series.itemStyle</a> for sectors of this series, or <a href=\"#series-sunburst.levels.itemStyle\">series.levels.itemStyle</a> for the whole level, or<a href=\"#series-sunburst.data.itemStyle\">series.data.itemStyle</a> for single sector. If <a href=\"#series-sunburst.data.itemStyle\">series.data.itemStyle</a> is defined, it will cover the setting of <a href=\"#series-sunburst.itemStyle\">series.itemStyle</a> and <a href=\"#series-sunburst.levels.itemStyle\">series.levels.itemStyle</a>.</p>\n<p><strong>Priority: <a href=\"#series-sunburst.data.itemStyle\">series.data.itemStyle</a> &gt; <a href=\"#series-sunburst.levels.itemStyle\">series.levels.itemStyle</a> &gt; <a href=\"#series-sunburst.itemStyle\">series.itemStyle</a>.</strong></p>\n<p>In ECharts, <em>emphasis</em> is for styles when mouse hovers. For Sunburst charts, there are two extra states: <em>highlight</em> for highlighting items that relates to the emphasized one, and <em>downplay</em> for others when emphasizing an item. See <a href=\"#series-sunburst.highlightPolicy\">highlightPolicy</a>.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"'white'"},"borderWidth":{"type":["number"],"default":1},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"],"default":1}}},"emphasis":{"type":["Object"],"description":"<p>Item style when mouse is hovering. See <a href=\"#series-sunburst.highlightPolicy\">highlightPolicy</a>.</p>\n","properties":{"label":{"type":["Object"],"description":"<p><code>label</code> sets the text style for every sectors.</p>\n<p><strong>Priority: <a href=\"#series-sunburst.data.label\">series.data.label</a> &gt; <a href=\"#series-sunburst.levels.label\">series.levels.label</a> &gt; <a href=\"#series-sunburst.label\">series.label</a>.</strong></p>\n<p>Text label of , to explain some data information about graphic item like value, name and so on. <code>label</code> is placed under <code>itemStyle</code> in ECharts 2.x. In ECharts 3, to make the configuration structure flatter, <code>label</code>is taken to be at the same level with <code>itemStyle</code>, and has <code>emphasis</code> as <code>itemStyle</code> does.</p>\n","properties":{"rotate":{"type":["string","number"],"default":"'radial'"},"align":{"type":["string"],"default":"'center'"},"minAngle":{"type":["number"],"default":null},"show":{"type":["boolean"],"default":true},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Style of Sunburst sectors.</p>\n<p>Style can be set in <a href=\"#series-sunburst.itemStyle\">series.itemStyle</a> for sectors of this series, or <a href=\"#series-sunburst.levels.itemStyle\">series.levels.itemStyle</a> for the whole level, or<a href=\"#series-sunburst.data.itemStyle\">series.data.itemStyle</a> for single sector. If <a href=\"#series-sunburst.data.itemStyle\">series.data.itemStyle</a> is defined, it will cover the setting of <a href=\"#series-sunburst.itemStyle\">series.itemStyle</a> and <a href=\"#series-sunburst.levels.itemStyle\">series.levels.itemStyle</a>.</p>\n<p><strong>Priority: <a href=\"#series-sunburst.data.itemStyle\">series.data.itemStyle</a> &gt; <a href=\"#series-sunburst.levels.itemStyle\">series.levels.itemStyle</a> &gt; <a href=\"#series-sunburst.itemStyle\">series.itemStyle</a>.</strong></p>\n<p>In ECharts, <em>emphasis</em> is for styles when mouse hovers. For Sunburst charts, there are two extra states: <em>highlight</em> for highlighting items that relates to the emphasized one, and <em>downplay</em> for others when emphasizing an item. See <a href=\"#series-sunburst.highlightPolicy\">highlightPolicy</a>.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"'white'"},"borderWidth":{"type":["number"],"default":1},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"],"default":1}}}}},"highlight":{"type":["Object"],"description":"<p>Item style when mouse is hovering related items. See <a href=\"#series-sunburst.highlightPolicy\">highlightPolicy</a>.</p>\n","properties":{"label":{"type":["Object"],"description":"<p><code>label</code> sets the text style for every sectors.</p>\n<p><strong>Priority: <a href=\"#series-sunburst.data.label\">series.data.label</a> &gt; <a href=\"#series-sunburst.levels.label\">series.levels.label</a> &gt; <a href=\"#series-sunburst.label\">series.label</a>.</strong></p>\n<p>Text label of , to explain some data information about graphic item like value, name and so on. <code>label</code> is placed under <code>itemStyle</code> in ECharts 2.x. In ECharts 3, to make the configuration structure flatter, <code>label</code>is taken to be at the same level with <code>itemStyle</code>, and has <code>emphasis</code> as <code>itemStyle</code> does.</p>\n","properties":{"rotate":{"type":["string","number"],"default":"'radial'"},"align":{"type":["string"],"default":"'center'"},"minAngle":{"type":["number"],"default":null},"show":{"type":["boolean"],"default":true},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Style of Sunburst sectors.</p>\n<p>Style can be set in <a href=\"#series-sunburst.itemStyle\">series.itemStyle</a> for sectors of this series, or <a href=\"#series-sunburst.levels.itemStyle\">series.levels.itemStyle</a> for the whole level, or<a href=\"#series-sunburst.data.itemStyle\">series.data.itemStyle</a> for single sector. If <a href=\"#series-sunburst.data.itemStyle\">series.data.itemStyle</a> is defined, it will cover the setting of <a href=\"#series-sunburst.itemStyle\">series.itemStyle</a> and <a href=\"#series-sunburst.levels.itemStyle\">series.levels.itemStyle</a>.</p>\n<p><strong>Priority: <a href=\"#series-sunburst.data.itemStyle\">series.data.itemStyle</a> &gt; <a href=\"#series-sunburst.levels.itemStyle\">series.levels.itemStyle</a> &gt; <a href=\"#series-sunburst.itemStyle\">series.itemStyle</a>.</strong></p>\n<p>In ECharts, <em>emphasis</em> is for styles when mouse hovers. For Sunburst charts, there are two extra states: <em>highlight</em> for highlighting items that relates to the emphasized one, and <em>downplay</em> for others when emphasizing an item. See <a href=\"#series-sunburst.highlightPolicy\">highlightPolicy</a>.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"'white'"},"borderWidth":{"type":["number"],"default":1},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"],"default":1}}}}},"downplay":{"type":["Object"],"description":"<p>Item style when mouse is hovering unrelated items. See <a href=\"#series-sunburst.highlightPolicy\">highlightPolicy</a>.</p>\n","properties":{"label":{"type":["Object"],"description":"<p><code>label</code> sets the text style for every sectors.</p>\n<p><strong>Priority: <a href=\"#series-sunburst.data.label\">series.data.label</a> &gt; <a href=\"#series-sunburst.levels.label\">series.levels.label</a> &gt; <a href=\"#series-sunburst.label\">series.label</a>.</strong></p>\n<p>Text label of , to explain some data information about graphic item like value, name and so on. <code>label</code> is placed under <code>itemStyle</code> in ECharts 2.x. In ECharts 3, to make the configuration structure flatter, <code>label</code>is taken to be at the same level with <code>itemStyle</code>, and has <code>emphasis</code> as <code>itemStyle</code> does.</p>\n","properties":{"rotate":{"type":["string","number"],"default":"'radial'"},"align":{"type":["string"],"default":"'center'"},"minAngle":{"type":["number"],"default":null},"show":{"type":["boolean"],"default":true},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Style of Sunburst sectors.</p>\n<p>Style can be set in <a href=\"#series-sunburst.itemStyle\">series.itemStyle</a> for sectors of this series, or <a href=\"#series-sunburst.levels.itemStyle\">series.levels.itemStyle</a> for the whole level, or<a href=\"#series-sunburst.data.itemStyle\">series.data.itemStyle</a> for single sector. If <a href=\"#series-sunburst.data.itemStyle\">series.data.itemStyle</a> is defined, it will cover the setting of <a href=\"#series-sunburst.itemStyle\">series.itemStyle</a> and <a href=\"#series-sunburst.levels.itemStyle\">series.levels.itemStyle</a>.</p>\n<p><strong>Priority: <a href=\"#series-sunburst.data.itemStyle\">series.data.itemStyle</a> &gt; <a href=\"#series-sunburst.levels.itemStyle\">series.levels.itemStyle</a> &gt; <a href=\"#series-sunburst.itemStyle\">series.itemStyle</a>.</strong></p>\n<p>In ECharts, <em>emphasis</em> is for styles when mouse hovers. For Sunburst charts, there are two extra states: <em>highlight</em> for highlighting items that relates to the emphasized one, and <em>downplay</em> for others when emphasizing an item. See <a href=\"#series-sunburst.highlightPolicy\">highlightPolicy</a>.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"'white'"},"borderWidth":{"type":["number"],"default":1},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"],"default":1}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"'cubicOut'"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":500},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},{"type":["Object"],"description":"<p><a href=\"https://en.wikipedia.org/wiki/Box_plot\" target=\"_blank\">Boxplot</a> is a convenient way of graphically depicting groups of numerical data through their quartiles.</p>\n<p><strong>Example:</strong></p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=boxplot-light-velocity&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n<p><br>\nMultiple <code>series</code> can be displayed in the same coordinate system. Please refer to <a href=\"http://echarts.baidu.com/gallery/editor.html?c=boxplot-multi&amp;edit=1&amp;reset=1\" target=\"_blank\">this example</a>.</p>\n<p><br>\n<br></p>\n","properties":{"type":{"type":["string"],"default":"'boxplot'"},"id":{"type":["string"]},"coordinateSystem":{"type":["string"],"default":"'cartesian2d'"},"xAxisIndex":{"type":["number"],"default":0},"yAxisIndex":{"type":["number"],"default":0},"name":{"type":["string"]},"legendHoverLink":{"type":["boolean"],"default":true},"hoverAnimation":{"type":["boolean"],"default":true},"layout":{"type":["string"],"default":null},"boxWidth":{"type":["Array"],"default":"[7, 50]"},"itemStyle":{"type":["Object"],"description":"<p>Graphic style of boxplot, <code>emphasis</code> is the style when it is highlighted, like being hovered by mouse, or highlighted via legend connect.</p>\n","properties":{"color":{"type":["Color"],"default":"#fff"},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":1},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"#fff"},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":2},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"],"default":5},"shadowColor":{"type":["Color"],"default":"rgba(0,0,0,0.4)"},"shadowOffsetX":{"type":["number"],"default":2},"shadowOffsetY":{"type":["number"],"default":2},"opacity":{"type":["number"]}}}}},"dimensions":{"type":["Array"]},"encode":{"type":["Object"]},"data":{"type":["Array"],"description":"<p>Data should be the two-dimensional array shown as follow.</p>\n<pre><code class=\"lang-javascript\">[\n    [655, 850, 940, 980, 1175],\n    [672.5, 800, 845, 885, 1012.5],\n    [780, 840, 855, 880, 940],\n    [621.25, 767.5, 815, 865, 1011.25],\n    { // the data item could also be an Object, so that it could contains special settings for this data item.\n        value: [713.75, 807.5, 810, 870, 963.75],\n        itemStyle: {...}\n    },\n    ...\n]\n</code></pre>\n<p>Every data item (each line in the example above) in the two-dimensional array will be rendered into a box, and each line have five values as:</p>\n<pre><code class=\"lang-javascript\">[min,  Q1,  median (or Q2),  Q3,  max]\n</code></pre>\n<p><strong>Data Processing</strong></p>\n<p>ECharts doesn&#39;t contain data processing modules, so the five statistic values should be calculated by yourself and then passes into <code>boxplot</code>.</p>\n<p>However, ECharts also provide some simple <a href=\"https://github.com/ecomfe/echarts/tree/master/extension/dataTool\" target=\"_blank\">raw data processing tools</a>. For example, this <a href=\"http://echarts.baidu.com/gallery/editor.html?c=boxplot-light-velocity&amp;edit=1&amp;reset=1\" target=\"_blank\">example</a> uses <code>echarts.dataTool.prepareBoxplotData</code> to proceed simple data statistics.</p>\n","items":{"type":"Object","properties":{"name":{"type":["string"]},"value":{"type":["Array"]},"itemStyle":{"type":["Object"]},"color":{"type":["Color"],"default":"#fff"},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":1},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"],"description":"<p>Opacity of the component. Supports value from 0 to 1, and the component will not be drawn when set to 0.</p>\n","properties":{"emphasis":{"type":["Object"]},"color":{"type":["Color"],"default":"#fff"},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":2},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"],"default":5},"shadowColor":{"type":["Color"],"default":"rgba(0,0,0,0.4)"},"shadowOffsetX":{"type":["number"],"default":2},"shadowOffsetY":{"type":["number"],"default":2},"opacity":{"type":["number"]}}},"tooltip":{"type":["*"],"description":"<p>tooltip settings in this series data.</p>\n","properties":{"position":{"type":["string","Array"]},"formatter":{"type":["string","Function"]},"backgroundColor":{"type":["Color"],"default":"'rgba(50,50,50,0.7)'"},"borderColor":{"type":["Color"],"default":"'#333'"},"borderWidth":{"type":["number"],"default":0},"padding":{"type":["number"],"default":5},"textStyle":{"type":["Object"],"description":"<blockquote>\n<p><strong>Notice：</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code>&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The text syle of tooltip&#39;s floating layer.</p>\n","properties":{"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":14},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"extraCssText":{"type":["string"]}}}}}},"markPoint":{"type":["Object"],"description":"<p>Mark point in a chart.</p>\n","properties":{"symbol":{"type":["string"],"default":"'pin'"},"symbolSize":{"type":["number","Array","Function"],"default":50},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"silent":{"type":["boolean"],"default":false},"label":{"type":["Object"],"description":"<p>Label of mark point.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Mark point style.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["Array"],"description":"<p>Data array for mark points, each of which is an object. Here are some ways to assign mark point position.</p>\n<ol>\n<li><p>Assign coordinate according to container with <a href=\"#series-boxplot.markPoint.data.x\">x</a>, <a href=\"#series-boxplot.markPoint.data.y\">y</a> attribute, in which pixel values and percentage are supported.</p>\n</li>\n<li><p>Assign coordinate position with <a href=\"#series-boxplot.markPoint.data.coord\">coord</a> attribute, in which <code>&#39;min&#39;</code>, <code>&#39;max&#39;</code>, <code>&#39;average&#39;</code> are supported for each dimension.</p>\n</li>\n<li><p>Use <a href=\"#series-boxplot.markPoint.data.type\">type</a> attribute to mark the maximum and minimum values in the series, in which <a href=\"#series-boxplot.markPoint.data.valueIndex\">valueIndex</a> or <a href=\"#series-boxplot.markPoint.data.valueDim\">valueDim</a> can be used to assign the dimension.</p>\n</li>\n</ol>\n<p>When multiple attributes exist, priority is as the above order.</p>\n<p><strong>For example: </strong></p>\n<pre><code class=\"lang-js\">data: [\n    {\n        name: &#39;maximum&#39;,\n        type: &#39;max&#39;\n    }, \n    {\n        name: &#39;coordinate&#39;,\n        coord: [10, 20]\n    }, {\n        name: &#39;fixed x position&#39;,\n        yAixs: 10,\n        x: &#39;90%&#39;\n    }, \n    {\n        name: &#39;screen coordinate&#39;,\n        x: 100,\n        y: 100\n    }\n]\n</code></pre>\n","items":{"type":"Object","properties":{"name":{"type":["string"],"default":"''"},"type":{"type":["string"]},"valueIndex":{"type":["number"]},"valueDim":{"type":["string"]},"coord":{"type":["Array"]},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"itemStyle":{"type":["Object"],"description":"<p>Mark point style.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"markLine":{"type":["*"],"description":"<p>Use a line in the chart to illustrate.</p>\n","properties":{"silent":{"type":["boolean"],"default":false},"symbol":{"type":["string","Array"]},"symbolSize":{"type":["number","Array"]},"precision":{"type":["number"],"default":2},"label":{"type":["Object"],"description":"<p>Mark line text.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]}}}}},"lineStyle":{"type":["Object"],"description":"<p>Mark line style.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["*"],"description":"<p>Data array of marking line. Every array item can be an array of one or two values, representing starting and ending point of the line, and every item is an object. Here are several ways to assign the positions of starting and ending point.</p>\n<ol>\n<li><p>Assign coordinate according to container with <a href=\"#series-boxplot.markLine.data.0.x\">x</a>, <a href=\"#series-boxplot.markLine.data.0.y\">y</a> attribute, in which pixel values and percentage are supported.</p>\n</li>\n<li><p>Assign coordinate position with <a href=\"#series-boxplot.markLine.data.0.coord\">coord</a> attribute, in which <code>&#39;min&#39;</code>, <code>&#39;max&#39;</code>, <code>&#39;average&#39;</code> are supported for each dimension.</p>\n</li>\n<li><p>Use <a href=\"#series-boxplot.markLine.data.0.type\">type</a> attribute to mark the maximum and minimum values in the series, in which <a href=\"#series-boxplot.markLine.data.0.valueIndex\">valueIndex</a> or <a href=\"#series-boxplot.markLine.data.0.valueDim\">valueDim</a> can be used to assign the dimension.</p>\n</li>\n<li><p>You may also create a mark line in Cartesian coordinate at a specific position in X or Y axis by assigning <code>xAxis</code> or <code>yAxis</code>. See <a href=\"http://echarts.baidu.com/gallery/editor.html?c=scatter-weight\" target=\"_blank\">scatter-weight</a> for example.</p>\n</li>\n</ol>\n<p>When multiple attributes exist, priority is as the above order.</p>\n<p>You may also set the type of mark line through <code>type</code>, stating whether it is for the maximum value or average value. Likewise, dimensions can be assigned through <code>valueIndex</code>.</p>\n<pre><code>data: [\n    {\n        name: &#39;average line&#39;,\n        // &#39;average&#39;, &#39;min&#39;, and &#39;max&#39; are supported\n        type: &#39;average&#39;\n    },\n    {\n        name: &#39;Horizontal line with Y value at 100&#39;,\n        yAxis: 100\n    },\n    [\n        {\n            // Use the same name with starting and ending point\n            name: &#39;Minimum to Maximum&#39;,\n            type: &#39;min&#39;\n        },\n        {\n            type: &#39;max&#39;\n        }\n    ],\n    [\n        {\n            name: &#39;Markline between two points&#39;,\n            coord: [10, 20]\n        },\n        {\n            coord: [20, 30]\n        }\n    ], [{\n        // Mark line with a fixed X position in starting point. This is used to generate an arrow pointing to maximum line.\n        yAxis: &#39;max&#39;,\n        x: &#39;90%&#39;\n    }, {\n        type: &#39;max&#39;\n    }],\n    [\n        {\n            name: &#39;Mark line between two points&#39;,\n            x: 100,\n            y: 100\n        },\n        {\n            x: 500,\n            y: 200\n        }\n    ]\n]\n</code></pre>","properties":{"0":{"type":["Object"],"description":"<p>Data of the starting point.</p>\n","properties":{"type":{"type":["string"]},"valueIndex":{"type":["number"]},"valueDim":{"type":["string"]},"coord":{"type":["Array"]},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"lineStyle":{"type":["Object"],"description":"<p>Line style of this data item, which will be merged with <code>lineStyle</code> of starting point and ending point.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0}}}}},"label":{"type":["Object"],"description":"<p>Label of this data item, which will be merged with <code>label</code> of starting point and ending point.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]}}}}}}},"1":{"type":["Object"],"description":"<p>Data of the ending point.</p>\n","properties":{"type":{"type":["string"]},"valueIndex":{"type":["number"]},"valueDim":{"type":["string"]},"coord":{"type":["Array"]},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"lineStyle":{"type":["Object"],"description":"<p>Line style of this data item, which will be merged with <code>lineStyle</code> of starting point and ending point.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0}}}}},"label":{"type":["Object"],"description":"<p>Label of this data item, which will be merged with <code>label</code> of starting point and ending point.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]}}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"markArea":{"type":["Object"],"description":"<p>Used to mark an area in chart. For example, mark a time interval.</p>\n","properties":{"silent":{"type":["boolean"],"default":false},"label":{"type":["Object"],"description":"<p>Label in mark area.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Style of the mark area.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["*"],"description":"<p>The scope of the area is defined by <code>data</code>, which is an array with two item, representing the left-top point and the right-bottom point of rectangle area. Each item can be defined as follows:</p>\n<ol>\n<li><p>Specify the coordinate in screen coordinate system using <a href=\"#series-boxplot.markArea.data.0.x\">x</a>, <a href=\"#series-boxplot.markArea.data.0.y\">y</a>, where the unit is pixel (e.g., the value is <code>5</code>), or percent (e.g., the value is <code>&#39;35%&#39;</code>).</p>\n</li>\n<li><p>Specify the coordinate in data coordinate system (i.e., cartesian) using\n<a href=\"#series-boxplot.markArea.data.0.coord\">coord</a>, which can be also set as <code>&#39;min&#39;</code>, <code>&#39;max&#39;</code>, <code>&#39;average&#39;</code> (e.g, <code>coord: [23, &#39;min&#39;]</code>, or <code>coord: [&#39;average&#39;, &#39;max&#39;]</code>)。</p>\n</li>\n</ol>\n<ol>\n<li>Locate the point on the min value or max value of <code>series.data</code> using <a href=\"#series-boxplot.markArea.data.0.type\">type</a>, where <a href=\"#series-boxplot.markArea.data.0.valueIndex\">valueIndex</a> or <a href=\"#series-boxplot.markPoint.data.0.valueDim\">valueDim</a> can be used to specify the dimension on which the min, max or average are calculated.</li>\n<li>If in cartesian, you can only specify <code>xAxis</code> or <code>yAxis</code> to define a mark area based on only X or Y axis, see sample <a href=\"http://echarts.baidu.com/gallery/editor.html?c=scatter-weight\" target=\"_blank\">scatter-weight</a></li>\n</ol>\n<p>The priority follows as above if more than one above definition used.</p>\n<pre><code>data: [\n\n    [\n        {\n            name: &#39;From average to max&#39;,\n            type: &#39;average&#39;\n        },\n        {\n            type: &#39;max&#39;\n        }\n    ],\n\n    [\n        {\n            name: &#39;Mark area between two points in data coordiantes&#39;,\n            coord: [10, 20]\n        },\n        {\n            coord: [20, 30]\n        }\n    ], [\n        {\n            name: &#39;From 60 to 80&#39;,\n            yAxis: 60\n        },\n        {\n            yAxis: 80\n        }\n    ], [\n        {\n            name: &#39;Mark area covers all data&#39;\n            coord: [&#39;min&#39;, &#39;min&#39;]\n        },\n        {\n            coord: [&#39;max&#39;, &#39;max&#39;]\n        }\n    ],\n    [\n        {\n            name: &#39;Mark area in two screen points&#39;,\n            x: 100,\n            y: 100\n        }, {\n            x: &#39;90%&#39;,\n            y: &#39;10%&#39;\n        }\n    ]\n]\n</code></pre>","properties":{"0":{"type":["Object"],"description":"<p>Specify the left-top point.</p>\n","properties":{"type":{"type":["string"]},"valueIndex":{"type":["number"]},"valueDim":{"type":["string"]},"coord":{"type":["Array"]},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"itemStyle":{"type":["Object"],"description":"<p>Style of the item.\n<code>itemStyle</code> of start point and end point will be merged together.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"<p>Label style of the item.\nLabel style of start point and end point will be merged together.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}},"1":{"type":["Object"],"description":"<p>Specify the right-bottom point.</p>\n","properties":{"type":{"type":["string"]},"valueIndex":{"type":["number"]},"valueDim":{"type":["string"]},"coord":{"type":["Array"]},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"itemStyle":{"type":["Object"],"description":"<p>Style of the item.\n<code>itemStyle</code> of start point and end point will be merged together.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"<p>Label style of the item.\nLabel style of start point and end point will be merged together.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"zlevel":{"type":["number"],"default":0},"z":{"type":["number"],"default":2},"silent":{"type":["boolean"],"default":false},"animationDuration":{"type":["number","Function"],"default":800},"animationEasing":{"type":["string"],"default":"elasticOut"},"animationDelay":{"type":["number","Function"],"default":0},"tooltip":{"type":["*"],"description":"<p>tooltip settings in this series.</p>\n","properties":{"position":{"type":["string","Array"]},"formatter":{"type":["string","Function"]},"backgroundColor":{"type":["Color"],"default":"'rgba(50,50,50,0.7)'"},"borderColor":{"type":["Color"],"default":"'#333'"},"borderWidth":{"type":["number"],"default":0},"padding":{"type":["number"],"default":5},"textStyle":{"type":["Object"],"description":"<p><br></p>\n<blockquote>\n<p><strong>Notice：</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code>&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The text syle of tooltip&#39;s floating layer.</p>\n","properties":{"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":14},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"extraCssText":{"type":["string"]}}}}},{"type":["Object"],"description":"<p>A <a href=\"https://en.wikipedia.org/wiki/Candlestick_chart\" target=\"_blank\">candlestick</a> chart (also called Japanese candlestick chart) is a style of financial chart used to describe price movements of a security, derivative, or currency.</p>\n<p>ECharts3 supports both <code>&#39;candlestick&#39;</code> and <code>&#39;k&#39;</code> in <a href=\"#(series.type\">series.type</a> (<code>&#39;k&#39;</code> would automatically turns into <code>&#39;candlestick&#39;</code>).</p>\n<p><strong>An example:</strong></p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=candlestick-sh&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n\n<p><br>\n<strong>About color of increase and decrease</strong></p>\n<p>Different countries or regions have different implications on the color of candle stick chart. It may use red to imply increasing with red and decreasing with blue (in China mainland, Taiwan, Japan, Koera, and so on), or to imply increasing with green and decreasing with red (in Europ, North America, Hong Kong, Singapore, and so on). Besides color, the increase and decrease of stock may also be represented with candle stick with or without filling colors.</p>\n<p>We use red to represent increasing and blue decreasing by default. If you want to change the configuration, you may change the following parameters.</p>\n<ul>\n<li><a href=\"#series-candlestick.itemStyle.color\">series-candlestick.itemStyle.color</a>: fill color for bullish candle stick (namely, increase)</li>\n<li><a href=\"#series-candlestick.itemStyle.color0\">series-candlestick.itemStyle.color0</a>: fill color for bearish candle stick (namely, decrease)</li>\n<li><a href=\"#series-candlestick.itemStyle.borderColor\">series-candlestick.itemStyle.borderColor</a>: border color for bullish candle stick (namely, increase)</li>\n<li><a href=\"series-candlestick.itemStyle.borderColor0\" target=\"_blank\">series-candlestick.itemStyle.borderColor0</a>: border color for bearish candle stick (namely, decrease)</li>\n</ul>\n<p><br>\n<br></p>\n","properties":{"type":{"type":["string"],"default":"'candlestick'"},"id":{"type":["string"]},"coordinateSystem":{"type":["string"],"default":"'cartesian2d'"},"xAxisIndex":{"type":["number"],"default":0},"yAxisIndex":{"type":["number"],"default":0},"name":{"type":["string"]},"legendHoverLink":{"type":["boolean"],"default":true},"hoverAnimation":{"type":["boolean"],"default":true},"layout":{"type":["string"],"default":null},"barWidth":{"type":["number"]},"barMinWidth":{"type":["number"]},"barMaxWidth":{"type":["number"]},"itemStyle":{"type":["Object"],"description":"<p>Graphic style of candlestick, <code>emphasis</code> is the style when it is highlighted, like being hovered by mouse, or highlighted via legend connect.</p>\n","properties":{"color":{"type":["Color"],"default":"#c23531"},"color0":{"type":["Color"],"default":"#314656"},"borderColor":{"type":["Color"],"default":"#c23531"},"borderColor0":{"type":["Color"],"default":"#314656"},"borderWidth":{"type":["number"],"default":1},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"#c23531"},"color0":{"type":["Color"],"default":"#314656"},"borderColor":{"type":["Color"],"default":"#c23531"},"borderColor0":{"type":["Color"],"default":"#314656"},"borderWidth":{"type":["number"],"default":2},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"dimensions":{"type":["Array"]},"encode":{"type":["Object"]},"data":{"type":["Array"],"description":"<p>Data should be the two-dimensional array shown as follow.</p>\n<pre><code class=\"lang-javascript\">[\n    [2320.26, 2320.26, 2287.3,  2362.94],\n    [2300,    2291.3,  2288.26, 2308.38],\n    { // the data item could also be an Object, so that it could contains special settings for this data item.\n        value: [2300,    2291.3,  2288.26, 2308.38],\n        itemStyle: {...}\n    },\n    ...\n]\n</code></pre>\n<p>Every data item (each line in the example above) represents a box, which contains 4 values. They are:</p>\n<pre><code class=\"lang-javascript\">[open, close, lowest, highest]  (namely: [opening value, closing value, lowest value, highest value])\n</code></pre>\n","items":{"type":"Object","properties":{"name":{"type":["string"]},"value":{"type":["Array"]},"itemStyle":{"type":["Object"]},"color":{"type":["Color"],"default":"#c23531"},"color0":{"type":["Color"],"default":"#314656"},"borderColor":{"type":["Color"],"default":"#c23531"},"borderColor0":{"type":["Color"],"default":"#314656"},"borderWidth":{"type":["number"],"default":1},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"],"description":"<p>Opacity of the component. Supports value from 0 to 1, and the component will not be drawn when set to 0.</p>\n","properties":{"emphasis":{"type":["Object"]},"color":{"type":["Color"],"default":"#c23531"},"color0":{"type":["Color"],"default":"#314656"},"borderColor":{"type":["Color"],"default":"#c23531"},"borderColor0":{"type":["Color"],"default":"#314656"},"borderWidth":{"type":["number"],"default":2},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}},"tooltip":{"type":["*"],"description":"<p>tooltip settings in this series data.</p>\n","properties":{"position":{"type":["string","Array"]},"formatter":{"type":["string","Function"]},"backgroundColor":{"type":["Color"],"default":"'rgba(50,50,50,0.7)'"},"borderColor":{"type":["Color"],"default":"'#333'"},"borderWidth":{"type":["number"],"default":0},"padding":{"type":["number"],"default":5},"textStyle":{"type":["Object"],"description":"<blockquote>\n<p><strong>Notice：</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code>&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The text syle of tooltip&#39;s floating layer.</p>\n","properties":{"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":14},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"extraCssText":{"type":["string"]}}}}}},"markPoint":{"type":["Object"],"description":"<p>Mark point in a chart.</p>\n","properties":{"symbol":{"type":["string"],"default":"'pin'"},"symbolSize":{"type":["number","Array","Function"],"default":50},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"silent":{"type":["boolean"],"default":false},"label":{"type":["Object"],"description":"<p>Label of mark point.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Mark point style.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["Array"],"description":"<p>Data array for mark points, each of which is an object. Here are some ways to assign mark point position.</p>\n<ol>\n<li><p>Assign coordinate according to container with <a href=\"#series-candlestick.markPoint.data.x\">x</a>, <a href=\"#series-candlestick.markPoint.data.y\">y</a> attribute, in which pixel values and percentage are supported.</p>\n</li>\n<li><p>Assign coordinate position with <a href=\"#series-candlestick.markPoint.data.coord\">coord</a> attribute, in which <code>&#39;min&#39;</code>, <code>&#39;max&#39;</code>, <code>&#39;average&#39;</code> are supported for each dimension.</p>\n</li>\n<li><p>Use <a href=\"#series-candlestick.markPoint.data.type\">type</a> attribute to mark the maximum and minimum values in the series, in which <a href=\"#series-candlestick.markPoint.data.valueIndex\">valueIndex</a> or <a href=\"#series-candlestick.markPoint.data.valueDim\">valueDim</a> can be used to assign the dimension.</p>\n</li>\n</ol>\n<p>When multiple attributes exist, priority is as the above order.</p>\n<p><strong>For example: </strong></p>\n<pre><code class=\"lang-js\">data: [\n    {\n        name: &#39;maximum&#39;,\n        type: &#39;max&#39;\n    }, \n    {\n        name: &#39;coordinate&#39;,\n        coord: [10, 20]\n    }, {\n        name: &#39;fixed x position&#39;,\n        yAixs: 10,\n        x: &#39;90%&#39;\n    }, \n    {\n        name: &#39;screen coordinate&#39;,\n        x: 100,\n        y: 100\n    }\n]\n</code></pre>\n","items":{"type":"Object","properties":{"name":{"type":["string"],"default":"''"},"type":{"type":["string"]},"valueIndex":{"type":["number"]},"valueDim":{"type":["string"]},"coord":{"type":["Array"]},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"itemStyle":{"type":["Object"],"description":"<p>Mark point style.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"markLine":{"type":["*"],"description":"<p>Use a line in the chart to illustrate.</p>\n","properties":{"silent":{"type":["boolean"],"default":false},"symbol":{"type":["string","Array"]},"symbolSize":{"type":["number","Array"]},"precision":{"type":["number"],"default":2},"label":{"type":["Object"],"description":"<p>Mark line text.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]}}}}},"lineStyle":{"type":["Object"],"description":"<p>Mark line style.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["*"],"description":"<p>Data array of marking line. Every array item can be an array of one or two values, representing starting and ending point of the line, and every item is an object. Here are several ways to assign the positions of starting and ending point.</p>\n<ol>\n<li><p>Assign coordinate according to container with <a href=\"#series-candlestick.markLine.data.0.x\">x</a>, <a href=\"#series-candlestick.markLine.data.0.y\">y</a> attribute, in which pixel values and percentage are supported.</p>\n</li>\n<li><p>Assign coordinate position with <a href=\"#series-candlestick.markLine.data.0.coord\">coord</a> attribute, in which <code>&#39;min&#39;</code>, <code>&#39;max&#39;</code>, <code>&#39;average&#39;</code> are supported for each dimension.</p>\n</li>\n<li><p>Use <a href=\"#series-candlestick.markLine.data.0.type\">type</a> attribute to mark the maximum and minimum values in the series, in which <a href=\"#series-candlestick.markLine.data.0.valueIndex\">valueIndex</a> or <a href=\"#series-candlestick.markLine.data.0.valueDim\">valueDim</a> can be used to assign the dimension.</p>\n</li>\n<li><p>You may also create a mark line in Cartesian coordinate at a specific position in X or Y axis by assigning <code>xAxis</code> or <code>yAxis</code>. See <a href=\"http://echarts.baidu.com/gallery/editor.html?c=scatter-weight\" target=\"_blank\">scatter-weight</a> for example.</p>\n</li>\n</ol>\n<p>When multiple attributes exist, priority is as the above order.</p>\n<p>You may also set the type of mark line through <code>type</code>, stating whether it is for the maximum value or average value. Likewise, dimensions can be assigned through <code>valueIndex</code>.</p>\n<pre><code>data: [\n    {\n        name: &#39;average line&#39;,\n        // &#39;average&#39;, &#39;min&#39;, and &#39;max&#39; are supported\n        type: &#39;average&#39;\n    },\n    {\n        name: &#39;Horizontal line with Y value at 100&#39;,\n        yAxis: 100\n    },\n    [\n        {\n            // Use the same name with starting and ending point\n            name: &#39;Minimum to Maximum&#39;,\n            type: &#39;min&#39;\n        },\n        {\n            type: &#39;max&#39;\n        }\n    ],\n    [\n        {\n            name: &#39;Markline between two points&#39;,\n            coord: [10, 20]\n        },\n        {\n            coord: [20, 30]\n        }\n    ], [{\n        // Mark line with a fixed X position in starting point. This is used to generate an arrow pointing to maximum line.\n        yAxis: &#39;max&#39;,\n        x: &#39;90%&#39;\n    }, {\n        type: &#39;max&#39;\n    }],\n    [\n        {\n            name: &#39;Mark line between two points&#39;,\n            x: 100,\n            y: 100\n        },\n        {\n            x: 500,\n            y: 200\n        }\n    ]\n]\n</code></pre>","properties":{"0":{"type":["Object"],"description":"<p>Data of the starting point.</p>\n","properties":{"type":{"type":["string"]},"valueIndex":{"type":["number"]},"valueDim":{"type":["string"]},"coord":{"type":["Array"]},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"lineStyle":{"type":["Object"],"description":"<p>Line style of this data item, which will be merged with <code>lineStyle</code> of starting point and ending point.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0}}}}},"label":{"type":["Object"],"description":"<p>Label of this data item, which will be merged with <code>label</code> of starting point and ending point.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]}}}}}}},"1":{"type":["Object"],"description":"<p>Data of the ending point.</p>\n","properties":{"type":{"type":["string"]},"valueIndex":{"type":["number"]},"valueDim":{"type":["string"]},"coord":{"type":["Array"]},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"lineStyle":{"type":["Object"],"description":"<p>Line style of this data item, which will be merged with <code>lineStyle</code> of starting point and ending point.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0}}}}},"label":{"type":["Object"],"description":"<p>Label of this data item, which will be merged with <code>label</code> of starting point and ending point.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]}}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"markArea":{"type":["Object"],"description":"<p>Used to mark an area in chart. For example, mark a time interval.</p>\n","properties":{"silent":{"type":["boolean"],"default":false},"label":{"type":["Object"],"description":"<p>Label in mark area.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Style of the mark area.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["*"],"description":"<p>The scope of the area is defined by <code>data</code>, which is an array with two item, representing the left-top point and the right-bottom point of rectangle area. Each item can be defined as follows:</p>\n<ol>\n<li><p>Specify the coordinate in screen coordinate system using <a href=\"#series-candlestick.markArea.data.0.x\">x</a>, <a href=\"#series-candlestick.markArea.data.0.y\">y</a>, where the unit is pixel (e.g., the value is <code>5</code>), or percent (e.g., the value is <code>&#39;35%&#39;</code>).</p>\n</li>\n<li><p>Specify the coordinate in data coordinate system (i.e., cartesian) using\n<a href=\"#series-candlestick.markArea.data.0.coord\">coord</a>, which can be also set as <code>&#39;min&#39;</code>, <code>&#39;max&#39;</code>, <code>&#39;average&#39;</code> (e.g, <code>coord: [23, &#39;min&#39;]</code>, or <code>coord: [&#39;average&#39;, &#39;max&#39;]</code>)。</p>\n</li>\n</ol>\n<ol>\n<li>Locate the point on the min value or max value of <code>series.data</code> using <a href=\"#series-candlestick.markArea.data.0.type\">type</a>, where <a href=\"#series-candlestick.markArea.data.0.valueIndex\">valueIndex</a> or <a href=\"#series-candlestick.markPoint.data.0.valueDim\">valueDim</a> can be used to specify the dimension on which the min, max or average are calculated.</li>\n<li>If in cartesian, you can only specify <code>xAxis</code> or <code>yAxis</code> to define a mark area based on only X or Y axis, see sample <a href=\"http://echarts.baidu.com/gallery/editor.html?c=scatter-weight\" target=\"_blank\">scatter-weight</a></li>\n</ol>\n<p>The priority follows as above if more than one above definition used.</p>\n<pre><code>data: [\n\n    [\n        {\n            name: &#39;From average to max&#39;,\n            type: &#39;average&#39;\n        },\n        {\n            type: &#39;max&#39;\n        }\n    ],\n\n    [\n        {\n            name: &#39;Mark area between two points in data coordiantes&#39;,\n            coord: [10, 20]\n        },\n        {\n            coord: [20, 30]\n        }\n    ], [\n        {\n            name: &#39;From 60 to 80&#39;,\n            yAxis: 60\n        },\n        {\n            yAxis: 80\n        }\n    ], [\n        {\n            name: &#39;Mark area covers all data&#39;\n            coord: [&#39;min&#39;, &#39;min&#39;]\n        },\n        {\n            coord: [&#39;max&#39;, &#39;max&#39;]\n        }\n    ],\n    [\n        {\n            name: &#39;Mark area in two screen points&#39;,\n            x: 100,\n            y: 100\n        }, {\n            x: &#39;90%&#39;,\n            y: &#39;10%&#39;\n        }\n    ]\n]\n</code></pre>","properties":{"0":{"type":["Object"],"description":"<p>Specify the left-top point.</p>\n","properties":{"type":{"type":["string"]},"valueIndex":{"type":["number"]},"valueDim":{"type":["string"]},"coord":{"type":["Array"]},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"itemStyle":{"type":["Object"],"description":"<p>Style of the item.\n<code>itemStyle</code> of start point and end point will be merged together.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"<p>Label style of the item.\nLabel style of start point and end point will be merged together.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}},"1":{"type":["Object"],"description":"<p>Specify the right-bottom point.</p>\n","properties":{"type":{"type":["string"]},"valueIndex":{"type":["number"]},"valueDim":{"type":["string"]},"coord":{"type":["Array"]},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"itemStyle":{"type":["Object"],"description":"<p>Style of the item.\n<code>itemStyle</code> of start point and end point will be merged together.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"<p>Label style of the item.\nLabel style of start point and end point will be merged together.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"zlevel":{"type":["number"],"default":0},"z":{"type":["number"],"default":2},"silent":{"type":["boolean"],"default":false},"animationDuration":{"type":["number","Function"],"default":300},"animationEasing":{"type":["string"],"default":"linear"},"animationDelay":{"type":["number","Function"],"default":0},"tooltip":{"type":["*"],"description":"<p>tooltip settings in this series.</p>\n","properties":{"position":{"type":["string","Array"]},"formatter":{"type":["string","Function"]},"backgroundColor":{"type":["Color"],"default":"'rgba(50,50,50,0.7)'"},"borderColor":{"type":["Color"],"default":"'#333'"},"borderWidth":{"type":["number"],"default":0},"padding":{"type":["number"],"default":5},"textStyle":{"type":["Object"],"description":"<p><br></p>\n<blockquote>\n<p><strong>Notice：</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code>&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The text syle of tooltip&#39;s floating layer.</p>\n","properties":{"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":14},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"extraCssText":{"type":["string"]}}}}},{"type":["Object"],"description":"<p><strong>heat map</strong></p>\n<p>Heat map mainly use colors to represent values, which must be used along with <a href=\"#visualMap\">visualMap</a> component.</p>\n<p>It can be used in either <a href=\"#grid\">rectangular coordinate</a> or <a href=\"#geo\">geographic coordinate</a>. But the behaviour on them are quite different. Rectangular coordinate must have two catagories to use it.</p>\n<p>Here are the examples using it in rectangular coordinate and geographic coordinate:</p>\n<p><strong>rectangular coordinate: </strong></p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=heatmap-cartesian&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n<p><strong>geographic coordinate: </strong></p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=heatmap-map&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n","properties":{"type":{"type":["string"],"default":"'heatmap'"},"id":{"type":["string"]},"name":{"type":["string"]},"coordinateSystem":{"type":["string"],"default":"'cartesian2d'"},"xAxisIndex":{"type":["number"],"default":0},"yAxisIndex":{"type":["number"],"default":0},"geoIndex":{"type":["number"],"default":0},"calendarIndex":{"type":["number"],"default":0},"blurSize":{"type":["number"],"default":20},"minOpacity":{"type":["number"],"default":0},"maxOpacity":{"type":["number"],"default":1},"data":{"type":["Array"],"description":"<p>Data array of series, which can be in the following forms:</p>\n<p>Notice, if no <code>data</code> specified in series, and there is <a href=\"#dataset\">dataset</a> in option, series will use the first <a href=\"#dataset\">dataset</a> as its datasource. If <code>data</code> has been specified, <a href=\"#dataset\">dataset</a> will not used.</p>\n<p><code>series.datasetIndex</code> can be used to specify other <a href=\"#dataset\">dataset</a>.</p>\n<p>Basically, data is represented by a two-dimension array, like the example below, where each colum is named as a &quot;dimension&quot;.</p>\n<pre><code class=\"lang-js\">series: [{\n    data: [\n        // dimX   dimY   other dimensions ...\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>In <a href=\"#grid\">cartesian (grid)</a>, &quot;dimX&quot; and &quot;dimY&quot; correspond to <a href=\"#xAxis\">xAxis</a> and <a href=\"#yAxis\">yAxis</a> repectively.</li>\n<li>In <a href=\"#polar\">polar</a> &quot;dimX&quot; and &quot;dimY&quot; correspond to <a href=\"#radiusAxis\">radiusAxis</a> 和 <a href=\"#anbleAxis\">angleAxis</a> repectively.</li>\n<li>Other dimensions are optional, which can be used in other place. For example:<ul>\n<li><a href=\"#visualMap\">visualMap</a> can map one or more dimensions to viusal (color, symbol size ...).</li>\n<li><a href=\"#series.symbolSize\">series.symbolSize</a> can be set as a callback function, where symbol size can be calculated by values of a certain dimension.</li>\n<li>Values in other dimensions can be shown by <a href=\"#tooltip.formatter\">tooltip.formatter</a> or <a href=\"#series.label.formatter\">series.label.formatter</a>.</li>\n</ul>\n</li>\n</ul>\n<p>Especially, when there is one and only one category axis (axis.type is <code>&#39;category&#39;</code>), data can be simply be represented by a one-dimension array, like:</p>\n<pre><code class=\"lang-js\">xAxis: {\n    data: [&#39;a&#39;, &#39;b&#39;, &#39;m&#39;, &#39;n&#39;]\n},\nseries: [{\n    // Each item corresponds to each item in xAxis.data.\n    data: [23,  44,  55,  19]\n    // In fact, it is the simplification of the format below:\n    // data: [[0, 23], [1, 44], [2, 55], [3, 19]]\n}]\n</code></pre>\n<p><br>\n<strong>Relationship between &quot;value&quot; and <a href=\"#xAxis.type\">axis.type</a></strong></p>\n<ul>\n<li><p>When a dimension corresponds to a value axis (axis.type is <code>&#39;value&#39;</code> or <code>&#39;log&#39;</code>):</p>\n<p>  The value can be a <code>number</code> (like <code>12</code>) (can also be a number in a <code>string</code> format, like <code>&#39;12&#39;</code>).</p>\n</li>\n<li><p>When a dimension corresponds to a category axis (axis.type is <code>&#39;category&#39;</code>):</p>\n<p>  The value should be the ordinal of the axis.data (based on <code>0</code>), the string value of the axis.data. For example:</p>\n<pre><code class=\"lang-js\">  xAxis: {\n      type: &#39;category&#39;,\n      data: [&#39;Monday&#39;, &#39;Tuesday&#39;, &#39;Wednesday&#39;, &#39;Thursday&#39;]\n  },\n  yAxis: {\n      type: &#39;category&#39;,\n      data: [&#39;a&#39;, &#39;b&#39;, &#39;m&#39;, &#39;n&#39;, &#39;p&#39;, &#39;q&#39;]\n  },\n  series: [{\n      data: [\n          // xAxis      yAxis\n          [  0,           0,    2  ], // This point is located at xAxis: &#39;Monday&#39;, yAxis: &#39;a&#39;.\n          [  &#39;Thursday&#39;,  2,    1  ], // This point is located at xAxis: &#39;Thursday&#39;, yAxis: &#39;m&#39;.\n          [  2,          &#39;p&#39;,   2  ], // This point is located at xAxis: &#39;Wednesday&#39;, yAxis: &#39;p&#39;.\n          [  3,           3,    5  ]\n      ]\n  }]\n</code></pre>\n<p>  There is an example of double category axes: <a href=\"http://echarts.baidu.com/gallery/editor.html?c=scatter-punchCard\" target=\"_blank\">Github Punchcard</a>.</p>\n</li>\n<li><p>When a dimension corresponds to a time axis (type is <code>&#39;time&#39;</code>), the value can be:</p>\n<ul>\n<li>a timestamp, like <code>1484141700832</code>, which represents a UTC time.</li>\n<li>a date string, in one of the formats below:<ul>\n<li>a subset of <a href=\"http://www.ecma-international.org/ecma-262/5.1/#sec-15.9.1.15\" target=\"_blank\">ISO 8601</a>, only including (all of these are treated as local time unless timezone is specified, which is consistent with <a href=\"https://momentjs.com/\" target=\"_blank\">moment</a>):<ul>\n<li>only part of year/month/date/time are specified: <code>&#39;2012-03&#39;</code>, <code>&#39;2012-03-01&#39;</code>, <code>&#39;2012-03-01 05&#39;</code>, <code>&#39;2012-03-01 05:06&#39;</code>.</li>\n<li>separated by <code>&quot;T&quot;</code> or a space: <code>&#39;2012-03-01T12:22:33.123&#39;</code>, <code>&#39;2012-03-01 12:22:33.123&#39;</code>.</li>\n<li>timezone specified: <code>&#39;2012-03-01T12:22:33Z&#39;</code>, <code>&#39;2012-03-01T12:22:33+8000&#39;</code>, <code>&#39;2012-03-01T12:22:33-05:00&#39;</code>.</li>\n</ul>\n</li>\n<li>other date string format (all of these are treated as local time):\n<code>&#39;2012&#39;</code>, <code>&#39;2012-3-1&#39;</code>, <code>&#39;2012/3/1&#39;</code>, <code>&#39;2012/03/01&#39;</code>,\n<code>&#39;2009/6/12 2:00&#39;</code>, <code>&#39;2009/6/12 2:05:08&#39;</code>, <code>&#39;2009/6/12 2:05:08.123&#39;</code>.</li>\n</ul>\n</li>\n<li>a JavaScript Date instance created by user:<ul>\n<li>Caution, when using a data string to create a Date instance, <a href=\"http://dygraphs.com/date-formats.html\" target=\"_blank\">browser differences and inconsistencies</a> should be considered.</li>\n<li>For example: In chrome, <code>new Date(&#39;2012-01-01&#39;)</code> is treated as a Jan 1st 2012 in UTC, while <code>new Date(&#39;2012-1-1&#39;)</code> and <code>new Date(&#39;2012/01/01&#39;)</code> are treated as Jan 1st 2012 in local timezone. In safari <code>new Date(&#39;2012-1-1&#39;)</code> is not supported.</li>\n<li>So if you intent to perform <code>new Date(dateString)</code>, it is strongly recommended to use a time parse library (e.g., <a href=\"https://momentjs.com/\" target=\"_blank\">moment</a>), or use <code>echarts.number.parseDate</code>, or check <a href=\"http://dygraphs.com/date-formats.html\" target=\"_blank\">this</a>.</li>\n</ul>\n</li>\n</ul>\n</li>\n</ul>\n<p><br>\n<strong>Customize a data item:</strong></p>\n<p>When needing to customize a data item, it can be set as an object, where property <code>value</code> reprensent real value. For example:</p>\n<pre><code class=\"lang-js\">[\n    12,\n    24,\n    {\n        value: [24, 32],\n        // label style, only works in this data item.\n        label: {},\n        // item style, only works in this data item.\n        itemStyle:{}\n    },\n    33\n]\n// Or\n[\n    [12, 332],\n    [24, 32],\n    {\n        value: [24, 32],\n        // label style, only works in this data item.\n        label: {},\n        // item style, only works in this data item.\n        itemStyle:{}\n    },\n    [33, 31]\n]\n</code></pre>\n<p><br>\n<strong>Empty value:</strong></p>\n<p><code>&#39;-&#39;</code> or <code>null</code> or <code>undefined</code> or <code>NaN</code> can be used to describe that a data item is not exists (ps：<em>not exist</em> does not means its value is <code>0</code>).</p>\n<p>For example, line chart can break when encounter an empty value, and scatter chart do not display graphic elements for empty values.</p>\n<p><br><br></p>\n","items":{"type":"Object","properties":{"name":{"type":["string"]},"value":{"type":["Array"]},"label":{"type":["Object"],"description":"<p>It is valid with <a href=\"#series-heatmap.coordinateSystem\">coordinateSystem</a> of &#39;cartesian2d&#39; value.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"inside"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Style of a single data point. It is valid with <a href=\"#series-heatmap.coordinateSystem\">coordinateSystem</a> of &#39;cartesian2d&#39; value.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}}}}},"markPoint":{"type":["Object"],"description":"<p>Mark point in a chart.</p>\n","properties":{"symbol":{"type":["string"],"default":"'pin'"},"symbolSize":{"type":["number","Array","Function"],"default":50},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"silent":{"type":["boolean"],"default":false},"label":{"type":["Object"],"description":"<p>Label of mark point.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Mark point style.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["Array"],"description":"<p>Data array for mark points, each of which is an object. Here are some ways to assign mark point position.</p>\n<ol>\n<li>Assign coordinate according to container with <a href=\"#series-heatmap.markPoint.data.x\">x</a>, <a href=\"#series-heatmap.markPoint.data.y\">y</a> attribute, in which pixel values and percentage are supported.</li>\n</ol>\n<p>When multiple attributes exist, priority is as the above order.</p>\n<p><strong>For example: </strong></p>\n<pre><code class=\"lang-js\">data: [\n    {\n        name: &#39;screen coordinate&#39;,\n        x: 100,\n        y: 100\n    }\n]\n</code></pre>\n","items":{"type":"Object","properties":{"name":{"type":["string"],"default":"''"},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"itemStyle":{"type":["Object"],"description":"<p>Mark point style.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"markLine":{"type":["*"],"description":"<p>Use a line in the chart to illustrate.</p>\n","properties":{"silent":{"type":["boolean"],"default":false},"symbol":{"type":["string","Array"]},"symbolSize":{"type":["number","Array"]},"precision":{"type":["number"],"default":2},"label":{"type":["Object"],"description":"<p>Mark line text.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]}}}}},"lineStyle":{"type":["Object"],"description":"<p>Mark line style.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["*"],"description":"<p>Data array of marking line. Every array item can be an array of one or two values, representing starting and ending point of the line, and every item is an object. Here are several ways to assign the positions of starting and ending point.</p>\n<ol>\n<li>Assign coordinate according to container with <a href=\"#series-heatmap.markLine.data.0.x\">x</a>, <a href=\"#series-heatmap.markLine.data.0.y\">y</a> attribute, in which pixel values and percentage are supported.</li>\n</ol>\n<p>When multiple attributes exist, priority is as the above order.</p>\n<pre><code>data: [\n    [\n        {\n            name: &#39;Mark line between two points&#39;,\n            x: 100,\n            y: 100\n        },\n        {\n            x: 500,\n            y: 200\n        }\n    ]\n]\n</code></pre>","properties":{"0":{"type":["Object"],"description":"<p>Data of the starting point.</p>\n","properties":{"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"lineStyle":{"type":["Object"],"description":"<p>Line style of this data item, which will be merged with <code>lineStyle</code> of starting point and ending point.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0}}}}},"label":{"type":["Object"],"description":"<p>Label of this data item, which will be merged with <code>label</code> of starting point and ending point.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]}}}}}}},"1":{"type":["Object"],"description":"<p>Data of the ending point.</p>\n","properties":{"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"lineStyle":{"type":["Object"],"description":"<p>Line style of this data item, which will be merged with <code>lineStyle</code> of starting point and ending point.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0}}}}},"label":{"type":["Object"],"description":"<p>Label of this data item, which will be merged with <code>label</code> of starting point and ending point.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]}}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"markArea":{"type":["Object"],"description":"<p>Used to mark an area in chart. For example, mark a time interval.</p>\n","properties":{"silent":{"type":["boolean"],"default":false},"label":{"type":["Object"],"description":"<p>Label in mark area.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Style of the mark area.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["*"],"description":"<p>The scope of the area is defined by <code>data</code>, which is an array with two item, representing the left-top point and the right-bottom point of rectangle area. Each item can be defined as follows:</p>\n<ol>\n<li>Specify the coordinate in screen coordinate system using <a href=\"#series-heatmap.markArea.data.0.x\">x</a>, <a href=\"#series-heatmap.markArea.data.0.y\">y</a>, where the unit is pixel (e.g., the value is <code>5</code>), or percent (e.g., the value is <code>&#39;35%&#39;</code>).</li>\n</ol>\n<p>The priority follows as above if more than one above definition used.</p>\n<pre><code>data: [\n    [\n        {\n            name: &#39;Mark area in two screen points&#39;,\n            x: 100,\n            y: 100\n        }, {\n            x: &#39;90%&#39;,\n            y: &#39;10%&#39;\n        }\n    ]\n]\n</code></pre>","properties":{"0":{"type":["Object"],"description":"<p>Specify the left-top point.</p>\n","properties":{"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"itemStyle":{"type":["Object"],"description":"<p>Style of the item.\n<code>itemStyle</code> of start point and end point will be merged together.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"<p>Label style of the item.\nLabel style of start point and end point will be merged together.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}},"1":{"type":["Object"],"description":"<p>Specify the right-bottom point.</p>\n","properties":{"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"itemStyle":{"type":["Object"],"description":"<p>Style of the item.\n<code>itemStyle</code> of start point and end point will be merged together.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"<p>Label style of the item.\nLabel style of start point and end point will be merged together.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"zlevel":{"type":["number"],"default":0},"z":{"type":["number"],"default":2},"silent":{"type":["boolean"],"default":false},"tooltip":{"type":["*"],"description":"<p>tooltip settings in this series.</p>\n","properties":{"position":{"type":["string","Array"]},"formatter":{"type":["string","Function"]},"backgroundColor":{"type":["Color"],"default":"'rgba(50,50,50,0.7)'"},"borderColor":{"type":["Color"],"default":"'#333'"},"borderWidth":{"type":["number"],"default":0},"padding":{"type":["number"],"default":5},"textStyle":{"type":["Object"],"description":"<p><br></p>\n<blockquote>\n<p><strong>Notice：</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code>&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The text syle of tooltip&#39;s floating layer.</p>\n","properties":{"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":14},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"extraCssText":{"type":["string"]}}}}},{"type":["Object"],"description":"<p><strong>Map.</strong></p>\n<p>Map is maily used in the visulization of geographic area data, which can be used with <a href=\"#visualMap\">visualMap</a> component to visualize the datas such as population distribution density in diffrent areas.</p>\n<p>Series of same <a href=\"#series-map.map\">map type</a> will show in one map. At this point, the configuration of the first series will be used for the map configuration.</p>\n<p><strong>Example: </strong></p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=doc-example/map-example&reset=1&edit=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n\n","properties":{"type":{"type":["string"],"default":"'map'"},"id":{"type":["string"]},"name":{"type":["string"]},"map":{"type":["string"],"default":"''"},"roam":{"type":["boolean","string"],"default":false},"center":{"type":["Array"]},"aspectScale":{"type":["number"],"default":0.75},"boundingCoords":{"type":["Array"],"default":null},"zoom":{"type":["number"],"default":1},"scaleLimit":{"type":["Object"],"description":"<p>Limit of scaling, with <code>min</code> and <code>max</code>. <code>1</code> by default.</p>\n","properties":{"min":{"type":["number"]},"max":{"type":["number"]}}},"nameMap":{"type":["Object"]},"selectedMode":{"type":["boolean","string"],"default":false},"label":{"type":["Object"],"description":"<p>Text label of , to explain some data information about graphic item like value, name and so on. <code>label</code> is placed under <code>itemStyle</code> in ECharts 2.x. In ECharts 3, to make the configuration structure flatter, <code>label</code>is taken to be at the same level with <code>itemStyle</code>, and has <code>emphasis</code> as <code>itemStyle</code> does.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"'bottom'"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Graphic style of Map Area Border, <code>emphasis</code> is the style when it is highlighted, like being hovered by mouse, or highlighted via legend connect.</p>\n","properties":{"areaColor":{"type":["Color"],"description":"<p>Area filling color.</p>\n","default":"'#eee'","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}},"emphasis":{"type":["Object"],"description":"<p>Map area style in highlighted state.</p>\n","properties":{"areaColor":{"type":["Color"],"default":"'#eee'"},"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"zlevel":{"type":["number"],"default":0},"z":{"type":["number"],"default":2},"left":{"type":["string","number"],"default":"'auto'"},"top":{"type":["string","number"],"default":"'auto'"},"right":{"type":["string","number"],"default":"'auto'"},"bottom":{"type":["string","number"],"default":"'auto'"},"layoutCenter":{"type":["Array"],"default":null},"layoutSize":{"type":["number","string"]},"geoIndex":{"type":["number"],"default":null},"mapValueCalculation":{"type":["string"],"default":"'sum'"},"showLegendSymbol":{"type":["boolean"]},"seriesLayoutBy":{"type":["string"],"default":"'column'"},"datasetIndex":{"type":["number"],"default":0},"data":{"type":["Array"],"description":"<p>Data array of map series, which can be a single data value, like:</p>\n<pre><code class=\"lang-js\">[12, 34, 56, 10, 23]\n</code></pre>\n<p>Or, if need extra dimensions for components like <a href=\"#visualMap\">visualMap</a> to map to graphic attributes like color, it can also be in the form of array. For example:</p>\n<pre><code class=\"lang-js\">[[12, 14], [34, 50], [56, 30], [10, 15], [23, 10]]\n</code></pre>\n<p>In this case, we can assgin the second value in each arrary item to <a href=\"#visualMap\">visualMap</a> component.</p>\n<p>More likely, we need to assign name to each data item, in which case each item should be an object:</p>\n<pre><code class=\"lang-js\">[{\n    // name of date item\n    name: &#39;data1&#39;,\n    // value of date item is 8\n    value: 10\n}, {\n    name: &#39;data2&#39;,\n    value: 20\n}]\n</code></pre>\n<p>Each data item can be further custerized:</p>\n<pre><code class=\"lang-js\">[{\n    name: &#39;data1&#39;,\n    value: 10\n}, {\n    // name of data item\n    name: &#39;data2&#39;,\n    value : 56,\n    // user-defined label format that only useful for this data item\n    label: {},\n    // user-defined special itemStyle that only useful for this data item\n    itemStyle:{}\n}]\n</code></pre>\n","items":{"type":"Object","properties":{"name":{"type":["string"]},"value":{"type":["number"]},"selected":{"type":["boolean"],"default":false},"itemStyle":{"type":["Object"],"description":"<p>Style of item polygon</p>\n","properties":{"areaColor":{"type":["Color"],"description":"<p>Color of the area.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}},"emphasis":{"type":["Object"],"description":"","properties":{"areaColor":{"type":["Color"]},"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"tooltip":{"type":["*"],"description":"<p>tooltip settings in this series data.</p>\n","properties":{"position":{"type":["string","Array"]},"formatter":{"type":["string","Function"]},"backgroundColor":{"type":["Color"],"default":"'rgba(50,50,50,0.7)'"},"borderColor":{"type":["Color"],"default":"'#333'"},"borderWidth":{"type":["number"],"default":0},"padding":{"type":["number"],"default":5},"textStyle":{"type":["Object"],"description":"<blockquote>\n<p><strong>Notice：</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code>&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The text syle of tooltip&#39;s floating layer.</p>\n","properties":{"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":14},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"extraCssText":{"type":["string"]}}}}}},"markPoint":{"type":["Object"],"description":"<p>Mark point in a chart.</p>\n","properties":{"symbol":{"type":["string"],"default":"'pin'"},"symbolSize":{"type":["number","Array","Function"],"default":50},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"silent":{"type":["boolean"],"default":false},"label":{"type":["Object"],"description":"<p>Label of mark point.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Mark point style.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["Array"],"description":"<p>Data array for mark points, each of which is an object. Here are some ways to assign mark point position.</p>\n<ol>\n<li><p>Assign coordinate according to container with <a href=\"#series-map.markPoint.data.x\">x</a>, <a href=\"#series-map.markPoint.data.y\">y</a> attribute, in which pixel values and percentage are supported.</p>\n</li>\n<li><p>Assign coordinate position with <a href=\"#series-map.markPoint.data.coord\">coord</a> attribute, in which <code>&#39;min&#39;</code>, <code>&#39;max&#39;</code>, <code>&#39;average&#39;</code> are supported for each dimension.</p>\n</li>\n</ol>\n<p>When multiple attributes exist, priority is as the above order.</p>\n<p><strong>For example: </strong></p>\n<pre><code class=\"lang-js\">data: [\n    {\n        name: &#39;coordinate&#39;,\n        coord: [10, 20]\n    }, {\n        name: &#39;fixed x position&#39;,\n        yAixs: 10,\n        x: &#39;90%&#39;\n    }, \n    {\n        name: &#39;screen coordinate&#39;,\n        x: 100,\n        y: 100\n    }\n]\n</code></pre>\n","items":{"type":"Object","properties":{"name":{"type":["string"],"default":"''"},"valueIndex":{"type":["number"]},"valueDim":{"type":["string"]},"coord":{"type":["Array"]},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"itemStyle":{"type":["Object"],"description":"<p>Mark point style.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"markLine":{"type":["*"],"description":"<p>Use a line in the chart to illustrate.</p>\n","properties":{"silent":{"type":["boolean"],"default":false},"symbol":{"type":["string","Array"]},"symbolSize":{"type":["number","Array"]},"precision":{"type":["number"],"default":2},"label":{"type":["Object"],"description":"<p>Mark line text.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]}}}}},"lineStyle":{"type":["Object"],"description":"<p>Mark line style.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["*"],"description":"<p>Data array of marking line. Every array item can be an array of one or two values, representing starting and ending point of the line, and every item is an object. Here are several ways to assign the positions of starting and ending point.</p>\n<ol>\n<li><p>Assign coordinate according to container with <a href=\"#series-map.markLine.data.0.x\">x</a>, <a href=\"#series-map.markLine.data.0.y\">y</a> attribute, in which pixel values and percentage are supported.</p>\n</li>\n<li><p>Assign coordinate position with <a href=\"#series-map.markLine.data.0.coord\">coord</a> attribute, in which <code>&#39;min&#39;</code>, <code>&#39;max&#39;</code>, <code>&#39;average&#39;</code> are supported for each dimension.</p>\n</li>\n</ol>\n<p>When multiple attributes exist, priority is as the above order.</p>\n<pre><code>data: [\n    [\n        {\n            name: &#39;Markline between two points&#39;,\n            coord: [10, 20]\n        },\n        {\n            coord: [20, 30]\n        }\n    ], [{\n        // Mark line with a fixed X position in starting point. This is used to generate an arrow pointing to maximum line.\n        yAxis: &#39;max&#39;,\n        x: &#39;90%&#39;\n    }, {\n        type: &#39;max&#39;\n    }],\n    [\n        {\n            name: &#39;Mark line between two points&#39;,\n            x: 100,\n            y: 100\n        },\n        {\n            x: 500,\n            y: 200\n        }\n    ]\n]\n</code></pre>","properties":{"0":{"type":["Object"],"description":"<p>Data of the starting point.</p>\n","properties":{"valueIndex":{"type":["number"]},"valueDim":{"type":["string"]},"coord":{"type":["Array"]},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"lineStyle":{"type":["Object"],"description":"<p>Line style of this data item, which will be merged with <code>lineStyle</code> of starting point and ending point.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0}}}}},"label":{"type":["Object"],"description":"<p>Label of this data item, which will be merged with <code>label</code> of starting point and ending point.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]}}}}}}},"1":{"type":["Object"],"description":"<p>Data of the ending point.</p>\n","properties":{"valueIndex":{"type":["number"]},"valueDim":{"type":["string"]},"coord":{"type":["Array"]},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"lineStyle":{"type":["Object"],"description":"<p>Line style of this data item, which will be merged with <code>lineStyle</code> of starting point and ending point.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0}}}}},"label":{"type":["Object"],"description":"<p>Label of this data item, which will be merged with <code>label</code> of starting point and ending point.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]}}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"markArea":{"type":["Object"],"description":"<p>Used to mark an area in chart. For example, mark a time interval.</p>\n","properties":{"silent":{"type":["boolean"],"default":false},"label":{"type":["Object"],"description":"<p>Label in mark area.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Style of the mark area.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["*"],"description":"<p>The scope of the area is defined by <code>data</code>, which is an array with two item, representing the left-top point and the right-bottom point of rectangle area. Each item can be defined as follows:</p>\n<ol>\n<li><p>Specify the coordinate in screen coordinate system using <a href=\"#series-map.markArea.data.0.x\">x</a>, <a href=\"#series-map.markArea.data.0.y\">y</a>, where the unit is pixel (e.g., the value is <code>5</code>), or percent (e.g., the value is <code>&#39;35%&#39;</code>).</p>\n</li>\n<li><p>Specify the coordinate in data coordinate system (i.e., cartesian) using\n<a href=\"#series-map.markArea.data.0.coord\">coord</a>, which can be also set as <code>&#39;min&#39;</code>, <code>&#39;max&#39;</code>, <code>&#39;average&#39;</code> (e.g, <code>coord: [23, &#39;min&#39;]</code>, or <code>coord: [&#39;average&#39;, &#39;max&#39;]</code>)。</p>\n</li>\n</ol>\n<p>The priority follows as above if more than one above definition used.</p>\n<pre><code>data: [\n\n    [\n        {\n            name: &#39;Mark area between two points in data coordiantes&#39;,\n            coord: [10, 20]\n        },\n        {\n            coord: [20, 30]\n        }\n    ], [\n        {\n            name: &#39;From 60 to 80&#39;,\n            yAxis: 60\n        },\n        {\n            yAxis: 80\n        }\n    ], [\n        {\n            name: &#39;Mark area covers all data&#39;\n            coord: [&#39;min&#39;, &#39;min&#39;]\n        },\n        {\n            coord: [&#39;max&#39;, &#39;max&#39;]\n        }\n    ],\n    [\n        {\n            name: &#39;Mark area in two screen points&#39;,\n            x: 100,\n            y: 100\n        }, {\n            x: &#39;90%&#39;,\n            y: &#39;10%&#39;\n        }\n    ]\n]\n</code></pre>","properties":{"0":{"type":["Object"],"description":"<p>Specify the left-top point.</p>\n","properties":{"valueIndex":{"type":["number"]},"valueDim":{"type":["string"]},"coord":{"type":["Array"]},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"itemStyle":{"type":["Object"],"description":"<p>Style of the item.\n<code>itemStyle</code> of start point and end point will be merged together.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"<p>Label style of the item.\nLabel style of start point and end point will be merged together.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}},"1":{"type":["Object"],"description":"<p>Specify the right-bottom point.</p>\n","properties":{"valueIndex":{"type":["number"]},"valueDim":{"type":["string"]},"coord":{"type":["Array"]},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"itemStyle":{"type":["Object"],"description":"<p>Style of the item.\n<code>itemStyle</code> of start point and end point will be merged together.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"<p>Label style of the item.\nLabel style of start point and end point will be merged together.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"silent":{"type":["boolean"],"default":false},"tooltip":{"type":["*"],"description":"<p>tooltip settings in this series.</p>\n","properties":{"position":{"type":["string","Array"]},"formatter":{"type":["string","Function"]},"backgroundColor":{"type":["Color"],"default":"'rgba(50,50,50,0.7)'"},"borderColor":{"type":["Color"],"default":"'#333'"},"borderWidth":{"type":["number"],"default":0},"padding":{"type":["number"],"default":5},"textStyle":{"type":["Object"],"description":"<p><br></p>\n<blockquote>\n<p><strong>Notice：</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code>&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The text syle of tooltip&#39;s floating layer.</p>\n","properties":{"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":14},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"extraCssText":{"type":["string"]}}}}},{"type":["Object"],"description":"<p>The series in parallel coordinate system.</p>\n<p><br></p>\n<hr>\n<p><strong>Introduction about Parallel coordinates</strong></p>\n<p><a href=\"https://en.wikipedia.org/wiki/Parallel_coordinates\" target=\"_blank\">Parallel Coordinates</a> is a common way of visualizing high-dimensional geometry and analyzing multivariate data.</p>\n<p>For example, <a href=\"#series-parallel.data\">series-parallel.data</a> is the following data:</p>\n<pre><code class=\"lang-javascript\">[\n    [1,  55,  9,   56,  0.46,  18,  6,  &#39;good&#39;],\n    [2,  25,  11,  21,  0.65,  34,  9,  &#39;excellent&#39;],\n    [3,  56,  7,   63,  0.3,   14,  5,  &#39;good&#39;],\n    [4,  33,  7,   29,  0.33,  16,  6,  &#39;excellent&#39;],\n    { // Data item can also be an Object, so that perticular settings of its line can be set here.\n        value: [5,  42,  24,  44,  0.76,  40,  16, &#39;excellent&#39;]\n        lineStyle: {...},\n    }\n    ...\n]\n</code></pre>\n<p>In data above, each row is a &quot;data item&quot;, and each column represents a &quot;dimension&quot;. For example, the meanings of columns above are: &quot;data&quot;, &quot;AQI&quot;, &quot;PM2.5&quot;, &quot;PM10&quot;, &quot;carbon monoxide level&quot;, &quot;nitrogen dioxide level&quot;, and &quot;sulfur dioxide level&quot;.</p>\n<p>Parallel coordinates are much used to visualize multi-dimension data shown above. Each axis represents a dimension (namely, a column), and each line represents a data item. Data can be brush-selected on axes. For example:</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=doc-example/parallel-all&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n<hr>\n<p><strong>Brief about Configuration</strong></p>\n<p>Basic configuration parallel coordinates is shown as follow:</p>\n<pre><code class=\"lang-javascript\">option = {\n    parallelAxis: [                     // Definitions of axes.\n        {dim: 0, name: schema[0].text}, // Each axis has a &#39;dim&#39; attribute, representing dimension index in data.\n        {dim: 1, name: schema[1].text},\n        {dim: 2, name: schema[2].text},\n        {dim: 3, name: schema[3].text},\n        {dim: 4, name: schema[4].text},\n        {dim: 5, name: schema[5].text},\n        {dim: 6, name: schema[6].text},\n        {dim: 7, name: schema[7].text,\n            type: &#39;category&#39;,           // Also supports category data.\n            data: [&#39;Excellent&#39;, &#39;good&#39;, &#39;light pollution&#39;, &#39;moderate pollution&#39;, &#39;heavy pollution&#39;, &#39;severe pollution&#39;]\n        }\n    ],\n    parallel: {                         // Definition of a parallel coordinate system.\n        left: &#39;5%&#39;,                     // Location of parallel coordinate system.\n        right: &#39;13%&#39;,\n        bottom: &#39;10%&#39;,\n        top: &#39;20%&#39;,\n        parallelAxisDefault: {          // A pattern for axis definition, which can avoid repeating in `parallelAxis`.\n            type: &#39;value&#39;,\n            nameLocation: &#39;end&#39;,\n            nameGap: 20\n        }\n    },\n    series: [                           // Here the three series sharing the same parallel coordinate system.\n        {\n            name: &#39;Beijing&#39;,\n            type: &#39;parallel&#39;,           // The type of this series is &#39;parallel&#39;\n            data: [\n                [1,  55,  9,   56,  0.46,  18,  6,  &#39;good&#39;],\n                [2,  25,  11,  21,  0.65,  34,  9,  &#39;excellent&#39;],\n                ...\n            ]\n        },\n        {\n            name: &#39;Shanghai&#39;,\n            type: &#39;parallel&#39;,\n            data: [\n                [3,  56,  7,   63,  0.3,   14,  5,  &#39;good&#39;],\n                [4,  33,  7,   29,  0.33,  16,  6,  &#39;excellent&#39;],\n                ...\n            ]\n        },\n        {\n            name: &#39;Guangzhou&#39;,\n            type: &#39;parallel&#39;,\n            data: [\n                [4,  33,  7,   29,  0.33,  16,  6,  &#39;excellent&#39;],\n                [5,  42,  24,  44,  0.76,  40,  16, &#39;excellent&#39;],\n                ...\n            ]\n        }\n    ]\n};\n</code></pre>\n<p>Three components are involved here: <a href=\"#parallel\">parallel</a>, <a href=\"#parallelAxis\">parallelAxis</a>, <a href=\"#series-parallel\">series-parallel</a></p>\n<ul>\n<li><p><a href=\"#parallel\">parallel</a></p>\n<p>  This component is the coordinate system. One or more series (like &quot;Beijing&quot;, &quot;Shanghai&quot;, and &quot;Guangzhou&quot; in the above example) can share one coordinate system.</p>\n<p>  Like other coordinate systems, multiple parallel coordinate systems can be created in one echarts instance.</p>\n<p>  Position setting is also carried out here.</p>\n</li>\n<li><p><a href=\"#parallelAxis\">parallelAxis</a></p>\n<p>  This is axis configuration. Multiple axes are needed in parallel coordinates.</p>\n<p>  <a href=\"#parallelAxis.parallelIndex\">parallelAxis.parallelIndex</a> is used to specify which coordinate system this axis belongs to. The first coordinate system is used by default.</p>\n</li>\n<li><p><a href=\"#series-parallel\">series-parallel</a></p>\n<p>  This is the definition of parallel series, which will be drawn on parallel coordinate system.</p>\n<p>  <a href=\"#parallelAxis.parallelIndex\">parallelAxis.parallelIndex</a> is used to specify which coordinate system this axis belongs to. The first coordinate system is used by default.</p>\n</li>\n</ul>\n<p><br></p>\n<hr>\n<p><strong>Notes and Best Practices</strong></p>\n<p>When configuring multiple <a href=\"#parallelAxis\">parallelAxis</a>, there might be some common attributes in each axis configuration. To avoid writing them repeatly, they can be put under <a href=\"#parallel.parallelAxisDefault\">parallel.parallelAxisDefault</a>. Before initializing axis, configurations in <a href=\"#parallel.parallelAxisDefault\">parallel.parallelAxisDefault</a> will be merged into <a href=\"#parallelAxis\">parallelAxis</a> to generate the final axis configuration.</p>\n<p><strong>If data is too large and cause bad performance</strong></p>\n<p>It is suggested to set <a href=\"#series-parallel.lineStyle.width\">series-parallel.lineStyle.width</a> to be <code>0.5</code> (or less), which may improve performance significantly.</p>\n<p><br></p>\n<hr>\n<p><strong>Display High-Dimension Data</strong></p>\n<p>When dimension number is extremely large, say, more than 50 dimensions, there will be more than 50 axes, which may hardly display in a page.</p>\n<p>In this case, you may use <a href=\"#parallel.axisExpandable\">parallel.axisExpandable</a> to improve the display. See this example:</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=map-parallel-prices&edit=1&reset=1\" width=\"600\" height=\"460\" ></iframe>\n\n\n\n\n\n\n\n\n","properties":{"type":{"type":["string"],"default":"'parallel'"},"id":{"type":["string"]},"coordinateSystem":{"type":["string"],"default":"'parallel'"},"parallelIndex":{"type":["number"],"default":0},"name":{"type":["string"]},"lineStyle":{"type":["Object"],"description":"<p>Line style.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":2},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"],"default":0.45},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":2},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"],"default":0.45}}}}},"inactiveOpacity":{"type":["number"],"default":0.05},"activeOpacity":{"type":["number"],"default":1},"realtime":{"type":["boolean"],"default":true},"data":{"type":["Array"],"description":"<p>For example, <a href=\"#series-parallel.data\">series-parallel.data</a> is the following data:</p>\n<pre><code class=\"lang-javascript\">[\n    [1,  55,  9,   56,  0.46,  18,  6,  &#39;good&#39;],\n    [2,  25,  11,  21,  0.65,  34,  9,  &#39;excellent&#39;],\n    [3,  56,  7,   63,  0.3,   14,  5,  &#39;good&#39;],\n    [4,  33,  7,   29,  0.33,  16,  6,  &#39;excellent&#39;],\n    { // Data item can also be an Object, so that perticular settings of its line can be set here.\n        value: [5,  42,  24,  44,  0.76,  40,  16, &#39;excellent&#39;]\n        lineStyle: {...},\n    }\n    ...\n]\n</code></pre>\n<p>In data above, each row is a &quot;data item&quot;, and each column represents a &quot;dimension&quot;. For example, the meanings of columns above are: &quot;data&quot;, &quot;AQI&quot;, &quot;PM2.5&quot;, &quot;PM10&quot;, &quot;carbon monoxide level&quot;, &quot;nitrogen dioxide level&quot;, and &quot;sulfur dioxide level&quot;.</p>\n","items":{"type":"Object","properties":{"name":{"type":["string"]},"value":{"type":["Array"]},"lineStyle":{"type":["Object"]},"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":2},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"],"description":"<p>Opacity of the component. Supports value from 0 to 1, and the component will not be drawn when set to 0.</p>\n","default":0.45,"properties":{"emphasis":{"type":["Object"]},"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":2},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"],"default":0.45}}}}}},"zlevel":{"type":["number"],"default":0},"z":{"type":["number"],"default":2},"silent":{"type":["boolean"],"default":false},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"linear"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0},"tooltip":{"type":["*"],"description":"<p>tooltip settings in this series.</p>\n","properties":{"position":{"type":["string","Array"]},"formatter":{"type":["string","Function"]},"backgroundColor":{"type":["Color"],"default":"'rgba(50,50,50,0.7)'"},"borderColor":{"type":["Color"],"default":"'#333'"},"borderWidth":{"type":["number"],"default":0},"padding":{"type":["number"],"default":5},"textStyle":{"type":["Object"],"description":"<p><br></p>\n<blockquote>\n<p><strong>Notice：</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code>&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The text syle of tooltip&#39;s floating layer.</p>\n","properties":{"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":14},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"extraCssText":{"type":["string"]}}}}},{"type":["Object"],"description":"<p><strong>Lines graph</strong></p>\n<p>It is used to draw the line data with the information about &quot;from&quot; and &quot;to&quot;; and it is applied fot drawing the air routes on map, which visualizes these routes.</p>\n<p>ECharts 2.x uses the <code>markLine</code> to draw the migrating effect, while in ECharts 3, the <code>lines</code> graph is recommended to be used.</p>\n<p><strong>Migrating example: </strong></p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=geo-lines&edit=1&reset=1\" width=\"700\" height=\"500\" ></iframe>\n\n\n\n","properties":{"type":{"type":["string"],"default":"'lines'"},"id":{"type":["string"]},"name":{"type":["string"]},"coordinateSystem":{"type":["string"],"default":"'geo'"},"xAxisIndex":{"type":["number"],"default":0},"yAxisIndex":{"type":["number"],"default":0},"geoIndex":{"type":["number"],"default":0},"polyline":{"type":["boolean"],"default":false},"effect":{"type":["Object"],"description":"<p>The setting about special effect of lines.</p>\n<p><strong>Tips: </strong>All the graphs with trail effect should be put on a individual layer, which means that <a href=\"#series-lines.zlevel\">zlevel</a> need to be different with others. And the animation (<a href=\"#series-lines.animation\">animation</a>: false)  of this layer is suggested to be turned off at the meanwhile. Otherwise, other graphic elements in other series and the <a href=\"#series-lines.label\">label</a> of animation would produce unnecessary ghosts.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"period":{"type":["number"],"default":4},"delay":{"type":["number","Function"]},"constantSpeed":{"type":["number"],"default":0},"symbol":{"type":["string"],"default":"'circle'"},"symbolSize":{"type":["Array","number"],"default":3},"color":{"type":["Color"]},"trailLength":{"type":["number"],"default":0.2},"loop":{"type":["boolean"],"default":true}}},"large":{"type":["boolean"],"default":true},"largeThreshold":{"type":["number"],"default":2000},"symbol":{"type":["string","Array"],"default":"'none'"},"symbolSize":{"type":["number","Array"],"default":10},"lineStyle":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"'self-adaptive'"},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"],"description":"<p>Opacity of the component. Supports value from 0 to 1, and the component will not be drawn when set to 0.</p>\n","default":0.5,"properties":{"curveness":{"type":["number"],"default":0}}},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"data":{"type":["Array"],"description":"<p>The data set of lines.</p>\n","items":{"type":"Object","properties":{"name":{"type":["string"]},"coords":{"type":["Array"]},"lineStyle":{"type":["Object"],"description":"<p>The line style of this data item.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"description":"<p>Edge curvature, which supports value from 0 to 1. The larger the value, the greater the curvature.</p>\n","default":0,"properties":{"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0}}}}}}},"label":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}}},"markPoint":{"type":["Object"],"description":"<p>Mark point in a chart.</p>\n","properties":{"symbol":{"type":["string"],"default":"'pin'"},"symbolSize":{"type":["number","Array","Function"],"default":50},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"silent":{"type":["boolean"],"default":false},"label":{"type":["Object"],"description":"<p>Label of mark point.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Mark point style.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["Array"],"description":"<p>Data array for mark points, each of which is an object. Here are some ways to assign mark point position.</p>\n<ol>\n<li>Assign coordinate according to container with <a href=\"#series-lines.markPoint.data.x\">x</a>, <a href=\"#series-lines.markPoint.data.y\">y</a> attribute, in which pixel values and percentage are supported.</li>\n</ol>\n<p>When multiple attributes exist, priority is as the above order.</p>\n<p><strong>For example: </strong></p>\n<pre><code class=\"lang-js\">data: [\n    {\n        name: &#39;screen coordinate&#39;,\n        x: 100,\n        y: 100\n    }\n]\n</code></pre>\n","items":{"type":"Object","properties":{"name":{"type":["string"],"default":"''"},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"itemStyle":{"type":["Object"],"description":"<p>Mark point style.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"markLine":{"type":["*"],"description":"<p>Use a line in the chart to illustrate.</p>\n","properties":{"silent":{"type":["boolean"],"default":false},"symbol":{"type":["string","Array"]},"symbolSize":{"type":["number","Array"]},"precision":{"type":["number"],"default":2},"label":{"type":["Object"],"description":"<p>Mark line text.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]}}}}},"lineStyle":{"type":["Object"],"description":"<p>Mark line style.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["*"],"description":"<p>Data array of marking line. Every array item can be an array of one or two values, representing starting and ending point of the line, and every item is an object. Here are several ways to assign the positions of starting and ending point.</p>\n<ol>\n<li>Assign coordinate according to container with <a href=\"#series-lines.markLine.data.0.x\">x</a>, <a href=\"#series-lines.markLine.data.0.y\">y</a> attribute, in which pixel values and percentage are supported.</li>\n</ol>\n<p>When multiple attributes exist, priority is as the above order.</p>\n<pre><code>data: [\n    [\n        {\n            name: &#39;Mark line between two points&#39;,\n            x: 100,\n            y: 100\n        },\n        {\n            x: 500,\n            y: 200\n        }\n    ]\n]\n</code></pre>","properties":{"0":{"type":["Object"],"description":"<p>Data of the starting point.</p>\n","properties":{"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"lineStyle":{"type":["Object"],"description":"<p>Line style of this data item, which will be merged with <code>lineStyle</code> of starting point and ending point.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0}}}}},"label":{"type":["Object"],"description":"<p>Label of this data item, which will be merged with <code>label</code> of starting point and ending point.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]}}}}}}},"1":{"type":["Object"],"description":"<p>Data of the ending point.</p>\n","properties":{"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"lineStyle":{"type":["Object"],"description":"<p>Line style of this data item, which will be merged with <code>lineStyle</code> of starting point and ending point.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0}}}}},"label":{"type":["Object"],"description":"<p>Label of this data item, which will be merged with <code>label</code> of starting point and ending point.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]}}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"markArea":{"type":["Object"],"description":"<p>Used to mark an area in chart. For example, mark a time interval.</p>\n","properties":{"silent":{"type":["boolean"],"default":false},"label":{"type":["Object"],"description":"<p>Label in mark area.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Style of the mark area.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["*"],"description":"<p>The scope of the area is defined by <code>data</code>, which is an array with two item, representing the left-top point and the right-bottom point of rectangle area. Each item can be defined as follows:</p>\n<ol>\n<li>Specify the coordinate in screen coordinate system using <a href=\"#series-lines.markArea.data.0.x\">x</a>, <a href=\"#series-lines.markArea.data.0.y\">y</a>, where the unit is pixel (e.g., the value is <code>5</code>), or percent (e.g., the value is <code>&#39;35%&#39;</code>).</li>\n</ol>\n<p>The priority follows as above if more than one above definition used.</p>\n<pre><code>data: [\n    [\n        {\n            name: &#39;Mark area in two screen points&#39;,\n            x: 100,\n            y: 100\n        }, {\n            x: &#39;90%&#39;,\n            y: &#39;10%&#39;\n        }\n    ]\n]\n</code></pre>","properties":{"0":{"type":["Object"],"description":"<p>Specify the left-top point.</p>\n","properties":{"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"itemStyle":{"type":["Object"],"description":"<p>Style of the item.\n<code>itemStyle</code> of start point and end point will be merged together.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"<p>Label style of the item.\nLabel style of start point and end point will be merged together.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}},"1":{"type":["Object"],"description":"<p>Specify the right-bottom point.</p>\n","properties":{"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"itemStyle":{"type":["Object"],"description":"<p>Style of the item.\n<code>itemStyle</code> of start point and end point will be merged together.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"<p>Label style of the item.\nLabel style of start point and end point will be merged together.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"zlevel":{"type":["number"],"default":0},"z":{"type":["number"],"default":2},"silent":{"type":["boolean"],"default":false},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},{"type":["Object"],"description":"<p><strong>relation graph</strong></p>\n<p>Graph is a diagram to represent <a href=\"#series-graph.nodes\">nodes</a> and the <a href=\"#series-graph.links\">links</a> connecting nodes.</p>\n<p><strong>Tips: </strong> In ECharts 2.x , the diagram of <code>force</code> type will not be available in ECharts 3 any more, which has been changed to use <code>graph</code> to show graph data. If you want to use force to lead the layout, you can set the  <a href=\"#series-graph.layout\">layout</a> configuration as <code>&#39;force&#39;</code>.</p>\n<p><strong>Example: </strong></p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=graph&reset=1&edit=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n","properties":{"type":{"type":["string"],"default":"'graph'"},"id":{"type":["string"]},"name":{"type":["string"]},"legendHoverLink":{"type":["boolean"],"default":true},"coordinateSystem":{"type":["string"],"default":null},"xAxisIndex":{"type":["number"],"default":0},"yAxisIndex":{"type":["number"],"default":0},"polarIndex":{"type":["number"],"default":0},"geoIndex":{"type":["number"],"default":0},"calendarIndex":{"type":["number"],"default":0},"hoverAnimation":{"type":["boolean"]},"layout":{"type":["string"],"default":"'none'"},"circular":{"type":["Object"],"description":"<p>Configuration about circular layout.</p>\n","properties":{"rotateLabel":{"type":["boolean"],"default":false}}},"force":{"type":["Object"],"description":"<p>Configuration items about force-directed layout. Force-directed layout simulates spring/charge model, which will add a repulsion between 2 nodes and add a attraction between 2 nodes of each edge. In each iteration nodes will move under the effect of repulsion and attraction. After several iterations, the nodes will be static in a balanced position. As a result, the energy local minimum of this whole model will be realized.</p>\n<p>The result of force-directed layout has a good symmetries and clustering, which is also aesthetically pleasing.</p>\n","properties":{"initLayout":{"type":["string"]},"repulsion":{"type":["Array","number"],"default":50},"gravity":{"type":["number"],"default":0.1},"edgeLength":{"type":["Array","number"],"default":30},"layoutAnimation":{"type":["boolean"],"default":true}}},"roam":{"type":["boolean"],"default":false},"nodeScaleRatio":{"type":["number"],"default":0.6},"draggable":{"type":["boolean"],"default":false},"symbol":{"type":["string"],"default":"'circle'"},"symbolSize":{"type":["number","Array","Function"],"default":10},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"focusNodeAdjacency":{"type":["boolean"],"default":false},"edgeSymbol":{"type":["Array","string"],"default":"['none', 'none']"},"edgeSymbolSize":{"type":["Array","number"],"default":10},"cursor":{"type":["string"],"default":"'pointer'"},"itemStyle":{"type":["Object"],"description":"<p>Graphic style of , <code>emphasis</code> is the style when it is highlighted, like being hovered by mouse, or highlighted via legend connect.</p>\n","properties":{"color":{"type":["Color","Function"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"lineStyle":{"type":["Object"],"description":"<p>The style of edge line. <a href=\"#series-graph.lineStyle.color\">lineStyle.color</a> can be <code>&#39;source&#39;</code> or <code>&#39;target&#39;</code>, which will use the color of source node or target node.</p>\n","properties":{"color":{"type":["Color"],"default":"'#aaa'"},"width":{"type":["number"],"default":1},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"],"default":0.5},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"<p>Text label of , to explain some data information about graphic item like value, name and so on. <code>label</code> is placed under <code>itemStyle</code> in ECharts 2.x. In ECharts 3, to make the configuration structure flatter, <code>label</code>is taken to be at the same level with <code>itemStyle</code>, and has <code>emphasis</code> as <code>itemStyle</code> does.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"edgeLabel":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string"],"default":"'middle'"},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string"],"default":"'middle'"},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"categories":{"type":["Array"],"description":"<p>The categories of node, which is optional.\nIf there is a classification of nodes, the category of each node can be assigned through <a href=\"#series-graph.data.category\">data[i].category</a>. And the style of category will also be applied to the style of nodes. <code>categories</code> can also be used in <a href=\"#legend\">legend</a>.</p>\n","items":{"type":"Object","properties":{"name":{"type":["string"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"itemStyle":{"type":["Object"],"description":"<p>The style of node in this category.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"<p>The label style of node in this category.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"inside"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}}},"data":{"type":["Array"],"description":"<p>Nodes list of graph.</p>\n<pre><code class=\"lang-js\">data: [{\n    name: &#39;1&#39;,\n    x: 10,\n    y: 10,\n    value: 10\n}, {\n    name: &#39;2&#39;,\n    x: 100,\n    y: 100,\n    value: 20,\n    symbolSize: 20,\n    itemStyle: {\n        color: &#39;red&#39;\n    }\n}]\n</code></pre>\n","items":{"type":"Object","properties":{"name":{"type":["string"]},"x":{"type":["number"]},"y":{"type":["number"]},"fixed":{"type":["boolean"]},"value":{"type":["number","Array"]},"category":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"itemStyle":{"type":["Object"],"description":"<p>The style of this node.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"<p>The label style of this node.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"tooltip":{"type":["*"],"description":"<p>tooltip settings in this series data.</p>\n","properties":{"position":{"type":["string","Array"]},"formatter":{"type":["string","Function"]},"backgroundColor":{"type":["Color"],"default":"'rgba(50,50,50,0.7)'"},"borderColor":{"type":["Color"],"default":"'#333'"},"borderWidth":{"type":["number"],"default":0},"padding":{"type":["number"],"default":5},"textStyle":{"type":["Object"],"description":"<blockquote>\n<p><strong>Notice：</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code>&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The text syle of tooltip&#39;s floating layer.</p>\n","properties":{"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":14},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"extraCssText":{"type":["string"]}}}}}},"nodes":{"type":["Array"]},"links":{"type":["Array"],"description":"<p>Relational data between nodes. Example:</p>\n<pre><code class=\"lang-js\">links: [{\n    source: &#39;n1&#39;,\n    target: &#39;n2&#39;\n}, {\n    source: &#39;n2&#39;,\n    target: &#39;n3&#39;\n}]\n</code></pre>\n","items":{"type":"Object","properties":{"source":{"type":["string"]},"target":{"type":["string"]},"lineStyle":{"type":["Object"],"description":"<p>Line style of edges.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}}}}},"edges":{"type":["Array"]},"markPoint":{"type":["Object"],"description":"<p>Mark point in a chart.</p>\n","properties":{"symbol":{"type":["string"],"default":"'pin'"},"symbolSize":{"type":["number","Array","Function"],"default":50},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"silent":{"type":["boolean"],"default":false},"label":{"type":["Object"],"description":"<p>Label of mark point.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Mark point style.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["Array"],"description":"<p>Data array for mark points, each of which is an object. Here are some ways to assign mark point position.</p>\n<ol>\n<li>Assign coordinate according to container with <a href=\"#series-graph.markPoint.data.x\">x</a>, <a href=\"#series-graph.markPoint.data.y\">y</a> attribute, in which pixel values and percentage are supported.</li>\n</ol>\n<p>When multiple attributes exist, priority is as the above order.</p>\n<p><strong>For example: </strong></p>\n<pre><code class=\"lang-js\">data: [\n    {\n        name: &#39;screen coordinate&#39;,\n        x: 100,\n        y: 100\n    }\n]\n</code></pre>\n","items":{"type":"Object","properties":{"name":{"type":["string"],"default":"''"},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"itemStyle":{"type":["Object"],"description":"<p>Mark point style.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"markLine":{"type":["*"],"description":"<p>Use a line in the chart to illustrate.</p>\n","properties":{"silent":{"type":["boolean"],"default":false},"symbol":{"type":["string","Array"]},"symbolSize":{"type":["number","Array"]},"precision":{"type":["number"],"default":2},"label":{"type":["Object"],"description":"<p>Mark line text.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]}}}}},"lineStyle":{"type":["Object"],"description":"<p>Mark line style.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["*"],"description":"<p>Data array of marking line. Every array item can be an array of one or two values, representing starting and ending point of the line, and every item is an object. Here are several ways to assign the positions of starting and ending point.</p>\n<ol>\n<li>Assign coordinate according to container with <a href=\"#series-graph.markLine.data.0.x\">x</a>, <a href=\"#series-graph.markLine.data.0.y\">y</a> attribute, in which pixel values and percentage are supported.</li>\n</ol>\n<p>When multiple attributes exist, priority is as the above order.</p>\n<pre><code>data: [\n    [\n        {\n            name: &#39;Mark line between two points&#39;,\n            x: 100,\n            y: 100\n        },\n        {\n            x: 500,\n            y: 200\n        }\n    ]\n]\n</code></pre>","properties":{"0":{"type":["Object"],"description":"<p>Data of the starting point.</p>\n","properties":{"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"lineStyle":{"type":["Object"],"description":"<p>Line style of this data item, which will be merged with <code>lineStyle</code> of starting point and ending point.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0}}}}},"label":{"type":["Object"],"description":"<p>Label of this data item, which will be merged with <code>label</code> of starting point and ending point.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]}}}}}}},"1":{"type":["Object"],"description":"<p>Data of the ending point.</p>\n","properties":{"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"lineStyle":{"type":["Object"],"description":"<p>Line style of this data item, which will be merged with <code>lineStyle</code> of starting point and ending point.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0}}}}},"label":{"type":["Object"],"description":"<p>Label of this data item, which will be merged with <code>label</code> of starting point and ending point.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]}}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"markArea":{"type":["Object"],"description":"<p>Used to mark an area in chart. For example, mark a time interval.</p>\n","properties":{"silent":{"type":["boolean"],"default":false},"label":{"type":["Object"],"description":"<p>Label in mark area.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Style of the mark area.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["*"],"description":"<p>The scope of the area is defined by <code>data</code>, which is an array with two item, representing the left-top point and the right-bottom point of rectangle area. Each item can be defined as follows:</p>\n<ol>\n<li>Specify the coordinate in screen coordinate system using <a href=\"#series-graph.markArea.data.0.x\">x</a>, <a href=\"#series-graph.markArea.data.0.y\">y</a>, where the unit is pixel (e.g., the value is <code>5</code>), or percent (e.g., the value is <code>&#39;35%&#39;</code>).</li>\n</ol>\n<p>The priority follows as above if more than one above definition used.</p>\n<pre><code>data: [\n    [\n        {\n            name: &#39;Mark area in two screen points&#39;,\n            x: 100,\n            y: 100\n        }, {\n            x: &#39;90%&#39;,\n            y: &#39;10%&#39;\n        }\n    ]\n]\n</code></pre>","properties":{"0":{"type":["Object"],"description":"<p>Specify the left-top point.</p>\n","properties":{"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"itemStyle":{"type":["Object"],"description":"<p>Style of the item.\n<code>itemStyle</code> of start point and end point will be merged together.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"<p>Label style of the item.\nLabel style of start point and end point will be merged together.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}},"1":{"type":["Object"],"description":"<p>Specify the right-bottom point.</p>\n","properties":{"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"itemStyle":{"type":["Object"],"description":"<p>Style of the item.\n<code>itemStyle</code> of start point and end point will be merged together.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"<p>Label style of the item.\nLabel style of start point and end point will be merged together.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"zlevel":{"type":["number"],"default":0},"z":{"type":["number"],"default":2},"left":{"type":["string","number"],"default":"'center'"},"top":{"type":["string","number"],"default":"'middle'"},"right":{"type":["string","number"],"default":"'auto'"},"bottom":{"type":["string","number"],"default":"'auto'"},"width":{"type":["string","number"],"default":"auto"},"height":{"type":["string","number"],"default":"auto"},"silent":{"type":["boolean"],"default":false},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0},"tooltip":{"type":["*"],"description":"<p>tooltip settings in this series.</p>\n","properties":{"position":{"type":["string","Array"]},"formatter":{"type":["string","Function"]},"backgroundColor":{"type":["Color"],"default":"'rgba(50,50,50,0.7)'"},"borderColor":{"type":["Color"],"default":"'#333'"},"borderWidth":{"type":["number"],"default":0},"padding":{"type":["number"],"default":5},"textStyle":{"type":["Object"],"description":"<p><br></p>\n<blockquote>\n<p><strong>Notice：</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code>&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The text syle of tooltip&#39;s floating layer.</p>\n","properties":{"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":14},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"extraCssText":{"type":["string"]}}}}},{"type":["Object"],"description":"<p><strong> Sankey Graphs </strong></p>\n<p>Sankey graphs are a specific type of streamgraphs, in which the width of each branch is shown proportionally to the flow quantity. These graphs are typically used to visualize energy or material or cost transfers between processes. They can also visualize the energy accounts, material flow accounts on a regional or national level, and also the breakdown of cost of item or services.</p>\n<p><strong>Example: </strong></p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=sankey-energy&edit=1&reset=1\" width=\"700\" height=\"580\" ></iframe>\n\n\n\n<p><br>\n<strong>Visual Encoding: </strong></p>\n<p>The sankey graphs encodes each <code>node</code> of the raw data into a small rectangular. And different nodes are presented in different colors as far as possible. The <code>label</code> next to the small rectangular, which encoding the name of the node.</p>\n<p>In addition, the edge between two small rectangulars in the graph encoding the <code>link</code> of the raw data. The width of edge is shown proportionally to the <code>value</code> of <code>link</code>.</p>\n","properties":{"type":{"type":["string"],"default":"'sankey'"},"id":{"type":["string"]},"zlevel":{"type":["number"],"default":0},"z":{"type":["number"],"default":2},"left":{"type":["string","number"],"default":"5%"},"top":{"type":["string","number"],"default":"5%"},"right":{"type":["string","number"],"default":"20%"},"bottom":{"type":["string","number"],"default":"5%"},"width":{"type":["string","number"],"default":null},"height":{"type":["string","number"],"default":null},"nodeWidth":{"type":["number"],"default":20},"nodeGap":{"type":["number"],"default":8},"layoutIterations":{"type":["number"],"default":32},"label":{"type":["Object"],"description":"<p><code>label</code> describes the text label style in each rectangular node.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string","Array"],"default":"'right'"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>The style of node rectangle in sankey graphs.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"'#aaa'"},"borderWidth":{"type":["number"],"default":1},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"lineStyle":{"type":["Object"],"description":"<p>The line style of sankey graph, in which <a href=\"#series-sankey.lineStyle.color\">lineStyle.color</a> can be assigned to the value of <code>&#39;source&#39;</code> of <code>&#39;target&#39;</code>, then the edge will automatically take the source node or target node color as its own color.</p>\n","properties":{"color":{"type":["Color"],"default":"\"'#314656'\""},"opacity":{"type":["number"],"default":0.2},"curveness":{"type":["number"],"default":0.5},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"'#314656'\""},"opacity":{"type":["number"],"default":0.2},"curveness":{"type":["number"],"default":0.5},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0}}}}},"data":{"type":["Array"],"description":"<p>Data array of  series, which can be a single data value, like:</p>\n<pre><code class=\"lang-js\">[12, 34, 56, 10, 23]\n</code></pre>\n<p>Or, if need extra dimensions for components like <a href=\"#visualMap\">visualMap</a> to map to graphic attributes like color, it can also be in the form of array. For example:</p>\n<pre><code class=\"lang-js\">[[12, 14], [34, 50], [56, 30], [10, 15], [23, 10]]\n</code></pre>\n<p>In this case, we can assgin the second value in each arrary item to <a href=\"#visualMap\">visualMap</a> component.</p>\n<p>More likely, we need to assign name to each data item, in which case each item should be an object:</p>\n<pre><code class=\"lang-js\">[{\n    // name of date item\n    name: &#39;data1&#39;,\n    // value of date item is 8\n    value: 10\n}, {\n    name: &#39;data2&#39;,\n    value: 20\n}]\n</code></pre>\n<p>Each data item can be further custerized:</p>\n<pre><code class=\"lang-js\">[{\n    name: &#39;data1&#39;,\n    value: 10\n}, {\n    // name of data item\n    name: &#39;data2&#39;,\n    value : 56,\n    // user-defined label format that only useful for this data item\n    label: {},\n    // user-defined special itemStyle that only useful for this data item\n    itemStyle:{}\n}]\n</code></pre>\n","items":{"type":"Object","properties":{"name":{"type":["string"]},"value":{"type":["number","Array"]},"itemStyle":{"type":["Object"],"description":"<p>The style of this node.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"<p>The lable style of this node.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"tooltip":{"type":["*"],"description":"<p>tooltip settings in this series data.</p>\n","properties":{"position":{"type":["string","Array"]},"formatter":{"type":["string","Function"]},"backgroundColor":{"type":["Color"],"default":"'rgba(50,50,50,0.7)'"},"borderColor":{"type":["Color"],"default":"'#333'"},"borderWidth":{"type":["number"],"default":0},"padding":{"type":["number"],"default":5},"textStyle":{"type":["Object"],"description":"<blockquote>\n<p><strong>Notice：</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code>&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The text syle of tooltip&#39;s floating layer.</p>\n","properties":{"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":14},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"extraCssText":{"type":["string"]}}}}}},"nodes":{"type":["Array"]},"links":{"type":["Array"],"description":"<p>The links data between nodes. For instance:</p>\n<pre><code class=\"lang-js\">links: [{\n    source: &#39;n1&#39;,\n    target: &#39;n2&#39;\n}, {\n    source: &#39;n2&#39;,\n    target: &#39;n3&#39;\n}]\n</code></pre>\n","items":{"type":"Object","properties":{"source":{"type":["string"]},"target":{"type":["string"]},"value":{"type":["number"]},"lineStyle":{"type":["Object"],"description":"<p>The line stlye of edge.</p>\n","properties":{"color":{"type":["Color"],"default":"\"'#314656'\""},"opacity":{"type":["number"],"default":0.2},"curveness":{"type":["number"],"default":0.5},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"'#314656'\""},"opacity":{"type":["number"],"default":0.2},"curveness":{"type":["number"],"default":0.5},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0}}}}}}}},"edges":{"type":["Array"]},"silent":{"type":["boolean"],"default":false},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"'linear'"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0},"tooltip":{"type":["*"],"description":"<p>tooltip settings in this series.</p>\n","properties":{"position":{"type":["string","Array"]},"formatter":{"type":["string","Function"]},"backgroundColor":{"type":["Color"],"default":"'rgba(50,50,50,0.7)'"},"borderColor":{"type":["Color"],"default":"'#333'"},"borderWidth":{"type":["number"],"default":0},"padding":{"type":["number"],"default":5},"textStyle":{"type":["Object"],"description":"<p><br></p>\n<blockquote>\n<p><strong>Notice：</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code>&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The text syle of tooltip&#39;s floating layer.</p>\n","properties":{"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":14},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"extraCssText":{"type":["string"]}}}}},{"type":["Object"],"description":"<p><strong>Funnel chart</strong></p>\n<p><strong>sample: </strong></p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=funnel&reset=1&edit=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n","properties":{"type":{"type":["string"],"default":"'funnel'"},"id":{"type":["string"]},"name":{"type":["string"]},"min":{"type":["number"],"default":0},"max":{"type":["number"],"default":100},"minSize":{"type":["string"],"default":"'0%'"},"maxSize":{"type":["string"],"default":"'100%'"},"sort":{"type":["string"],"default":"'descending'"},"gap":{"type":["number"],"default":0},"legendHoverLink":{"type":["boolean"],"default":true},"funnelAlign":{"type":["string"],"default":"'center'"},"label":{"type":["Object"],"description":"<p>Text label of funnel chart, to explain some data information about graphic item like value, name and so on. <code>label</code> is placed under <code>itemStyle</code> in ECharts 2.x. In ECharts 3, to make the configuration structure flatter, <code>label</code>is taken to be at the same level with <code>itemStyle</code>, and has <code>emphasis</code> as <code>itemStyle</code> does.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string"],"default":"'outside'"},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"labelLine":{"type":["Object"],"description":"<p>The visual guide line style of label. When <a href=\"#series-funnel.label.position\">label position</a> is set as <code>&#39;left&#39;</code>or<code>&#39;right&#39;</code>, the visual guide line will show.</p>\n","properties":{"show":{"type":["boolean"]},"length":{"type":["number"]},"lineStyle":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}},"emphasis":{"type":["Object"],"description":"<p>The style of visual guide line in emphasis status.</p>\n","properties":{"show":{"type":["boolean"]},"lineStyle":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Graphic style of , <code>emphasis</code> is the style when it is highlighted, like being hovered by mouse, or highlighted via legend connect.</p>\n","properties":{"color":{"type":["Color","Function"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"seriesLayoutBy":{"type":["string"],"default":"'column'"},"datasetIndex":{"type":["number"],"default":0},"data":{"type":["Array"],"description":"<p>Data array of  series, which can be a single data value, like:</p>\n<pre><code class=\"lang-js\">[12, 34, 56, 10, 23]\n</code></pre>\n<p>Or, if need extra dimensions for components like <a href=\"#visualMap\">visualMap</a> to map to graphic attributes like color, it can also be in the form of array. For example:</p>\n<pre><code class=\"lang-js\">[[12, 14], [34, 50], [56, 30], [10, 15], [23, 10]]\n</code></pre>\n<p>In this case, we can assgin the second value in each arrary item to <a href=\"#visualMap\">visualMap</a> component.</p>\n<p>More likely, we need to assign name to each data item, in which case each item should be an object:</p>\n<pre><code class=\"lang-js\">[{\n    // name of date item\n    name: &#39;data1&#39;,\n    // value of date item is 8\n    value: 10\n}, {\n    name: &#39;data2&#39;,\n    value: 20\n}]\n</code></pre>\n<p>Each data item can be further custerized:</p>\n<pre><code class=\"lang-js\">[{\n    name: &#39;data1&#39;,\n    value: 10\n}, {\n    // name of data item\n    name: &#39;data2&#39;,\n    value : 56,\n    // user-defined label format that only useful for this data item\n    label: {},\n    // user-defined special itemStyle that only useful for this data item\n    itemStyle:{}\n}]\n</code></pre>\n","items":{"type":"Object","properties":{"name":{"type":["string"]},"value":{"type":["number"]},"itemStyle":{"type":["Object"],"description":"<p>Graphic style of , <code>emphasis</code> is the style when it is highlighted, like being hovered by mouse, or highlighted via legend connect.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"<p>The label configuration of a single data item.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string"],"default":"'outside'"},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"labelLine":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"]},"length":{"type":["number"]},"lineStyle":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}},"emphasis":{"type":["Object"],"description":"<p>The style of visual guide line in emphasis status.</p>\n","properties":{"show":{"type":["boolean"]},"lineStyle":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}}}},"tooltip":{"type":["*"],"description":"<p>tooltip settings in this series data.</p>\n","properties":{"position":{"type":["string","Array"]},"formatter":{"type":["string","Function"]},"backgroundColor":{"type":["Color"],"default":"'rgba(50,50,50,0.7)'"},"borderColor":{"type":["Color"],"default":"'#333'"},"borderWidth":{"type":["number"],"default":0},"padding":{"type":["number"],"default":5},"textStyle":{"type":["Object"],"description":"<blockquote>\n<p><strong>Notice：</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code>&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The text syle of tooltip&#39;s floating layer.</p>\n","properties":{"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":14},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"extraCssText":{"type":["string"]}}}}}},"markPoint":{"type":["Object"],"description":"<p>Mark point in a chart.</p>\n","properties":{"symbol":{"type":["string"],"default":"'pin'"},"symbolSize":{"type":["number","Array","Function"],"default":50},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"silent":{"type":["boolean"],"default":false},"label":{"type":["Object"],"description":"<p>Label of mark point.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Mark point style.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["Array"],"description":"<p>Data array for mark points, each of which is an object. Here are some ways to assign mark point position.</p>\n<ol>\n<li>Assign coordinate according to container with <a href=\"#series-funnel.markPoint.data.x\">x</a>, <a href=\"#series-funnel.markPoint.data.y\">y</a> attribute, in which pixel values and percentage are supported.</li>\n</ol>\n<p>When multiple attributes exist, priority is as the above order.</p>\n<p><strong>For example: </strong></p>\n<pre><code class=\"lang-js\">data: [\n    {\n        name: &#39;screen coordinate&#39;,\n        x: 100,\n        y: 100\n    }\n]\n</code></pre>\n","items":{"type":"Object","properties":{"name":{"type":["string"],"default":"''"},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"itemStyle":{"type":["Object"],"description":"<p>Mark point style.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"markLine":{"type":["*"],"description":"<p>Use a line in the chart to illustrate.</p>\n","properties":{"silent":{"type":["boolean"],"default":false},"symbol":{"type":["string","Array"]},"symbolSize":{"type":["number","Array"]},"precision":{"type":["number"],"default":2},"label":{"type":["Object"],"description":"<p>Mark line text.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]}}}}},"lineStyle":{"type":["Object"],"description":"<p>Mark line style.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["*"],"description":"<p>Data array of marking line. Every array item can be an array of one or two values, representing starting and ending point of the line, and every item is an object. Here are several ways to assign the positions of starting and ending point.</p>\n<ol>\n<li>Assign coordinate according to container with <a href=\"#series-funnel.markLine.data.0.x\">x</a>, <a href=\"#series-funnel.markLine.data.0.y\">y</a> attribute, in which pixel values and percentage are supported.</li>\n</ol>\n<p>When multiple attributes exist, priority is as the above order.</p>\n<pre><code>data: [\n    [\n        {\n            name: &#39;Mark line between two points&#39;,\n            x: 100,\n            y: 100\n        },\n        {\n            x: 500,\n            y: 200\n        }\n    ]\n]\n</code></pre>","properties":{"0":{"type":["Object"],"description":"<p>Data of the starting point.</p>\n","properties":{"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"lineStyle":{"type":["Object"],"description":"<p>Line style of this data item, which will be merged with <code>lineStyle</code> of starting point and ending point.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0}}}}},"label":{"type":["Object"],"description":"<p>Label of this data item, which will be merged with <code>label</code> of starting point and ending point.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]}}}}}}},"1":{"type":["Object"],"description":"<p>Data of the ending point.</p>\n","properties":{"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"lineStyle":{"type":["Object"],"description":"<p>Line style of this data item, which will be merged with <code>lineStyle</code> of starting point and ending point.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0}}}}},"label":{"type":["Object"],"description":"<p>Label of this data item, which will be merged with <code>label</code> of starting point and ending point.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]}}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"markArea":{"type":["Object"],"description":"<p>Used to mark an area in chart. For example, mark a time interval.</p>\n","properties":{"silent":{"type":["boolean"],"default":false},"label":{"type":["Object"],"description":"<p>Label in mark area.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Style of the mark area.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["*"],"description":"<p>The scope of the area is defined by <code>data</code>, which is an array with two item, representing the left-top point and the right-bottom point of rectangle area. Each item can be defined as follows:</p>\n<ol>\n<li>Specify the coordinate in screen coordinate system using <a href=\"#series-funnel.markArea.data.0.x\">x</a>, <a href=\"#series-funnel.markArea.data.0.y\">y</a>, where the unit is pixel (e.g., the value is <code>5</code>), or percent (e.g., the value is <code>&#39;35%&#39;</code>).</li>\n</ol>\n<p>The priority follows as above if more than one above definition used.</p>\n<pre><code>data: [\n    [\n        {\n            name: &#39;Mark area in two screen points&#39;,\n            x: 100,\n            y: 100\n        }, {\n            x: &#39;90%&#39;,\n            y: &#39;10%&#39;\n        }\n    ]\n]\n</code></pre>","properties":{"0":{"type":["Object"],"description":"<p>Specify the left-top point.</p>\n","properties":{"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"itemStyle":{"type":["Object"],"description":"<p>Style of the item.\n<code>itemStyle</code> of start point and end point will be merged together.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"<p>Label style of the item.\nLabel style of start point and end point will be merged together.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}},"1":{"type":["Object"],"description":"<p>Specify the right-bottom point.</p>\n","properties":{"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"itemStyle":{"type":["Object"],"description":"<p>Style of the item.\n<code>itemStyle</code> of start point and end point will be merged together.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"<p>Label style of the item.\nLabel style of start point and end point will be merged together.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0},"tooltip":{"type":["*"],"description":"<p>tooltip settings in this series.</p>\n","properties":{"position":{"type":["string","Array"]},"formatter":{"type":["string","Function"]},"backgroundColor":{"type":["Color"],"default":"'rgba(50,50,50,0.7)'"},"borderColor":{"type":["Color"],"default":"'#333'"},"borderWidth":{"type":["number"],"default":0},"padding":{"type":["number"],"default":5},"textStyle":{"type":["Object"],"description":"<p><br></p>\n<blockquote>\n<p><strong>Notice：</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code>&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The text syle of tooltip&#39;s floating layer.</p>\n","properties":{"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":14},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"extraCssText":{"type":["string"]}}}}},{"type":["Object"],"description":"<p><strong>Gauge chart</strong></p>\n<p><strong>Example: </strong></p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=gauge-car\" width=\"600\" height=\"500\" ></iframe>\n\n\n","properties":{"type":{"type":["string"],"default":"'gauge'"},"id":{"type":["string"]},"name":{"type":["string"]},"radius":{"type":["number","string"],"default":"'75%'"},"startAngle":{"type":["number"],"default":225},"endAngle":{"type":["number"],"default":-45},"clockwise":{"type":["boolean"],"default":true},"min":{"type":["number"],"default":0},"max":{"type":["number"],"default":100},"splitNumber":{"type":["number"],"default":10},"axisLine":{"type":["Object"],"description":"<p>The related configuration about the axis line of gauge chart.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"lineStyle":{"type":["Object"],"description":"<p>The style of the axis line of gauge chart.</p>\n","properties":{"color":{"type":["Array"]},"width":{"type":["number"],"default":30},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"splitLine":{"type":["Object"],"description":"<p>The style of split line.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"length":{"type":["number","string"],"default":30},"lineStyle":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"#eee"},"width":{"type":["number"],"default":2},"type":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"axisTick":{"type":["Object"],"description":"<p>The tick line style.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"splitNumber":{"type":["number"],"default":5},"length":{"type":["number","string"],"default":8},"lineStyle":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"#eee"},"width":{"type":["number"],"default":1},"type":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"axisLabel":{"type":["Object"],"description":"<p>Axis tick label.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}},"pointer":{"type":["Object"],"description":"<p>Gauge chart pointer.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"length":{"type":["string","number"],"default":"'80%'"},"width":{"type":["number"],"default":8}}},"itemStyle":{"type":["Object"],"description":"<p>The style of gauge chart.</p>\n","properties":{"color":{"type":["Color"],"default":"'auto'"},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"title":{"type":["Object"],"description":"<p>The title of gauge chart.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"offsetCenter":{"type":["Array"],"default":"[0, '-40%']"},"color":{"type":["Color"],"default":"'#333'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":15},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}},"detail":{"type":["Object"],"description":"<p>The detail about gauge chart which is used to show data.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderColor":{"type":["string"],"default":"'transparent'"},"offsetCenter":{"type":["Array"],"default":"[0, '40%']"},"color":{"type":["Color"],"default":"'auto'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":15},"lineHeight":{"type":["number"]},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"color":{"type":["Color"],"default":"'auto'"}}}}},"markPoint":{"type":["Object"],"description":"<p>Mark point in a chart.</p>\n","properties":{"symbol":{"type":["string"],"default":"'pin'"},"symbolSize":{"type":["number","Array","Function"],"default":50},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"silent":{"type":["boolean"],"default":false},"label":{"type":["Object"],"description":"<p>Label of mark point.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Mark point style.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["Array"],"description":"<p>Data array for mark points, each of which is an object. Here are some ways to assign mark point position.</p>\n<ol>\n<li>Assign coordinate according to container with <a href=\"#series-gauge.markPoint.data.x\">x</a>, <a href=\"#series-gauge.markPoint.data.y\">y</a> attribute, in which pixel values and percentage are supported.</li>\n</ol>\n<p>When multiple attributes exist, priority is as the above order.</p>\n<p><strong>For example: </strong></p>\n<pre><code class=\"lang-js\">data: [\n    {\n        name: &#39;screen coordinate&#39;,\n        x: 100,\n        y: 100\n    }\n]\n</code></pre>\n","items":{"type":"Object","properties":{"name":{"type":["string"],"default":"''"},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"itemStyle":{"type":["Object"],"description":"<p>Mark point style.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"markLine":{"type":["*"],"description":"<p>Use a line in the chart to illustrate.</p>\n","properties":{"silent":{"type":["boolean"],"default":false},"symbol":{"type":["string","Array"]},"symbolSize":{"type":["number","Array"]},"precision":{"type":["number"],"default":2},"label":{"type":["Object"],"description":"<p>Mark line text.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]}}}}},"lineStyle":{"type":["Object"],"description":"<p>Mark line style.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["*"],"description":"<p>Data array of marking line. Every array item can be an array of one or two values, representing starting and ending point of the line, and every item is an object. Here are several ways to assign the positions of starting and ending point.</p>\n<ol>\n<li>Assign coordinate according to container with <a href=\"#series-gauge.markLine.data.0.x\">x</a>, <a href=\"#series-gauge.markLine.data.0.y\">y</a> attribute, in which pixel values and percentage are supported.</li>\n</ol>\n<p>When multiple attributes exist, priority is as the above order.</p>\n<pre><code>data: [\n    [\n        {\n            name: &#39;Mark line between two points&#39;,\n            x: 100,\n            y: 100\n        },\n        {\n            x: 500,\n            y: 200\n        }\n    ]\n]\n</code></pre>","properties":{"0":{"type":["Object"],"description":"<p>Data of the starting point.</p>\n","properties":{"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"lineStyle":{"type":["Object"],"description":"<p>Line style of this data item, which will be merged with <code>lineStyle</code> of starting point and ending point.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0}}}}},"label":{"type":["Object"],"description":"<p>Label of this data item, which will be merged with <code>label</code> of starting point and ending point.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]}}}}}}},"1":{"type":["Object"],"description":"<p>Data of the ending point.</p>\n","properties":{"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"lineStyle":{"type":["Object"],"description":"<p>Line style of this data item, which will be merged with <code>lineStyle</code> of starting point and ending point.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0}}}}},"label":{"type":["Object"],"description":"<p>Label of this data item, which will be merged with <code>label</code> of starting point and ending point.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]}}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"markArea":{"type":["Object"],"description":"<p>Used to mark an area in chart. For example, mark a time interval.</p>\n","properties":{"silent":{"type":["boolean"],"default":false},"label":{"type":["Object"],"description":"<p>Label in mark area.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Style of the mark area.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["*"],"description":"<p>The scope of the area is defined by <code>data</code>, which is an array with two item, representing the left-top point and the right-bottom point of rectangle area. Each item can be defined as follows:</p>\n<ol>\n<li>Specify the coordinate in screen coordinate system using <a href=\"#series-gauge.markArea.data.0.x\">x</a>, <a href=\"#series-gauge.markArea.data.0.y\">y</a>, where the unit is pixel (e.g., the value is <code>5</code>), or percent (e.g., the value is <code>&#39;35%&#39;</code>).</li>\n</ol>\n<p>The priority follows as above if more than one above definition used.</p>\n<pre><code>data: [\n    [\n        {\n            name: &#39;Mark area in two screen points&#39;,\n            x: 100,\n            y: 100\n        }, {\n            x: &#39;90%&#39;,\n            y: &#39;10%&#39;\n        }\n    ]\n]\n</code></pre>","properties":{"0":{"type":["Object"],"description":"<p>Specify the left-top point.</p>\n","properties":{"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"itemStyle":{"type":["Object"],"description":"<p>Style of the item.\n<code>itemStyle</code> of start point and end point will be merged together.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"<p>Label style of the item.\nLabel style of start point and end point will be merged together.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}},"1":{"type":["Object"],"description":"<p>Specify the right-bottom point.</p>\n","properties":{"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"itemStyle":{"type":["Object"],"description":"<p>Style of the item.\n<code>itemStyle</code> of start point and end point will be merged together.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"<p>Label style of the item.\nLabel style of start point and end point will be merged together.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0},"tooltip":{"type":["*"],"description":"<p>tooltip settings in this series.</p>\n","properties":{"position":{"type":["string","Array"]},"formatter":{"type":["string","Function"]},"backgroundColor":{"type":["Color"],"default":"'rgba(50,50,50,0.7)'"},"borderColor":{"type":["Color"],"default":"'#333'"},"borderWidth":{"type":["number"],"default":0},"padding":{"type":["number"],"default":5},"textStyle":{"type":["Object"],"description":"<p><br></p>\n<blockquote>\n<p><strong>Notice：</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code>&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The text syle of tooltip&#39;s floating layer.</p>\n","properties":{"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":14},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"extraCssText":{"type":["string"]}}}}},{"type":["Object"],"description":"<p><strong>pictorial bar chart</strong></p>\n<p>Pictorial bar chart is a type of bar chart that custimzed glyph (like images, <a href=\"http://www.w3.org/TR/SVG/paths.html#PathData\" target=\"_blank\">SVG PathData</a>) can be used instead of rectangular bar. This kind of chart is usually used in infographic.</p>\n<p>Pictorial bar chart can only be used in <a href=\"#grid\">rectangular coordinate</a> with at least 1 category axis.</p>\n<p><strong>Example:</strong></p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=pictorialBar-hill&reset=1&edit=1\" width=\"800\" height=\"400\" ></iframe>\n\n\n\n<p><strong>Layout</strong></p>\n<p>Basically <code>pictoialBar</code> is a type of bar chart, which follows the bar chart layout. In <code>pictorialBar</code>, each bar is named as <code>reference bar</code>, which does not be shown, but only be used as a reference for layout of pictorial graphic elements. Each pictorial graphic element is positioned with respect to its <code>reference bar</code> according to the setting of <a href=\"#series-pictorialBar.symbolPosition\">symbolPosition</a>、<a href=\"#series-pictorialBar.symbolOffset\">symbolOffset</a>.</p>\n<p>See the example below:</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=doc-example/pictorialBar-position&reset=1&edit=1\" width=\"800\" height=\"600\" ></iframe>\n\n\n<p><a href=\"#series-pictorialBar.symbolSize\">symbolSize</a> is used to specify the size of graphic elements.</p>\n<p>See the example below:</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=doc-example/pictorialBar-symbolSize&reset=1&edit=1\" width=\"800\" height=\"600\" ></iframe>\n\n\n\n\n<p><strong>Graphic types</strong></p>\n<p><a href=\"#series-pictorialBar.symbolRepeat\">symbolRepeat</a> can be</p>\n<p>Graphic elements can be set as &#39;repeat&#39; or not by <a href=\"#series-pictorialBar.symbolRepeat\">symbolRepeat</a>.</p>\n<ul>\n<li>If set as <code>false</code> (default), a single graphic element is used to represent a data item.</li>\n<li>If set as <code>true</code>, a group of repeat graphic elements are used to represent a data item.</li>\n</ul>\n<p>See the example below:</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=doc-example/pictorialBar-repeat&reset=1&edit=1\" width=\"800\" height=\"400\" ></iframe>\n\n\n<p>Each graphic element can be basic shape (like <code>&#39;circle&#39;</code>, <code>&#39;rect&#39;</code>, ...), or <a href=\"http://www.w3.org/TR/SVG/paths.html#PathData\" target=\"_blank\">SVG PathData</a>, or image. See <a href=\"#series-pictorialBar.symbolType\">symbolType</a>.</p>\n<p>See the example below:</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=doc-example/pictorialBar-graphicType&reset=1&edit=1\" width=\"800\" height=\"400\" ></iframe>\n\n\n<p><a href=\"#series-pictorialBar.symbolClip\">symbolClip</a> can be used to clip graphic elements。</p>\n<p>See the example below:</p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=doc-example/pictorialBar-clip&reset=1&edit=1\" width=\"800\" height=\"600\" ></iframe>\n\n\n\n","properties":{"type":{"type":["string"],"default":"'pictorialBar'"},"id":{"type":["string"]},"name":{"type":["string"]},"legendHoverLink":{"type":["boolean"],"default":true},"coordinateSystem":{"type":["string"],"default":"'cartesian2d'"},"xAxisIndex":{"type":["number"],"default":0},"yAxisIndex":{"type":["number"],"default":0},"cursor":{"type":["string"],"default":"'pointer'"},"label":{"type":["Object"],"description":"<p>Text label of , to explain some data information about graphic item like value, name and so on. <code>label</code> is placed under <code>itemStyle</code> in ECharts 2.x. In ECharts 3, to make the configuration structure flatter, <code>label</code>is taken to be at the same level with <code>itemStyle</code>, and has <code>emphasis</code> as <code>itemStyle</code> does.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Graphic style of , <code>emphasis</code> is the style when it is highlighted, like being hovered by mouse, or highlighted via legend connect.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"barWidth":{"type":["number"],"default":null},"barMaxWidth":{"type":["number"],"default":null},"barMinHeight":{"type":["number"],"default":0},"barGap":{"type":["string"],"default":"-100%"},"barCategoryGap":{"type":["string"],"default":"'20%'"},"symbol":{"type":["string"],"default":"'circle'"},"symbolSize":{"type":["number","Array"],"default":"['100%', '100%']"},"symbolPosition":{"type":["string"],"default":"'start'"},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"symbolRotate":{"type":["number"]},"symbolRepeat":{"type":["boolean","number","string"]},"symbolRepeatDirection":{"type":["string"],"default":"'start'"},"symbolMargin":{"type":["number","string"]},"symbolClip":{"type":["boolean"],"default":false},"symbolBoundingData":{"type":["number"]},"symbolPatternSize":{"type":["number"],"default":400},"hoverAnimation":{"type":["boolean"],"description":"<p>Whether to enable hover animation.</p>\n<p>This attribute can be set at the <a href=\"#series-pictorialBar.hoverAnimation\">root level of a series</a>, where all data items in the series will be affected by this attribute. And this attribute can also be set at <a href=\"#series-pictorialBar.data.hoverAnimation\">each data item</a> in <a href=\"series-pictorialBar.data\" target=\"_blank\">series-pictorialBar.data</a>, where only the data item is affected by this attribute.</p>\n<p>For example:</p>\n<pre><code class=\"lang-js\">series: [{\n    hoverAnimation: ... // Affect all data items.\n    data: [23, 56]\n}]\n// Or\nseries: [{\n    data: [{\n        value: 23\n        hoverAnimation: ... // Only affect this data item.\n    }, {\n        value: 56\n        hoverAnimation: ... // Only affect this data item.\n    }]\n}]\n</code></pre>\n","default":false,"properties":{"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"dimensions":{"type":["Array"]},"encode":{"type":["Object"]},"data":{"type":["Array"],"description":"<p>Data array of series, which can be in the following forms:</p>\n<p>Notice, if no <code>data</code> specified in series, and there is <a href=\"#dataset\">dataset</a> in option, series will use the first <a href=\"#dataset\">dataset</a> as its datasource. If <code>data</code> has been specified, <a href=\"#dataset\">dataset</a> will not used.</p>\n<p><code>series.datasetIndex</code> can be used to specify other <a href=\"#dataset\">dataset</a>.</p>\n<p>Basically, data is represented by a two-dimension array, like the example below, where each colum is named as a &quot;dimension&quot;.</p>\n<pre><code class=\"lang-js\">series: [{\n    data: [\n        // dimX   dimY   other dimensions ...\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>In <a href=\"#grid\">cartesian (grid)</a>, &quot;dimX&quot; and &quot;dimY&quot; correspond to <a href=\"#xAxis\">xAxis</a> and <a href=\"#yAxis\">yAxis</a> repectively.</li>\n<li>In <a href=\"#polar\">polar</a> &quot;dimX&quot; and &quot;dimY&quot; correspond to <a href=\"#radiusAxis\">radiusAxis</a> 和 <a href=\"#anbleAxis\">angleAxis</a> repectively.</li>\n<li>Other dimensions are optional, which can be used in other place. For example:<ul>\n<li><a href=\"#visualMap\">visualMap</a> can map one or more dimensions to viusal (color, symbol size ...).</li>\n<li><a href=\"#series.symbolSize\">series.symbolSize</a> can be set as a callback function, where symbol size can be calculated by values of a certain dimension.</li>\n<li>Values in other dimensions can be shown by <a href=\"#tooltip.formatter\">tooltip.formatter</a> or <a href=\"#series.label.formatter\">series.label.formatter</a>.</li>\n</ul>\n</li>\n</ul>\n<p>Especially, when there is one and only one category axis (axis.type is <code>&#39;category&#39;</code>), data can be simply be represented by a one-dimension array, like:</p>\n<pre><code class=\"lang-js\">xAxis: {\n    data: [&#39;a&#39;, &#39;b&#39;, &#39;m&#39;, &#39;n&#39;]\n},\nseries: [{\n    // Each item corresponds to each item in xAxis.data.\n    data: [23,  44,  55,  19]\n    // In fact, it is the simplification of the format below:\n    // data: [[0, 23], [1, 44], [2, 55], [3, 19]]\n}]\n</code></pre>\n<p><br>\n<strong>Relationship between &quot;value&quot; and <a href=\"#xAxis.type\">axis.type</a></strong></p>\n<ul>\n<li><p>When a dimension corresponds to a value axis (axis.type is <code>&#39;value&#39;</code> or <code>&#39;log&#39;</code>):</p>\n<p>  The value can be a <code>number</code> (like <code>12</code>) (can also be a number in a <code>string</code> format, like <code>&#39;12&#39;</code>).</p>\n</li>\n<li><p>When a dimension corresponds to a category axis (axis.type is <code>&#39;category&#39;</code>):</p>\n<p>  The value should be the ordinal of the axis.data (based on <code>0</code>), the string value of the axis.data. For example:</p>\n<pre><code class=\"lang-js\">  xAxis: {\n      type: &#39;category&#39;,\n      data: [&#39;Monday&#39;, &#39;Tuesday&#39;, &#39;Wednesday&#39;, &#39;Thursday&#39;]\n  },\n  yAxis: {\n      type: &#39;category&#39;,\n      data: [&#39;a&#39;, &#39;b&#39;, &#39;m&#39;, &#39;n&#39;, &#39;p&#39;, &#39;q&#39;]\n  },\n  series: [{\n      data: [\n          // xAxis      yAxis\n          [  0,           0,    2  ], // This point is located at xAxis: &#39;Monday&#39;, yAxis: &#39;a&#39;.\n          [  &#39;Thursday&#39;,  2,    1  ], // This point is located at xAxis: &#39;Thursday&#39;, yAxis: &#39;m&#39;.\n          [  2,          &#39;p&#39;,   2  ], // This point is located at xAxis: &#39;Wednesday&#39;, yAxis: &#39;p&#39;.\n          [  3,           3,    5  ]\n      ]\n  }]\n</code></pre>\n<p>  There is an example of double category axes: <a href=\"http://echarts.baidu.com/gallery/editor.html?c=scatter-punchCard\" target=\"_blank\">Github Punchcard</a>.</p>\n</li>\n<li><p>When a dimension corresponds to a time axis (type is <code>&#39;time&#39;</code>), the value can be:</p>\n<ul>\n<li>a timestamp, like <code>1484141700832</code>, which represents a UTC time.</li>\n<li>a date string, in one of the formats below:<ul>\n<li>a subset of <a href=\"http://www.ecma-international.org/ecma-262/5.1/#sec-15.9.1.15\" target=\"_blank\">ISO 8601</a>, only including (all of these are treated as local time unless timezone is specified, which is consistent with <a href=\"https://momentjs.com/\" target=\"_blank\">moment</a>):<ul>\n<li>only part of year/month/date/time are specified: <code>&#39;2012-03&#39;</code>, <code>&#39;2012-03-01&#39;</code>, <code>&#39;2012-03-01 05&#39;</code>, <code>&#39;2012-03-01 05:06&#39;</code>.</li>\n<li>separated by <code>&quot;T&quot;</code> or a space: <code>&#39;2012-03-01T12:22:33.123&#39;</code>, <code>&#39;2012-03-01 12:22:33.123&#39;</code>.</li>\n<li>timezone specified: <code>&#39;2012-03-01T12:22:33Z&#39;</code>, <code>&#39;2012-03-01T12:22:33+8000&#39;</code>, <code>&#39;2012-03-01T12:22:33-05:00&#39;</code>.</li>\n</ul>\n</li>\n<li>other date string format (all of these are treated as local time):\n<code>&#39;2012&#39;</code>, <code>&#39;2012-3-1&#39;</code>, <code>&#39;2012/3/1&#39;</code>, <code>&#39;2012/03/01&#39;</code>,\n<code>&#39;2009/6/12 2:00&#39;</code>, <code>&#39;2009/6/12 2:05:08&#39;</code>, <code>&#39;2009/6/12 2:05:08.123&#39;</code>.</li>\n</ul>\n</li>\n<li>a JavaScript Date instance created by user:<ul>\n<li>Caution, when using a data string to create a Date instance, <a href=\"http://dygraphs.com/date-formats.html\" target=\"_blank\">browser differences and inconsistencies</a> should be considered.</li>\n<li>For example: In chrome, <code>new Date(&#39;2012-01-01&#39;)</code> is treated as a Jan 1st 2012 in UTC, while <code>new Date(&#39;2012-1-1&#39;)</code> and <code>new Date(&#39;2012/01/01&#39;)</code> are treated as Jan 1st 2012 in local timezone. In safari <code>new Date(&#39;2012-1-1&#39;)</code> is not supported.</li>\n<li>So if you intent to perform <code>new Date(dateString)</code>, it is strongly recommended to use a time parse library (e.g., <a href=\"https://momentjs.com/\" target=\"_blank\">moment</a>), or use <code>echarts.number.parseDate</code>, or check <a href=\"http://dygraphs.com/date-formats.html\" target=\"_blank\">this</a>.</li>\n</ul>\n</li>\n</ul>\n</li>\n</ul>\n<p><br>\n<strong>Customize a data item:</strong></p>\n<p>When needing to customize a data item, it can be set as an object, where property <code>value</code> reprensent real value. For example:</p>\n<pre><code class=\"lang-js\">[\n    12,\n    24,\n    {\n        value: [24, 32],\n        // label style, only works in this data item.\n        label: {},\n        // item style, only works in this data item.\n        itemStyle:{}\n    },\n    33\n]\n// Or\n[\n    [12, 332],\n    [24, 32],\n    {\n        value: [24, 32],\n        // label style, only works in this data item.\n        label: {},\n        // item style, only works in this data item.\n        itemStyle:{}\n    },\n    [33, 31]\n]\n</code></pre>\n<p><br>\n<strong>Empty value:</strong></p>\n<p><code>&#39;-&#39;</code> or <code>null</code> or <code>undefined</code> or <code>NaN</code> can be used to describe that a data item is not exists (ps：<em>not exist</em> does not means its value is <code>0</code>).</p>\n<p>For example, line chart can break when encounter an empty value, and scatter chart do not display graphic elements for empty values.</p>\n<p><br><br></p>\n","items":{"type":"Object","properties":{"name":{"type":["string"]},"value":{"type":["number"]},"symbol":{"type":["string"],"default":"'circle'"},"symbolSize":{"type":["number","Array"],"default":"['100%', '100%']"},"symbolPosition":{"type":["string"],"default":"'start'"},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"symbolRotate":{"type":["number"]},"symbolRepeat":{"type":["boolean","number","string"]},"symbolRepeatDirection":{"type":["string"],"default":"'start'"},"symbolMargin":{"type":["number","string"]},"symbolClip":{"type":["boolean"],"default":false},"symbolBoundingData":{"type":["number"]},"symbolPatternSize":{"type":["number"],"default":400},"hoverAnimation":{"type":["boolean"],"default":false},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDelayUpdate":{"type":["number","Function"],"default":0},"label":{"type":["Object"],"description":"<p>The style setting of the text label in a single bar.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"inside"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"tooltip":{"type":["*"],"description":"<p>tooltip settings in this series data.</p>\n","properties":{"position":{"type":["string","Array"]},"formatter":{"type":["string","Function"]},"backgroundColor":{"type":["Color"],"default":"'rgba(50,50,50,0.7)'"},"borderColor":{"type":["Color"],"default":"'#333'"},"borderWidth":{"type":["number"],"default":0},"padding":{"type":["number"],"default":5},"textStyle":{"type":["Object"],"description":"<blockquote>\n<p><strong>Notice：</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code>&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The text syle of tooltip&#39;s floating layer.</p>\n","properties":{"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":14},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"extraCssText":{"type":["string"]}}}}}},"markPoint":{"type":["Object"],"description":"<p>Mark point in a chart.</p>\n","properties":{"symbol":{"type":["string"],"default":"'pin'"},"symbolSize":{"type":["number","Array","Function"],"default":50},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"silent":{"type":["boolean"],"default":false},"label":{"type":["Object"],"description":"<p>Label of mark point.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"'inside'"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"formatter":{"type":["string","Function"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Mark point style.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["Array"],"description":"<p>Data array for mark points, each of which is an object. Here are some ways to assign mark point position.</p>\n<ol>\n<li><p>Assign coordinate according to container with <a href=\"#series-pictorialBar.markPoint.data.x\">x</a>, <a href=\"#series-pictorialBar.markPoint.data.y\">y</a> attribute, in which pixel values and percentage are supported.</p>\n</li>\n<li><p>Assign coordinate position with <a href=\"#series-pictorialBar.markPoint.data.coord\">coord</a> attribute, in which <code>&#39;min&#39;</code>, <code>&#39;max&#39;</code>, <code>&#39;average&#39;</code> are supported for each dimension.</p>\n</li>\n<li><p>Use <a href=\"#series-pictorialBar.markPoint.data.type\">type</a> attribute to mark the maximum and minimum values in the series, in which <a href=\"#series-pictorialBar.markPoint.data.valueIndex\">valueIndex</a> or <a href=\"#series-pictorialBar.markPoint.data.valueDim\">valueDim</a> can be used to assign the dimension.</p>\n</li>\n</ol>\n<p>When multiple attributes exist, priority is as the above order.</p>\n<p><strong>For example: </strong></p>\n<pre><code class=\"lang-js\">data: [\n    {\n        name: &#39;maximum&#39;,\n        type: &#39;max&#39;\n    }, \n    {\n        name: &#39;coordinate&#39;,\n        coord: [10, 20]\n    }, {\n        name: &#39;fixed x position&#39;,\n        yAixs: 10,\n        x: &#39;90%&#39;\n    }, \n    {\n        name: &#39;screen coordinate&#39;,\n        x: 100,\n        y: 100\n    }\n]\n</code></pre>\n","items":{"type":"Object","properties":{"name":{"type":["string"],"default":"''"},"type":{"type":["string"]},"valueIndex":{"type":["number"]},"valueDim":{"type":["string"]},"coord":{"type":["Array"]},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"itemStyle":{"type":["Object"],"description":"<p>Mark point style.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"markLine":{"type":["*"],"description":"<p>Use a line in the chart to illustrate.</p>\n","properties":{"silent":{"type":["boolean"],"default":false},"symbol":{"type":["string","Array"]},"symbolSize":{"type":["number","Array"]},"precision":{"type":["number"],"default":2},"label":{"type":["Object"],"description":"<p>Mark line text.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]}}}}},"lineStyle":{"type":["Object"],"description":"<p>Mark line style.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["*"],"description":"<p>Data array of marking line. Every array item can be an array of one or two values, representing starting and ending point of the line, and every item is an object. Here are several ways to assign the positions of starting and ending point.</p>\n<ol>\n<li><p>Assign coordinate according to container with <a href=\"#series-pictorialBar.markLine.data.0.x\">x</a>, <a href=\"#series-pictorialBar.markLine.data.0.y\">y</a> attribute, in which pixel values and percentage are supported.</p>\n</li>\n<li><p>Assign coordinate position with <a href=\"#series-pictorialBar.markLine.data.0.coord\">coord</a> attribute, in which <code>&#39;min&#39;</code>, <code>&#39;max&#39;</code>, <code>&#39;average&#39;</code> are supported for each dimension.</p>\n</li>\n<li><p>Use <a href=\"#series-pictorialBar.markLine.data.0.type\">type</a> attribute to mark the maximum and minimum values in the series, in which <a href=\"#series-pictorialBar.markLine.data.0.valueIndex\">valueIndex</a> or <a href=\"#series-pictorialBar.markLine.data.0.valueDim\">valueDim</a> can be used to assign the dimension.</p>\n</li>\n<li><p>You may also create a mark line in Cartesian coordinate at a specific position in X or Y axis by assigning <code>xAxis</code> or <code>yAxis</code>. See <a href=\"http://echarts.baidu.com/gallery/editor.html?c=scatter-weight\" target=\"_blank\">scatter-weight</a> for example.</p>\n</li>\n</ol>\n<p>When multiple attributes exist, priority is as the above order.</p>\n<p>You may also set the type of mark line through <code>type</code>, stating whether it is for the maximum value or average value. Likewise, dimensions can be assigned through <code>valueIndex</code>.</p>\n<pre><code>data: [\n    {\n        name: &#39;average line&#39;,\n        // &#39;average&#39;, &#39;min&#39;, and &#39;max&#39; are supported\n        type: &#39;average&#39;\n    },\n    {\n        name: &#39;Horizontal line with Y value at 100&#39;,\n        yAxis: 100\n    },\n    [\n        {\n            // Use the same name with starting and ending point\n            name: &#39;Minimum to Maximum&#39;,\n            type: &#39;min&#39;\n        },\n        {\n            type: &#39;max&#39;\n        }\n    ],\n    [\n        {\n            name: &#39;Markline between two points&#39;,\n            coord: [10, 20]\n        },\n        {\n            coord: [20, 30]\n        }\n    ], [{\n        // Mark line with a fixed X position in starting point. This is used to generate an arrow pointing to maximum line.\n        yAxis: &#39;max&#39;,\n        x: &#39;90%&#39;\n    }, {\n        type: &#39;max&#39;\n    }],\n    [\n        {\n            name: &#39;Mark line between two points&#39;,\n            x: 100,\n            y: 100\n        },\n        {\n            x: 500,\n            y: 200\n        }\n    ]\n]\n</code></pre>","properties":{"0":{"type":["Object"],"description":"<p>Data of the starting point.</p>\n","properties":{"type":{"type":["string"]},"valueIndex":{"type":["number"]},"valueDim":{"type":["string"]},"coord":{"type":["Array"]},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"lineStyle":{"type":["Object"],"description":"<p>Line style of this data item, which will be merged with <code>lineStyle</code> of starting point and ending point.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0}}}}},"label":{"type":["Object"],"description":"<p>Label of this data item, which will be merged with <code>label</code> of starting point and ending point.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]}}}}}}},"1":{"type":["Object"],"description":"<p>Data of the ending point.</p>\n","properties":{"type":{"type":["string"]},"valueIndex":{"type":["number"]},"valueDim":{"type":["string"]},"coord":{"type":["Array"]},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"symbol":{"type":["string"]},"symbolSize":{"type":["number","Array"]},"symbolRotate":{"type":["number"]},"symbolKeepAspect":{"type":["boolean"],"default":false},"symbolOffset":{"type":["Array"],"default":"[0, 0]"},"lineStyle":{"type":["Object"],"description":"<p>Line style of this data item, which will be merged with <code>lineStyle</code> of starting point and ending point.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#000\""},"width":{"type":["number"],"default":0},"type":{"type":["string"],"default":"solid"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"curveness":{"type":["number"],"default":0}}}}},"label":{"type":["Object"],"description":"<p>Label of this data item, which will be merged with <code>label</code> of starting point and ending point.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string"],"default":"'end'"},"formatter":{"type":["string","Function"]}}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"markArea":{"type":["Object"],"description":"<p>Used to mark an area in chart. For example, mark a time interval.</p>\n","properties":{"silent":{"type":["boolean"],"default":false},"label":{"type":["Object"],"description":"<p>Label in mark area.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>Style of the mark area.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["*"],"description":"<p>The scope of the area is defined by <code>data</code>, which is an array with two item, representing the left-top point and the right-bottom point of rectangle area. Each item can be defined as follows:</p>\n<ol>\n<li><p>Specify the coordinate in screen coordinate system using <a href=\"#series-pictorialBar.markArea.data.0.x\">x</a>, <a href=\"#series-pictorialBar.markArea.data.0.y\">y</a>, where the unit is pixel (e.g., the value is <code>5</code>), or percent (e.g., the value is <code>&#39;35%&#39;</code>).</p>\n</li>\n<li><p>Specify the coordinate in data coordinate system (i.e., cartesian) using\n<a href=\"#series-pictorialBar.markArea.data.0.coord\">coord</a>, which can be also set as <code>&#39;min&#39;</code>, <code>&#39;max&#39;</code>, <code>&#39;average&#39;</code> (e.g, <code>coord: [23, &#39;min&#39;]</code>, or <code>coord: [&#39;average&#39;, &#39;max&#39;]</code>)。</p>\n</li>\n</ol>\n<ol>\n<li>Locate the point on the min value or max value of <code>series.data</code> using <a href=\"#series-pictorialBar.markArea.data.0.type\">type</a>, where <a href=\"#series-pictorialBar.markArea.data.0.valueIndex\">valueIndex</a> or <a href=\"#series-pictorialBar.markPoint.data.0.valueDim\">valueDim</a> can be used to specify the dimension on which the min, max or average are calculated.</li>\n<li>If in cartesian, you can only specify <code>xAxis</code> or <code>yAxis</code> to define a mark area based on only X or Y axis, see sample <a href=\"http://echarts.baidu.com/gallery/editor.html?c=scatter-weight\" target=\"_blank\">scatter-weight</a></li>\n</ol>\n<p>The priority follows as above if more than one above definition used.</p>\n<pre><code>data: [\n\n    [\n        {\n            name: &#39;From average to max&#39;,\n            type: &#39;average&#39;\n        },\n        {\n            type: &#39;max&#39;\n        }\n    ],\n\n    [\n        {\n            name: &#39;Mark area between two points in data coordiantes&#39;,\n            coord: [10, 20]\n        },\n        {\n            coord: [20, 30]\n        }\n    ], [\n        {\n            name: &#39;From 60 to 80&#39;,\n            yAxis: 60\n        },\n        {\n            yAxis: 80\n        }\n    ], [\n        {\n            name: &#39;Mark area covers all data&#39;\n            coord: [&#39;min&#39;, &#39;min&#39;]\n        },\n        {\n            coord: [&#39;max&#39;, &#39;max&#39;]\n        }\n    ],\n    [\n        {\n            name: &#39;Mark area in two screen points&#39;,\n            x: 100,\n            y: 100\n        }, {\n            x: &#39;90%&#39;,\n            y: &#39;10%&#39;\n        }\n    ]\n]\n</code></pre>","properties":{"0":{"type":["Object"],"description":"<p>Specify the left-top point.</p>\n","properties":{"type":{"type":["string"]},"valueIndex":{"type":["number"]},"valueDim":{"type":["string"]},"coord":{"type":["Array"]},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"itemStyle":{"type":["Object"],"description":"<p>Style of the item.\n<code>itemStyle</code> of start point and end point will be merged together.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"<p>Label style of the item.\nLabel style of start point and end point will be merged together.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}},"1":{"type":["Object"],"description":"<p>Specify the right-bottom point.</p>\n","properties":{"type":{"type":["string"]},"valueIndex":{"type":["number"]},"valueDim":{"type":["string"]},"coord":{"type":["Array"]},"x":{"type":["number"]},"y":{"type":["number"]},"value":{"type":["number"]},"itemStyle":{"type":["Object"],"description":"<p>Style of the item.\n<code>itemStyle</code> of start point and end point will be merged together.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"label":{"type":["Object"],"description":"<p>Label style of the item.\nLabel style of start point and end point will be merged together.</p>\n","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"]},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}}}}}},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"zlevel":{"type":["number"],"default":0},"z":{"type":["number"],"default":2},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"description":"<p>Easing method used for animation.</p>\n","default":"cubicOut","properties":{"animationDelay":{"type":["number","Function"],"default":0},"animationDelayUpdate":{"type":["number","Function"],"default":0}}},"tooltip":{"type":["*"],"description":"<p>tooltip settings in this series.</p>\n","properties":{"position":{"type":["string","Array"]},"formatter":{"type":["string","Function"]},"backgroundColor":{"type":["Color"],"default":"'rgba(50,50,50,0.7)'"},"borderColor":{"type":["Color"],"default":"'#333'"},"borderWidth":{"type":["number"],"default":0},"padding":{"type":["number"],"default":5},"textStyle":{"type":["Object"],"description":"<p><br></p>\n<blockquote>\n<p><strong>Notice：</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code>&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The text syle of tooltip&#39;s floating layer.</p>\n","properties":{"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":14},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"extraCssText":{"type":["string"]}}}}},{"type":["Object"],"description":"<p><strong> Theme river </strong></p>\n<p>It is a special flow graph which is mainly used to present the changes of an event or theme during a period.</p>\n<p><strong>Sample: </strong></p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=themeRiver-lastfm&edit=1&reset=1\" width=\"700\" height=\"580\" ></iframe>\n\n\n\n<p><br>\n<strong>visual encoding: </strong></p>\n<p>The ribbon-shape river branches in different colors in theme river encode variable events or themes. The width of river branches encode the value of the original dataset.</p>\n<p>What&#39;s more, the time attribute of the orinigal dataset would map to a single time axis.</p>\n","properties":{"type":{"type":["string"],"default":"'themeRiver'"},"id":{"type":["string"]},"zlevel":{"type":["number"],"default":0},"z":{"type":["number"],"default":2},"left":{"type":["string","number"],"default":"5%"},"top":{"type":["string","number"],"default":"5%"},"right":{"type":["string","number"],"default":"5%"},"bottom":{"type":["string","number"],"default":"5%"},"width":{"type":["string","number"],"default":null},"height":{"type":["string","number"],"default":null},"coordinateSystem":{"type":["string"],"default":"\"single\""},"boundaryGap":{"type":["Array"],"default":"[\"10%\", \"10%\"]"},"singleAxisIndex":{"type":["number"],"default":0},"label":{"type":["Object"],"description":"<p><code>label</code> describes style of text labels with which each ribbon-shape river branch corresponds in theme river.</p>\n","properties":{"show":{"type":["boolean"],"default":true},"position":{"type":["string","Array"],"default":"'left'"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"'#000'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":11},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}},"emphasis":{"type":["Object"],"description":"","properties":{"show":{"type":["boolean"],"default":false},"position":{"type":["string","Array"],"default":"'left'"},"distance":{"type":["number"],"default":5},"rotate":{"type":["number"]},"offset":{"type":["Array"]},"color":{"type":["Color"],"default":"'#000'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":11},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0},"rich":{"type":["Object"],"description":"<p>&quot;Rich text styles&quot; can be defined in this <code>rich</code> property. For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fregments\n    // of text by adding some markers to those fregment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this snippet}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this snippet}This snippet use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<p>For more details, see <a href=\"tutorial.html#Rich%20Text\" target=\"_blank\">Rich Text</a> please.</p>\n","properties":{"<user defined style name>":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"align":{"type":["string"]},"verticalAlign":{"type":["string"]},"lineHeight":{"type":["number"]},"backgroundColor":{"type":["string","Object"],"default":"'transparent'"},"borderColor":{"type":["string"],"default":"'transparent'"},"borderWidth":{"type":["number"],"default":0},"borderRadius":{"type":["number"],"default":0},"padding":{"type":["number","Array"],"default":0},"shadowColor":{"type":["string"],"default":"'transparent'"},"shadowBlur":{"type":["number"],"default":0},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}}}}}}}},"itemStyle":{"type":["Object"],"description":"<p>style of each ribbon-shape river branch in theme river.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"],"default":20},"shadowColor":{"type":["Color"],"default":"'rgba(0,0,0,0.8)'"},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"data":{"type":["Array"],"description":"<p>Data array of series, which can be in the following forms:</p>\n<p>Notice, if no <code>data</code> specified in series, and there is <a href=\"#dataset\">dataset</a> in option, series will use the first <a href=\"#dataset\">dataset</a> as its datasource. If <code>data</code> has been specified, <a href=\"#dataset\">dataset</a> will not used.</p>\n<p><code>series.datasetIndex</code> can be used to specify other <a href=\"#dataset\">dataset</a>.</p>\n<p>Basically, data is represented by a two-dimension array, like the example below, where each colum is named as a &quot;dimension&quot;.</p>\n<pre><code class=\"lang-js\">series: [{\n    data: [\n        // dimX   dimY   other dimensions ...\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>In <a href=\"#grid\">cartesian (grid)</a>, &quot;dimX&quot; and &quot;dimY&quot; correspond to <a href=\"#xAxis\">xAxis</a> and <a href=\"#yAxis\">yAxis</a> repectively.</li>\n<li>In <a href=\"#polar\">polar</a> &quot;dimX&quot; and &quot;dimY&quot; correspond to <a href=\"#radiusAxis\">radiusAxis</a> 和 <a href=\"#anbleAxis\">angleAxis</a> repectively.</li>\n<li>Other dimensions are optional, which can be used in other place. For example:<ul>\n<li><a href=\"#visualMap\">visualMap</a> can map one or more dimensions to viusal (color, symbol size ...).</li>\n<li><a href=\"#series.symbolSize\">series.symbolSize</a> can be set as a callback function, where symbol size can be calculated by values of a certain dimension.</li>\n<li>Values in other dimensions can be shown by <a href=\"#tooltip.formatter\">tooltip.formatter</a> or <a href=\"#series.label.formatter\">series.label.formatter</a>.</li>\n</ul>\n</li>\n</ul>\n<p>Especially, when there is one and only one category axis (axis.type is <code>&#39;category&#39;</code>), data can be simply be represented by a one-dimension array, like:</p>\n<pre><code class=\"lang-js\">xAxis: {\n    data: [&#39;a&#39;, &#39;b&#39;, &#39;m&#39;, &#39;n&#39;]\n},\nseries: [{\n    // Each item corresponds to each item in xAxis.data.\n    data: [23,  44,  55,  19]\n    // In fact, it is the simplification of the format below:\n    // data: [[0, 23], [1, 44], [2, 55], [3, 19]]\n}]\n</code></pre>\n<p><br>\n<strong>Relationship between &quot;value&quot; and <a href=\"#xAxis.type\">axis.type</a></strong></p>\n<ul>\n<li><p>When a dimension corresponds to a value axis (axis.type is <code>&#39;value&#39;</code> or <code>&#39;log&#39;</code>):</p>\n<p>  The value can be a <code>number</code> (like <code>12</code>) (can also be a number in a <code>string</code> format, like <code>&#39;12&#39;</code>).</p>\n</li>\n<li><p>When a dimension corresponds to a category axis (axis.type is <code>&#39;category&#39;</code>):</p>\n<p>  The value should be the ordinal of the axis.data (based on <code>0</code>), the string value of the axis.data. For example:</p>\n<pre><code class=\"lang-js\">  xAxis: {\n      type: &#39;category&#39;,\n      data: [&#39;Monday&#39;, &#39;Tuesday&#39;, &#39;Wednesday&#39;, &#39;Thursday&#39;]\n  },\n  yAxis: {\n      type: &#39;category&#39;,\n      data: [&#39;a&#39;, &#39;b&#39;, &#39;m&#39;, &#39;n&#39;, &#39;p&#39;, &#39;q&#39;]\n  },\n  series: [{\n      data: [\n          // xAxis      yAxis\n          [  0,           0,    2  ], // This point is located at xAxis: &#39;Monday&#39;, yAxis: &#39;a&#39;.\n          [  &#39;Thursday&#39;,  2,    1  ], // This point is located at xAxis: &#39;Thursday&#39;, yAxis: &#39;m&#39;.\n          [  2,          &#39;p&#39;,   2  ], // This point is located at xAxis: &#39;Wednesday&#39;, yAxis: &#39;p&#39;.\n          [  3,           3,    5  ]\n      ]\n  }]\n</code></pre>\n<p>  There is an example of double category axes: <a href=\"http://echarts.baidu.com/gallery/editor.html?c=scatter-punchCard\" target=\"_blank\">Github Punchcard</a>.</p>\n</li>\n<li><p>When a dimension corresponds to a time axis (type is <code>&#39;time&#39;</code>), the value can be:</p>\n<ul>\n<li>a timestamp, like <code>1484141700832</code>, which represents a UTC time.</li>\n<li>a date string, in one of the formats below:<ul>\n<li>a subset of <a href=\"http://www.ecma-international.org/ecma-262/5.1/#sec-15.9.1.15\" target=\"_blank\">ISO 8601</a>, only including (all of these are treated as local time unless timezone is specified, which is consistent with <a href=\"https://momentjs.com/\" target=\"_blank\">moment</a>):<ul>\n<li>only part of year/month/date/time are specified: <code>&#39;2012-03&#39;</code>, <code>&#39;2012-03-01&#39;</code>, <code>&#39;2012-03-01 05&#39;</code>, <code>&#39;2012-03-01 05:06&#39;</code>.</li>\n<li>separated by <code>&quot;T&quot;</code> or a space: <code>&#39;2012-03-01T12:22:33.123&#39;</code>, <code>&#39;2012-03-01 12:22:33.123&#39;</code>.</li>\n<li>timezone specified: <code>&#39;2012-03-01T12:22:33Z&#39;</code>, <code>&#39;2012-03-01T12:22:33+8000&#39;</code>, <code>&#39;2012-03-01T12:22:33-05:00&#39;</code>.</li>\n</ul>\n</li>\n<li>other date string format (all of these are treated as local time):\n<code>&#39;2012&#39;</code>, <code>&#39;2012-3-1&#39;</code>, <code>&#39;2012/3/1&#39;</code>, <code>&#39;2012/03/01&#39;</code>,\n<code>&#39;2009/6/12 2:00&#39;</code>, <code>&#39;2009/6/12 2:05:08&#39;</code>, <code>&#39;2009/6/12 2:05:08.123&#39;</code>.</li>\n</ul>\n</li>\n<li>a JavaScript Date instance created by user:<ul>\n<li>Caution, when using a data string to create a Date instance, <a href=\"http://dygraphs.com/date-formats.html\" target=\"_blank\">browser differences and inconsistencies</a> should be considered.</li>\n<li>For example: In chrome, <code>new Date(&#39;2012-01-01&#39;)</code> is treated as a Jan 1st 2012 in UTC, while <code>new Date(&#39;2012-1-1&#39;)</code> and <code>new Date(&#39;2012/01/01&#39;)</code> are treated as Jan 1st 2012 in local timezone. In safari <code>new Date(&#39;2012-1-1&#39;)</code> is not supported.</li>\n<li>So if you intent to perform <code>new Date(dateString)</code>, it is strongly recommended to use a time parse library (e.g., <a href=\"https://momentjs.com/\" target=\"_blank\">moment</a>), or use <code>echarts.number.parseDate</code>, or check <a href=\"http://dygraphs.com/date-formats.html\" target=\"_blank\">this</a>.</li>\n</ul>\n</li>\n</ul>\n</li>\n</ul>\n<p><br>\n<strong>Customize a data item:</strong></p>\n<p>When needing to customize a data item, it can be set as an object, where property <code>value</code> reprensent real value. For example:</p>\n<pre><code class=\"lang-js\">[\n    12,\n    24,\n    {\n        value: [24, 32],\n        // label style, only works in this data item.\n        label: {},\n        // item style, only works in this data item.\n        itemStyle:{}\n    },\n    33\n]\n// Or\n[\n    [12, 332],\n    [24, 32],\n    {\n        value: [24, 32],\n        // label style, only works in this data item.\n        label: {},\n        // item style, only works in this data item.\n        itemStyle:{}\n    },\n    [33, 31]\n]\n</code></pre>\n<p><br>\n<strong>Empty value:</strong></p>\n<p><code>&#39;-&#39;</code> or <code>null</code> or <code>undefined</code> or <code>NaN</code> can be used to describe that a data item is not exists (ps：<em>not exist</em> does not means its value is <code>0</code>).</p>\n<p>For example, line chart can break when encounter an empty value, and scatter chart do not display graphic elements for empty values.</p>\n<p><br><br></p>\n","items":{"type":"Object","properties":{"date":{"type":["string"]},"value":{"type":["number"]},"name":{"type":["string"]}}}},"tooltip":{"type":["*"],"description":"<p>tooltip settings in this series.</p>\n","properties":{"position":{"type":["string","Array"]},"formatter":{"type":["string","Function"]},"backgroundColor":{"type":["Color"],"default":"'rgba(50,50,50,0.7)'"},"borderColor":{"type":["Color"],"default":"'#333'"},"borderWidth":{"type":["number"],"default":0},"padding":{"type":["number"],"default":5},"textStyle":{"type":["Object"],"description":"<p><br></p>\n<blockquote>\n<p><strong>Notice：</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code>&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The text syle of tooltip&#39;s floating layer.</p>\n","properties":{"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":14},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"extraCssText":{"type":["string"]}}}}},{"type":["Object"],"description":"<p><strong>custom series</strong></p>\n<p><code>custom series</code> supports customizing graphic elements, and then generate more types of charts.</p>\n<p>echarts manages the creation, deletion, animation and interaction with other components (like <a href=\"#dataZoom\">dataZoom</a>、<a href=\"#visualMap\">visualMap</a>), which frees developers from handle those issue themselves.</p>\n<p><strong>For example, a &quot;x-range&quot; chart is made by custom sereis:</strong></p>\n<iframe data-src=\"http://echarts.baidu.com/gallery/view.html?c=custom-profile&reset=1&edit=1\" width=\"800\" height=\"400\" ></iframe>\n\n\n<p><strong><a href=\"https://ecomfe.github.io/echarts-examples/public/index.html#chart-type-custom\" target=\"_blank\">More samples of custom series</a></strong></p>\n<p><strong><a href=\"https://ecomfe.github.io/echarts-doc/public/en/tutorial.html#Custom%20Series\" target=\"_blank\">A tutotial of custom series</a></strong></p>\n<p><br>\n<strong>Customize the render logic (in renderItem method)</strong></p>\n<p><code>custom series</code> requires developers to write a render logic by themselves. This render logic is called <a href=\"#series-custom.renderItem\">renderItem</a>.</p>\n<p>For example:</p>\n<pre><code class=\"lang-js\">var option = {\n    ...,\n    series: [{\n        type: &#39;custom&#39;,\n        renderItem: function (params, api) {\n            var categoryIndex = api.value(0);\n            var start = api.coord([api.value(1), categoryIndex]);\n            var end = api.coord([api.value(2), categoryIndex]);\n            var height = api.size([0, 1])[1] * 0.6;\n\n            return {\n                type: &#39;rect&#39;,\n                shape: echarts.graphic.clipRectByRect({\n                    x: start[0],\n                    y: start[1] - height / 2,\n                    width: end[0] - start[0],\n                    height: height\n                }, {\n                    x: params.coordSys.x,\n                    y: params.coordSys.y,\n                    width: params.coordSys.width,\n                    height: params.coordSys.height\n                }),\n                style: api.style()\n            };\n        },\n        data: data\n    }]\n}\n</code></pre>\n<p><a href=\"#series-custom.renderItem\">renderItem</a> will be called on each data item.</p>\n<p><a href=\"#series-custom.renderItem\">renderItem</a> provides two parameters:</p>\n<ul>\n<li><a href=\"#series-custom.renderItem.arguments.params\">params</a>: provides info about the current series and data and coordinate system.</li>\n<li><a href=\"#series-custom.renderItem.arguments.api\">api</a>: includes some methods.</li>\n</ul>\n<p><a href=\"#series-custom.renderItem\">renderItem</a> method should returns graphic elements definitions.See <a href=\"#series-custom.renderItem.return\">renderItem.return</a>.</p>\n<p>Generally, the main process of <a href=\"#series-custom.renderItem\">renderItem</a> is that retrieve value from data and convert them to graphic elements on the current coordinate system. Two methods in <a href=\"#series-custom.renderItem.arguments.api\">renderItem.arguments.api</a> are always used in this procedure:</p>\n<ul>\n<li><a href=\"#series-custom.renderItem.arguments.api.value\">api.value(...)</a> is used to retrieve value from data. For example, <code>api.value(0)</code> retrieve the value of the first dimension in the current data item.</li>\n<li><a href=\"#series-custom.renderItem.arguments.api.coord\">api.coord(...)</a> is used to convert data to coordinate. For example, <code>var point = api.coord([api.value(0), api.value(1)])</code> converet the data to the point on the current coordinate system.</li>\n</ul>\n<p>Sometimes <a href=\"#series-custom.renderItem.arguments.api.size\">api.size(...)</a> method is needed, which calculates the size on the coordinate system by a given data range.</p>\n<p>Moreover, <a href=\"#series-custom.renderItem.arguments.api.style\">api.style(...)</a> method can be used to set style. It provides not only the style settings specified in <a href=\"#series-custom.itemStyle\">series.itemStyle</a>, but also the result of visual mapping. This method can also be called like <code>api.style({fill: &#39;green&#39;, stroke: &#39;yellow&#39;})</code> to override those style settings.</p>\n<p><br>\n<strong>Dimension mapping (by encode and dimension option)</strong></p>\n<p>In most cases, <a href=\"#series-custom.encode\">series.encode</a> is needed to be specified when using <code>custom series</code> serise, which indicate the mapping of dimensions, and then echarts can render appropriate axis by the extent of those data.</p>\n<p><code>encode.tooltip</code> and <code>encode.label</code> can also be specified to define the content of default <code>tooltip</code> and <code>label</code>.\n<a href=\"#series-custom.dimensions\">series.dimensions</a> can also be specified to defined names of each dimensions, which will be displayed in tooltip.</p>\n<p>For example:</p>\n<pre><code class=\"lang-js\">series: {\n    type: &#39;custom&#39;,\n    renderItem: function () {\n        ...\n    },\n    encode: {\n        x: [2, 4, 3],\n        y: 1,\n        label: 0,\n        tooltip: [2, 4, 3]\n    }\n}\n</code></pre>\n<p><br>\n<strong>Controlled by dataZoom</strong></p>\n<p>When use <code>custom series</code> with <a href=\"#dataZoom\">dataZoom</a>, <a href=\"#dataZoom.filterMode\">dataZoom.filterMode</a> usually be set as <code>&#39;weakFilter&#39;</code>, which prevent <code>dataItem</code> from being filtered when only part of its dimensions are out of the current data window.</p>\n<p><br>\n<br>\n<strong>Difference between <code>dataIndex</code> and <code>dataIndexInside</code></strong></p>\n<ul>\n<li><code>dataIndex</code> is the index of a <code>dataItem</code> in the original data.</li>\n<li><code>dataIndexInside</code> is the index of a <code>dataItem</code> in the current data window (see <a href=\"#dataZoom\">dataZoom</a>.</li>\n</ul>\n<p><a href=\"#series-custom.renderItem.arguments.api\">renderItem.arguments.api</a> uses <code>dataIndexInside</code> as the input parameter but not <code>dataIndex</code>, because conversion from <code>dataIndex</code> to <code>dataIndexInside</code> is time-consuming.</p>\n","properties":{"type":{"type":["string"],"default":"'custom'"},"id":{"type":["string"]},"name":{"type":["string"]},"legendHoverLink":{"type":["boolean"],"default":true},"coordinateSystem":{"type":["string"],"default":"'cartesian2d'"},"xAxisIndex":{"type":["number"],"default":0},"yAxisIndex":{"type":["number"],"default":0},"polarIndex":{"type":["number"],"default":0},"geoIndex":{"type":["number"],"default":0},"calendarIndex":{"type":["number"],"default":0},"renderItem":{"type":["Function"],"description":"<p><code>custom series</code> requires developers to write a render logic by themselves. This render logic is called <a href=\"#series-custom.renderItem\">renderItem</a>.</p>\n<p>For example:</p>\n<pre><code class=\"lang-js\">var option = {\n    ...,\n    series: [{\n        type: &#39;custom&#39;,\n        renderItem: function (params, api) {\n            var categoryIndex = api.value(0);\n            var start = api.coord([api.value(1), categoryIndex]);\n            var end = api.coord([api.value(2), categoryIndex]);\n            var height = api.size([0, 1])[1] * 0.6;\n\n            return {\n                type: &#39;rect&#39;,\n                shape: echarts.graphic.clipRectByRect({\n                    x: start[0],\n                    y: start[1] - height / 2,\n                    width: end[0] - start[0],\n                    height: height\n                }, {\n                    x: params.coordSys.x,\n                    y: params.coordSys.y,\n                    width: params.coordSys.width,\n                    height: params.coordSys.height\n                }),\n                style: api.style()\n            };\n        },\n        data: data\n    }]\n}\n</code></pre>\n<p><a href=\"#series-custom.renderItem\">renderItem</a> will be called on each data item.</p>\n<p><a href=\"#series-custom.renderItem\">renderItem</a> provides two parameters:</p>\n<ul>\n<li><a href=\"#series-custom.renderItem.arguments.params\">params</a>: provides info about the current series and data and coordinate system.</li>\n<li><a href=\"#series-custom.renderItem.arguments.api\">api</a>: includes some methods.</li>\n</ul>\n<p><a href=\"#series-custom.renderItem\">renderItem</a> method should returns graphic elements definitions.See <a href=\"#series-custom.renderItem.return\">renderItem.return</a>.</p>\n<p>Generally, the main process of <a href=\"#series-custom.renderItem\">renderItem</a> is that retrieve value from data and convert them to graphic elements on the current coordinate system. Two methods in <a href=\"#series-custom.renderItem.arguments.api\">renderItem.arguments.api</a> are always used in this procedure:</p>\n<ul>\n<li><a href=\"#series-custom.renderItem.arguments.api.value\">api.value(...)</a> is used to retrieve value from data. For example, <code>api.value(0)</code> retrieve the value of the first dimension in the current data item.</li>\n<li><a href=\"#series-custom.renderItem.arguments.api.coord\">api.coord(...)</a> is used to convert data to coordinate. For example, <code>var point = api.coord([api.value(0), api.value(1)])</code> converet the data to the point on the current coordinate system.</li>\n</ul>\n<p>Sometimes <a href=\"#series-custom.renderItem.arguments.api.size\">api.size(...)</a> method is needed, which calculates the size on the coordinate system by a given data range.</p>\n<p>Moreover, <a href=\"#series-custom.renderItem.arguments.api.style\">api.style(...)</a> method can be used to set style. It provides not only the style settings specified in <a href=\"#series-custom.itemStyle\">series.itemStyle</a>, but also the result of visual mapping. This method can also be called like <code>api.style({fill: &#39;green&#39;, stroke: &#39;yellow&#39;})</code> to override those style settings.</p>\n","properties":{"arguments":{"type":["*"],"description":"<p>Parameters of <code>renderItem</code>.</p>\n","properties":{"params":{"type":["Object"]},"api":{"type":["Object"],"description":"<p>The second parameter of <code>renderItem</code>.</p>\n","properties":{"value":{"type":["Function"]},"coord":{"type":["Function"]},"size":{"type":["Function"]},"style":{"type":["Function"]},"styleEmphasis":{"type":["Function"]},"visual":{"type":["Function"]},"barLayout":{"type":["Function"]},"currentSeriesIndices":{"type":["Function"]},"font":{"type":["Function"]},"getWidth":{"type":["Function"]},"getHeight":{"type":["Function"]},"getZr":{"type":["Function"]},"getDevicePixelRatio":{"type":["Function"]}}}}},"return":{"type":["Object"]}}},"itemStyle":{"type":["Object"],"description":"<p>Graphic style of , <code>emphasis</code> is the style when it is highlighted, like being hovered by mouse, or highlighted via legend connect.</p>\n","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"dimensions":{"type":["Array"]},"encode":{"type":["Object"]},"seriesLayoutBy":{"type":["string"],"default":"'column'"},"datasetIndex":{"type":["number"],"default":0},"data":{"type":["Array"],"description":"<p>Data array of series, which can be in the following forms:</p>\n<p>Notice, if no <code>data</code> specified in series, and there is <a href=\"#dataset\">dataset</a> in option, series will use the first <a href=\"#dataset\">dataset</a> as its datasource. If <code>data</code> has been specified, <a href=\"#dataset\">dataset</a> will not used.</p>\n<p><code>series.datasetIndex</code> can be used to specify other <a href=\"#dataset\">dataset</a>.</p>\n<p>Basically, data is represented by a two-dimension array, like the example below, where each colum is named as a &quot;dimension&quot;.</p>\n<pre><code class=\"lang-js\">series: [{\n    data: [\n        // dimX   dimY   other dimensions ...\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>In <a href=\"#grid\">cartesian (grid)</a>, &quot;dimX&quot; and &quot;dimY&quot; correspond to <a href=\"#xAxis\">xAxis</a> and <a href=\"#yAxis\">yAxis</a> repectively.</li>\n<li>In <a href=\"#polar\">polar</a> &quot;dimX&quot; and &quot;dimY&quot; correspond to <a href=\"#radiusAxis\">radiusAxis</a> 和 <a href=\"#anbleAxis\">angleAxis</a> repectively.</li>\n<li>Other dimensions are optional, which can be used in other place. For example:<ul>\n<li><a href=\"#visualMap\">visualMap</a> can map one or more dimensions to viusal (color, symbol size ...).</li>\n<li><a href=\"#series.symbolSize\">series.symbolSize</a> can be set as a callback function, where symbol size can be calculated by values of a certain dimension.</li>\n<li>Values in other dimensions can be shown by <a href=\"#tooltip.formatter\">tooltip.formatter</a> or <a href=\"#series.label.formatter\">series.label.formatter</a>.</li>\n</ul>\n</li>\n</ul>\n<p>Especially, when there is one and only one category axis (axis.type is <code>&#39;category&#39;</code>), data can be simply be represented by a one-dimension array, like:</p>\n<pre><code class=\"lang-js\">xAxis: {\n    data: [&#39;a&#39;, &#39;b&#39;, &#39;m&#39;, &#39;n&#39;]\n},\nseries: [{\n    // Each item corresponds to each item in xAxis.data.\n    data: [23,  44,  55,  19]\n    // In fact, it is the simplification of the format below:\n    // data: [[0, 23], [1, 44], [2, 55], [3, 19]]\n}]\n</code></pre>\n<p><br>\n<strong>Relationship between &quot;value&quot; and <a href=\"#xAxis.type\">axis.type</a></strong></p>\n<ul>\n<li><p>When a dimension corresponds to a value axis (axis.type is <code>&#39;value&#39;</code> or <code>&#39;log&#39;</code>):</p>\n<p>  The value can be a <code>number</code> (like <code>12</code>) (can also be a number in a <code>string</code> format, like <code>&#39;12&#39;</code>).</p>\n</li>\n<li><p>When a dimension corresponds to a category axis (axis.type is <code>&#39;category&#39;</code>):</p>\n<p>  The value should be the ordinal of the axis.data (based on <code>0</code>), the string value of the axis.data. For example:</p>\n<pre><code class=\"lang-js\">  xAxis: {\n      type: &#39;category&#39;,\n      data: [&#39;Monday&#39;, &#39;Tuesday&#39;, &#39;Wednesday&#39;, &#39;Thursday&#39;]\n  },\n  yAxis: {\n      type: &#39;category&#39;,\n      data: [&#39;a&#39;, &#39;b&#39;, &#39;m&#39;, &#39;n&#39;, &#39;p&#39;, &#39;q&#39;]\n  },\n  series: [{\n      data: [\n          // xAxis      yAxis\n          [  0,           0,    2  ], // This point is located at xAxis: &#39;Monday&#39;, yAxis: &#39;a&#39;.\n          [  &#39;Thursday&#39;,  2,    1  ], // This point is located at xAxis: &#39;Thursday&#39;, yAxis: &#39;m&#39;.\n          [  2,          &#39;p&#39;,   2  ], // This point is located at xAxis: &#39;Wednesday&#39;, yAxis: &#39;p&#39;.\n          [  3,           3,    5  ]\n      ]\n  }]\n</code></pre>\n<p>  There is an example of double category axes: <a href=\"http://echarts.baidu.com/gallery/editor.html?c=scatter-punchCard\" target=\"_blank\">Github Punchcard</a>.</p>\n</li>\n<li><p>When a dimension corresponds to a time axis (type is <code>&#39;time&#39;</code>), the value can be:</p>\n<ul>\n<li>a timestamp, like <code>1484141700832</code>, which represents a UTC time.</li>\n<li>a date string, in one of the formats below:<ul>\n<li>a subset of <a href=\"http://www.ecma-international.org/ecma-262/5.1/#sec-15.9.1.15\" target=\"_blank\">ISO 8601</a>, only including (all of these are treated as local time unless timezone is specified, which is consistent with <a href=\"https://momentjs.com/\" target=\"_blank\">moment</a>):<ul>\n<li>only part of year/month/date/time are specified: <code>&#39;2012-03&#39;</code>, <code>&#39;2012-03-01&#39;</code>, <code>&#39;2012-03-01 05&#39;</code>, <code>&#39;2012-03-01 05:06&#39;</code>.</li>\n<li>separated by <code>&quot;T&quot;</code> or a space: <code>&#39;2012-03-01T12:22:33.123&#39;</code>, <code>&#39;2012-03-01 12:22:33.123&#39;</code>.</li>\n<li>timezone specified: <code>&#39;2012-03-01T12:22:33Z&#39;</code>, <code>&#39;2012-03-01T12:22:33+8000&#39;</code>, <code>&#39;2012-03-01T12:22:33-05:00&#39;</code>.</li>\n</ul>\n</li>\n<li>other date string format (all of these are treated as local time):\n<code>&#39;2012&#39;</code>, <code>&#39;2012-3-1&#39;</code>, <code>&#39;2012/3/1&#39;</code>, <code>&#39;2012/03/01&#39;</code>,\n<code>&#39;2009/6/12 2:00&#39;</code>, <code>&#39;2009/6/12 2:05:08&#39;</code>, <code>&#39;2009/6/12 2:05:08.123&#39;</code>.</li>\n</ul>\n</li>\n<li>a JavaScript Date instance created by user:<ul>\n<li>Caution, when using a data string to create a Date instance, <a href=\"http://dygraphs.com/date-formats.html\" target=\"_blank\">browser differences and inconsistencies</a> should be considered.</li>\n<li>For example: In chrome, <code>new Date(&#39;2012-01-01&#39;)</code> is treated as a Jan 1st 2012 in UTC, while <code>new Date(&#39;2012-1-1&#39;)</code> and <code>new Date(&#39;2012/01/01&#39;)</code> are treated as Jan 1st 2012 in local timezone. In safari <code>new Date(&#39;2012-1-1&#39;)</code> is not supported.</li>\n<li>So if you intent to perform <code>new Date(dateString)</code>, it is strongly recommended to use a time parse library (e.g., <a href=\"https://momentjs.com/\" target=\"_blank\">moment</a>), or use <code>echarts.number.parseDate</code>, or check <a href=\"http://dygraphs.com/date-formats.html\" target=\"_blank\">this</a>.</li>\n</ul>\n</li>\n</ul>\n</li>\n</ul>\n<p><br>\n<strong>Customize a data item:</strong></p>\n<p>When needing to customize a data item, it can be set as an object, where property <code>value</code> reprensent real value. For example:</p>\n<pre><code class=\"lang-js\">[\n    12,\n    24,\n    {\n        value: [24, 32],\n        // label style, only works in this data item.\n        label: {},\n        // item style, only works in this data item.\n        itemStyle:{}\n    },\n    33\n]\n// Or\n[\n    [12, 332],\n    [24, 32],\n    {\n        value: [24, 32],\n        // label style, only works in this data item.\n        label: {},\n        // item style, only works in this data item.\n        itemStyle:{}\n    },\n    [33, 31]\n]\n</code></pre>\n<p><br>\n<strong>Empty value:</strong></p>\n<p><code>&#39;-&#39;</code> or <code>null</code> or <code>undefined</code> or <code>NaN</code> can be used to describe that a data item is not exists (ps：<em>not exist</em> does not means its value is <code>0</code>).</p>\n<p>For example, line chart can break when encounter an empty value, and scatter chart do not display graphic elements for empty values.</p>\n<p><br><br></p>\n","items":{"type":"Object","properties":{"name":{"type":["string"]},"value":{"type":["number"]},"itemStyle":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]},"emphasis":{"type":["Object"],"description":"","properties":{"color":{"type":["Color"],"default":null},"borderColor":{"type":["Color"],"default":"\"#000\""},"borderWidth":{"type":["number"],"default":0},"borderType":{"type":["string"],"default":"'solid'"},"shadowBlur":{"type":["number"]},"shadowColor":{"type":["Color"]},"shadowOffsetX":{"type":["number"],"default":0},"shadowOffsetY":{"type":["number"],"default":0},"opacity":{"type":["number"]}}}}},"tooltip":{"type":["*"],"description":"<p>tooltip settings in this series data.</p>\n","properties":{"position":{"type":["string","Array"]},"formatter":{"type":["string","Function"]},"backgroundColor":{"type":["Color"],"default":"'rgba(50,50,50,0.7)'"},"borderColor":{"type":["Color"],"default":"'#333'"},"borderWidth":{"type":["number"],"default":0},"padding":{"type":["number"],"default":5},"textStyle":{"type":["Object"],"description":"<blockquote>\n<p><strong>Notice：</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code>&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The text syle of tooltip&#39;s floating layer.</p>\n","properties":{"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":14},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"extraCssText":{"type":["string"]}}}}}},"zlevel":{"type":["number"],"default":0},"z":{"type":["number"],"default":2},"silent":{"type":["boolean"],"default":false},"animation":{"type":["boolean"],"default":true},"animationThreshold":{"type":["number"],"default":2000},"animationDuration":{"type":["number","Function"],"default":1000},"animationEasing":{"type":["string"],"default":"cubicOut"},"animationDelay":{"type":["number","Function"],"default":0},"animationDurationUpdate":{"type":["number","Function"],"default":300},"animationEasingUpdate":{"type":["string"],"default":"cubicOut"},"animationDelayUpdate":{"type":["number","Function"],"default":0},"tooltip":{"type":["*"],"description":"<p>tooltip settings in this series.</p>\n","properties":{"position":{"type":["string","Array"]},"formatter":{"type":["string","Function"]},"backgroundColor":{"type":["Color"],"default":"'rgba(50,50,50,0.7)'"},"borderColor":{"type":["Color"],"default":"'#333'"},"borderWidth":{"type":["number"],"default":0},"padding":{"type":["number"],"default":5},"textStyle":{"type":["Object"],"description":"<p><br></p>\n<blockquote>\n<p><strong>Notice：</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code>&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The text syle of tooltip&#39;s floating layer.</p>\n","properties":{"color":{"type":["Color"],"default":"'#fff'"},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":14},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"extraCssText":{"type":["string"]}}}}}]},"properties":{}},"color":{"type":["Array"],"description":"<p>The color list of palette. If no color is set in series, the colors would be adopted sequentially and circularly from this list as the colors of series.</p>\n<p>Defaults:</p>\n<pre><code class=\"lang-js\">[&#39;#c23531&#39;,&#39;#2f4554&#39;, &#39;#61a0a8&#39;, &#39;#d48265&#39;, &#39;#91c7ae&#39;,&#39;#749f83&#39;,  &#39;#ca8622&#39;, &#39;#bda29a&#39;,&#39;#6e7074&#39;, &#39;#546570&#39;, &#39;#c4ccd3&#39;]\n</code></pre>\n","properties":{}},"backgroundColor":{"type":["Color"],"description":"<p>Background color. Defaults to have no background.</p>\n<blockquote>\n<p>Color can be represented in RGB, for example <code>&#39;rgb(128, 128, 128)&#39;</code>. RGBA can be used when you need alpha channel, for example <code>&#39;rgba(128, 128, 128, 0.5)&#39;</code>. You may also use hexadecimal format, for example <code>&#39;#ccc&#39;</code>. Gradient color and texture are also supported besides single colors.</p>\n<pre><code class=\"lang-js\">// Linear gradient. First four parameters are x0, y0, x2, and y2, each ranged from 0 to 1, standing for percentage in the bounding box. If globalCoord is `true`, then the first four parameters are in absolute pixel positions.\ncolor: {\n    type: &#39;linear&#39;,\n    x: 0,\n    y: 0,\n    x2: 0,\n    y2: 1,\n    colorStops: [{\n        offset: 0, color: &#39;red&#39; // color at 0% position\n    }, {\n        offset: 1, color: &#39;blue&#39; // color at 100% position\n    }],\n    globalCoord: false // false by default\n}\n// Radial gradient. First three parameters are x and y positions of center, and radius, similar to linear gradient.\ncolor: {\n    type: &#39;radial&#39;,\n    x: 0.5,\n    y: 0.5,\n    r: 0.5,\n    colorStops: [{\n        offset: 0, color: &#39;red&#39; // color at 0% position\n    }, {\n        offset: 1, color: &#39;blue&#39; // color at 100% position\n    }],\n    globalCoord: false // false by default\n}\n// Fill with texture\ncolor: {\n    image: imageDom, // HTMLImageElement, and HTMLCanvasElement are supported, while string path is not supported\n    repeat: &#39;repeat&#39; // whether to repeat texture, whose value can be repeat-x, repeat-y, or no-repeat\n}\n</code></pre>\n</blockquote>\n","properties":{}},"textStyle":{"type":["Object"],"description":"<p>Global font style.</p>\n","properties":{"color":{"type":["Color"],"default":"\"#fff\""},"fontStyle":{"type":["string"],"default":"'normal'"},"fontWeight":{"type":["string"],"default":"normal"},"fontFamily":{"type":["string"],"default":"'sans-serif'"},"fontSize":{"type":["number"],"default":12},"lineHeight":{"type":["number"]},"width":{"type":["number","string"]},"height":{"type":["number","string"]},"textBorderColor":{"type":["string"],"default":"'transparent'"},"textBorderWidth":{"type":["number"],"default":0},"textShadowColor":{"type":["string"],"default":"'transparent'"},"textShadowBlur":{"type":["number"],"default":0},"textShadowOffsetX":{"type":["number"],"default":0},"textShadowOffsetY":{"type":["number"],"default":0}}},"animation":{"type":["boolean"],"description":"<p>Whether to enable animation.</p>\n","default":true,"properties":{}},"animationThreshold":{"type":["number"],"description":"<p>Whether to set graphic number threshold to animation. Animation will be disabled when graphic number is larger than threshold.</p>\n","default":2000,"properties":{}},"animationDuration":{"type":["number","Function"],"description":"<p>Duration of the first animation, which supports callback function for different data to have different animation effect:</p>\n<pre><code class=\"lang-js\">animationDuration: function (idx) {\n    // delay for later data is larger\n    return idx * 100;\n}\n</code></pre>\n","default":1000,"properties":{}},"animationEasing":{"type":["string"],"description":"<p>Easing method used for the first animation. Varied easing effects can be found at <a href=\"http://echarts.baidu.com/gallery/editor.html?c=line-easing\" target=\"_blank\">easing effect example</a>.</p>\n","default":"cubicOut","properties":{}},"animationDelay":{"type":["number","Function"],"description":"<p>Delay before updating the first animation, which supports callback function for different data to have different animation effect.</p>\n<p>For example:</p>\n<pre><code class=\"lang-js\">animationDelay: function (idx) {\n    // delay for later data is larger\n    return idx * 100;\n}\n</code></pre>\n<p>See <a href=\"http://echarts.baidu.com/gallery/editor.html?c=bar-animation-delay\" target=\"_blank\">this example</a> for more information.</p>\n","default":0,"properties":{}},"animationDurationUpdate":{"type":["number","Function"],"description":"<p>Time for animation to complete, which supports callback function for different data to have different animation effect:</p>\n<pre><code class=\"lang-js\">animationDurationUpdate: function (idx) {\n    // delay for later data is larger\n    return idx * 100;\n}\n</code></pre>\n","default":300,"properties":{}},"animationEasingUpdate":{"type":["string"],"description":"<p>Easing method used for animation.</p>\n","default":"cubicOut","properties":{}},"animationDelayUpdate":{"type":["number","Function"],"description":"<p>Delay before updating animation, which supports callback function for different data to have different animation effect.</p>\n<p>For example:</p>\n<pre><code class=\"lang-js\">animationDelayUpdate: function (idx) {\n    // delay for later data is larger\n    return idx * 100;\n}\n</code></pre>\n<p>See <a href=\"http://echarts.baidu.com/gallery/editor.html?c=bar-animation-delay\" target=\"_blank\">this example</a> for more information.</p>\n","default":0,"properties":{}},"useUTC":{"type":["boolean"],"description":"<p>Whether to use UTC in display.</p>\n<ul>\n<li><code>true</code>: When <code>axis.type</code> is <code>&#39;time&#39;</code>, ticks is determined according to UTC, and <code>axisLabel</code> and <code>tooltip</code> use UTC by default.</li>\n<li><code>false</code>: When <code>axis.type</code> is <code>&#39;time&#39;</code>, ticks is determined according to local time, and <code>axisLabel</code> and <code>tooltip</code> use local time by default.</li>\n</ul>\n<p>The default value of <code>useUTC</code> is false, for sake of considering:</p>\n<ul>\n<li>In many cases, labels should be displayed in local time (whether the time is stored in server in local time or UTC).</li>\n<li>If user uses time string (like &#39;2012-01-02&#39;) in data, it usually means local time if time zone is not specified. Time should be displayed in its original time zone by default.</li>\n</ul>\n<p>Notice: the setting only effects &quot;display time&quot;, but not &quot;parse time&quot;.\nAbout how time value (like <code>1491339540396</code>, <code>&#39;2013-01-04&#39;</code>, ...) is parsed in echarts, see <a href=\"#series-line.data\">the time part in date</a>.</p>\n","default":false,"properties":{}}}}}