You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@echarts.apache.org by sh...@apache.org on 2021/02/06 12:45:56 UTC

[echarts-website] branch asf-site updated: update

This is an automated email from the ASF dual-hosted git repository.

shenyi pushed a commit to branch asf-site
in repository https://gitbox.apache.org/repos/asf/echarts-website.git


The following commit(s) were added to refs/heads/asf-site by this push:
     new a274347  update
a274347 is described below

commit a2743471cbd3ea1d0982ba838d3c48c18056dce7
Author: pissang <bm...@gmail.com>
AuthorDate: Sat Feb 6 20:45:26 2021 +0800

    update
---
 components/download.html                           |    2 +-
 en/api.html                                        |    2 +-
 en/builder/echarts.html                            |    2 +-
 en/changelog.html                                  |   21 +-
 en/coding-standard.html                            |  110 +-
 en/documents/api-parts/api-outline.js              |    2 +-
 en/documents/api-parts/api-outline.json            |    2 +-
 en/documents/api-parts/api.action.js               |    9 -
 en/documents/api-parts/api.action.json             |    9 -
 en/documents/api-parts/api.echarts.js              |    2 +-
 en/documents/api-parts/api.echarts.json            |    2 +-
 en/documents/api-parts/api.events.js               |    6 -
 en/documents/api-parts/api.events.json             |    6 -
 en/documents/api.json                              |    2 +-
 en/documents/option-parts/option-outline.js        |    2 +-
 en/documents/option-parts/option-outline.json      |    2 +-
 en/documents/option-parts/option.angleAxis.js      |   18 +-
 en/documents/option-parts/option.angleAxis.json    |   18 +-
 en/documents/option-parts/option.axisPointer.js    |    6 +-
 en/documents/option-parts/option.axisPointer.json  |    6 +-
 en/documents/option-parts/option.calendar.js       |   18 +-
 en/documents/option-parts/option.calendar.json     |   18 +-
 .../option-parts/option.dataZoom-slider.js         |    6 +-
 .../option-parts/option.dataZoom-slider.json       |    6 +-
 en/documents/option-parts/option.geo.js            |   48 +-
 en/documents/option-parts/option.geo.json          |   48 +-
 en/documents/option-parts/option.graphic.js        |  534 +++++
 en/documents/option-parts/option.graphic.json      |  534 +++++
 en/documents/option-parts/option.grid.js           |   19 +-
 en/documents/option-parts/option.grid.json         |   19 +-
 en/documents/option-parts/option.js                |    2 +-
 en/documents/option-parts/option.json              |    2 +-
 en/documents/option-parts/option.legend.js         |   24 +-
 en/documents/option-parts/option.legend.json       |   24 +-
 en/documents/option-parts/option.parallel.js       |   18 +-
 en/documents/option-parts/option.parallel.json     |   18 +-
 en/documents/option-parts/option.parallelAxis.js   |   18 +-
 en/documents/option-parts/option.parallelAxis.json |   18 +-
 en/documents/option-parts/option.polar.js          |   19 +-
 en/documents/option-parts/option.polar.json        |   19 +-
 en/documents/option-parts/option.radar.js          |   12 +-
 en/documents/option-parts/option.radar.json        |   12 +-
 en/documents/option-parts/option.radiusAxis.js     |   24 +-
 en/documents/option-parts/option.radiusAxis.json   |   24 +-
 en/documents/option-parts/option.series-bar.js     |   69 +-
 en/documents/option-parts/option.series-bar.json   |   69 +-
 en/documents/option-parts/option.series-boxplot.js |  254 +--
 .../option-parts/option.series-boxplot.json        |  254 +--
 .../option-parts/option.series-candlestick.js      |  188 +-
 .../option-parts/option.series-candlestick.json    |  188 +-
 en/documents/option-parts/option.series-custom.js  |  653 +++++-
 .../option-parts/option.series-custom.json         |  653 +++++-
 .../option-parts/option.series-effectScatter.js    |  244 +--
 .../option-parts/option.series-effectScatter.json  |  244 +--
 en/documents/option-parts/option.series-funnel.js  |  255 +--
 .../option-parts/option.series-funnel.json         |  255 +--
 en/documents/option-parts/option.series-gauge.js   |  193 +-
 en/documents/option-parts/option.series-gauge.json |  193 +-
 en/documents/option-parts/option.series-graph.js   |  320 +--
 en/documents/option-parts/option.series-graph.json |  320 +--
 en/documents/option-parts/option.series-heatmap.js |  211 +-
 .../option-parts/option.series-heatmap.json        |  211 +-
 en/documents/option-parts/option.series-line.js    |  276 +--
 en/documents/option-parts/option.series-line.json  |  276 +--
 en/documents/option-parts/option.series-lines.js   |  226 +-
 en/documents/option-parts/option.series-lines.json |  226 +-
 en/documents/option-parts/option.series-map.js     |  236 ++-
 en/documents/option-parts/option.series-map.json   |  236 ++-
 .../option-parts/option.series-pictorialBar.js     |  244 +--
 .../option-parts/option.series-pictorialBar.json   |  244 +--
 en/documents/option-parts/option.series-pie.js     |  316 +--
 en/documents/option-parts/option.series-pie.json   |  316 +--
 en/documents/option-parts/option.series-radar.js   |   84 +-
 en/documents/option-parts/option.series-radar.json |   84 +-
 en/documents/option-parts/option.series-sankey.js  |  438 ++--
 .../option-parts/option.series-sankey.json         |  438 ++--
 en/documents/option-parts/option.series-scatter.js |  244 +--
 .../option-parts/option.series-scatter.json        |  244 +--
 .../option-parts/option.series-sunburst.js         | 2242 ++------------------
 .../option-parts/option.series-sunburst.json       | 2242 ++------------------
 .../option-parts/option.series-themeRiver.js       |   70 +-
 .../option-parts/option.series-themeRiver.json     |   70 +-
 en/documents/option-parts/option.series-tree.js    |  108 +-
 en/documents/option-parts/option.series-tree.json  |  108 +-
 en/documents/option-parts/option.series-treemap.js |  224 +-
 .../option-parts/option.series-treemap.json        |  224 +-
 en/documents/option-parts/option.singleAxis.js     |   43 +-
 en/documents/option-parts/option.singleAxis.json   |   43 +-
 en/documents/option-parts/option.textStyle.js      |    6 +-
 en/documents/option-parts/option.textStyle.json    |    6 +-
 en/documents/option-parts/option.timeline.js       |   18 +-
 en/documents/option-parts/option.timeline.json     |   18 +-
 en/documents/option-parts/option.title.js          |   12 +-
 en/documents/option-parts/option.title.json        |   12 +-
 en/documents/option-parts/option.tooltip.js        |   21 +-
 en/documents/option-parts/option.tooltip.json      |   21 +-
 .../option-parts/option.visualMap-continuous.js    |    6 +-
 .../option-parts/option.visualMap-continuous.json  |    6 +-
 .../option-parts/option.visualMap-piecewise.js     |    6 +-
 .../option-parts/option.visualMap-piecewise.json   |    6 +-
 en/documents/option-parts/option.xAxis.js          |   24 +-
 en/documents/option-parts/option.xAxis.json        |   24 +-
 en/documents/option-parts/option.yAxis.js          |   24 +-
 en/documents/option-parts/option.yAxis.json        |   24 +-
 en/documents/option.json                           |    2 +-
 en/documents/tutorial-parts/tutorial.js            |    6 +-
 en/documents/tutorial-parts/tutorial.json          |    6 +-
 en/documents/tutorial.json                         |    2 +-
 en/download.html                                   |    2 +-
 en/index.html                                      |    2 +-
 en/js/download.js                                  |    2 +-
 en/option-gl.html                                  |    2 +-
 en/option.html                                     |    2 +-
 en/spreadsheet.html                                |    4 +-
 en/tutorial.html                                   |    2 +-
 examples/en/editor.html                            |    4 +-
 examples/en/index.html                             |    4 +-
 examples/en/view.html                              |    4 +-
 examples/js/example-bundle.js                      |    2 +-
 examples/zh/editor.html                            |    4 +-
 examples/zh/index.html                             |    4 +-
 examples/zh/view.html                              |    4 +-
 layouts/doc.html                                   |    2 +-
 layouts/example-simple.html                        |    4 +-
 layouts/example.html                               |    4 +-
 zh/api.html                                        |    2 +-
 zh/builder/echarts.html                            |    2 +-
 zh/changelog.html                                  |   20 +-
 zh/coding-standard.html                            |  110 +-
 zh/css/only_for_cdn_ready_check.css                |    2 +-
 zh/documents/api-parts/api-outline.js              |    2 +-
 zh/documents/api-parts/api-outline.json            |    2 +-
 zh/documents/api-parts/api.echarts.js              |    2 +-
 zh/documents/api-parts/api.echarts.json            |    2 +-
 zh/documents/api-parts/api.events.js               |    6 -
 zh/documents/api-parts/api.events.json             |    6 -
 zh/documents/api.json                              |    2 +-
 zh/documents/option-parts/option-outline.js        |    2 +-
 zh/documents/option-parts/option-outline.json      |    2 +-
 zh/documents/option-parts/option.geo.js            |   12 +-
 zh/documents/option-parts/option.geo.json          |   12 +-
 zh/documents/option-parts/option.graphic.js        |  534 +++++
 zh/documents/option-parts/option.graphic.json      |  534 +++++
 zh/documents/option-parts/option.grid.js           |    7 +-
 zh/documents/option-parts/option.grid.json         |    7 +-
 zh/documents/option-parts/option.js                |    2 +-
 zh/documents/option-parts/option.json              |    2 +-
 zh/documents/option-parts/option.polar.js          |    7 +-
 zh/documents/option-parts/option.polar.json        |    7 +-
 zh/documents/option-parts/option.series-bar.js     |   15 +-
 zh/documents/option-parts/option.series-bar.json   |   15 +-
 zh/documents/option-parts/option.series-boxplot.js |   38 +-
 .../option-parts/option.series-boxplot.json        |   38 +-
 .../option-parts/option.series-candlestick.js      |   38 +-
 .../option-parts/option.series-candlestick.json    |   38 +-
 zh/documents/option-parts/option.series-custom.js  |  641 +++++-
 .../option-parts/option.series-custom.json         |  641 +++++-
 .../option-parts/option.series-effectScatter.js    |   46 +-
 .../option-parts/option.series-effectScatter.json  |   46 +-
 zh/documents/option-parts/option.series-funnel.js  |   52 +-
 .../option-parts/option.series-funnel.json         |   52 +-
 zh/documents/option-parts/option.series-gauge.js   |   31 +-
 zh/documents/option-parts/option.series-gauge.json |   31 +-
 zh/documents/option-parts/option.series-graph.js   |   50 +-
 zh/documents/option-parts/option.series-graph.json |   50 +-
 zh/documents/option-parts/option.series-heatmap.js |   31 +-
 .../option-parts/option.series-heatmap.json        |   31 +-
 zh/documents/option-parts/option.series-line.js    |   54 +-
 zh/documents/option-parts/option.series-line.json  |   54 +-
 zh/documents/option-parts/option.series-lines.js   |   40 +-
 zh/documents/option-parts/option.series-lines.json |   40 +-
 zh/documents/option-parts/option.series-map.js     |   50 +-
 zh/documents/option-parts/option.series-map.json   |   50 +-
 .../option-parts/option.series-pictorialBar.js     |   46 +-
 .../option-parts/option.series-pictorialBar.json   |   46 +-
 zh/documents/option-parts/option.series-pie.js     |  118 +-
 zh/documents/option-parts/option.series-pie.json   |  118 +-
 zh/documents/option-parts/option.series-radar.js   |   22 +-
 zh/documents/option-parts/option.series-radar.json |   22 +-
 zh/documents/option-parts/option.series-sankey.js  |   24 +-
 .../option-parts/option.series-sankey.json         |   24 +-
 zh/documents/option-parts/option.series-scatter.js |   46 +-
 .../option-parts/option.series-scatter.json        |   46 +-
 .../option-parts/option.series-sunburst.js         |   18 +-
 .../option-parts/option.series-sunburst.json       |   18 +-
 .../option-parts/option.series-themeRiver.js       |    7 +-
 .../option-parts/option.series-themeRiver.json     |    7 +-
 zh/documents/option-parts/option.series-tree.js    |   24 +-
 zh/documents/option-parts/option.series-tree.json  |   24 +-
 zh/documents/option-parts/option.series-treemap.js |   62 +-
 .../option-parts/option.series-treemap.json        |   62 +-
 zh/documents/option-parts/option.singleAxis.js     |    7 +-
 zh/documents/option-parts/option.singleAxis.json   |    7 +-
 zh/documents/option-parts/option.tooltip.js        |    7 +-
 zh/documents/option-parts/option.tooltip.json      |    7 +-
 .../option-parts/option.visualMap-piecewise.js     |    2 +-
 .../option-parts/option.visualMap-piecewise.json   |    2 +-
 zh/documents/option.json                           |    2 +-
 zh/documents/tutorial-parts/tutorial.js            |    4 +-
 zh/documents/tutorial-parts/tutorial.json          |    4 +-
 zh/documents/tutorial.json                         |    2 +-
 zh/download.html                                   |    2 +-
 zh/download3.html                                  |    2 +-
 zh/index.html                                      |    2 +-
 zh/js/download.js                                  |    2 +-
 zh/option-gl.html                                  |    2 +-
 zh/option.html                                     |    2 +-
 zh/spreadsheet.html                                |    6 +-
 zh/tutorial.html                                   |    2 +-
 209 files changed, 10776 insertions(+), 9771 deletions(-)

diff --git a/components/download.html b/components/download.html
index 009e550..da84218 100644
--- a/components/download.html
+++ b/components/download.html
@@ -7,7 +7,7 @@
     document.head.insertBefore(el, document.getElementById('font-hack'));
 }
 </script><title>下载 - Apache ECharts</title><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/jquery@2.2.4/dist/jquery.min.js"></script></head><!--[if lte IE 8]><body class="lower-ie"><div id="lowie-main"><img src="https://echarts.apache.org/zh/images/forie.png?_v_=20200710_1" alt="ie tip"></div></body><![endif]-->
-<!--[if (gt IE 8)|!(IE)]><body class="undefined"></body><![endif]--><div id="apache-banner"><div class="txt"><p>请访问 Apache ECharts 的官网 &nbsp;</p><a id="a1" href="https://echarts.apache.org/zh/index.html">https://echarts.apache.org</a></div><a href="https://echarts.apache.org" target="_blank" onclick="logApache()" class="btn btn-main"><div>访问官网</div></a><a href="javascript:;" onclick="closeApacheBanner(true)" class="close-btn">x</a></div><div id="main"><nav class="navbar navbar-default na [...]
+<!--[if (gt IE 8)|!(IE)]><body class="undefined"></body><![endif]--><div id="apache-banner"><div class="txt"><p>请访问 Apache ECharts 的官网 &nbsp;</p><a id="a1" href="https://echarts.apache.org/zh/index.html">https://echarts.apache.org</a></div><a href="https://echarts.apache.org" target="_blank" onclick="logApache()" class="btn btn-main"><div>访问官网</div></a><a href="javascript:;" onclick="closeApacheBanner(true)" class="close-btn">x</a></div><div id="main"><nav class="navbar navbar-default na [...]
 
 //- $('.download-echarts').click(function (e) {
 //-     var el = document.createElement('div');
diff --git a/en/api.html b/en/api.html
index 228e66b..8720aa6 100644
--- a/en/api.html
+++ b/en/api.html
@@ -19,7 +19,7 @@ window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
 };
 if (window.EC_WWW_CDN_PAY_ROOT) {
     window.globalArgsExtra.cdnRoot = window.EC_WWW_CDN_PAY_ROOT + '/en/' + window.globalArgsExtra.baseUrl
-}</script><script type="text/javascript">window.globalArgsExtra.version = '36ca6681f7';
+}</script><script type="text/javascript">window.globalArgsExtra.version = '1c1da26cfb';
 echartsDoc.init('#ec-doc-main', window.globalArgsExtra);</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
 var hm = document.createElement("script");
diff --git a/en/builder/echarts.html b/en/builder/echarts.html
index 1f74337..5c84c32 100644
--- a/en/builder/echarts.html
+++ b/en/builder/echarts.html
@@ -54,7 +54,7 @@
                 'rollup': 'lib/rollup.browser',
                 'transformDev': 'lib/transform-dev-bundle'
             },
-            urlArgs: 'v=1611734978259'
+            urlArgs: 'v=1612615474746'
         });
 
         require(['build']);
diff --git a/en/changelog.html b/en/changelog.html
index 3f263c9..5b03fad 100644
--- a/en/changelog.html
+++ b/en/changelog.html
@@ -7,11 +7,26 @@
     document.head.insertBefore(el, document.getElementById('font-hack'));
 }
 </script><title>Changelog - Apache ECharts</title><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/jquery@2.2.4/dist/jquery.min.js"></script></head><!--[if lte IE 8]><body class="lower-ie"><div id="lowie-main"><img src="https://echarts.apache.org/en/images/forie.png?_v_=20200710_1" alt="ie tip"></div></body><![endif]-->
-<!--[if (gt IE 8)|!(IE)]><body class="undefined"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Please visit the official Apache ECharts Website at</p><a id="a2" href="https://echarts.apache.org/zh/index.html">https://echarts.apache.org</a></div><a href="https://echarts.apache.org" target="_blank" onclick="logApache()" class="btn btn-main"><div>Visit Official Website</div></a><a href="javascript:;" onclick="closeApacheBanner(true)" class="close-btn">x</a></div><div id="ma [...]
-<div class="time">2021-01-11</div>
+<!--[if (gt IE 8)|!(IE)]><body class="undefined"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Please visit the official Apache ECharts Website at</p><a id="a2" href="https://echarts.apache.org/zh/index.html">https://echarts.apache.org</a></div><a href="https://echarts.apache.org" target="_blank" onclick="logApache()" class="btn btn-main"><div>Visit Official Website</div></a><a href="javascript:;" onclick="closeApacheBanner(true)" class="close-btn">x</a></div><div id="ma [...]
+<div class="time">2021-02-01</div>
 
 <ul>
-<li>[Feature] New minimal import API. Improved exported option types. <a href="https://github.com/apache/incubator-echarts/issues/13890">#13890</a> (<a href="https://github.com/pissang">pissang</a>)</li>
+<li>[Fix] [dataZoom] Fix icon with <code>&#39;image://&#39;</code> won&#39;t display <a href="https://github.com/apache/echarts/issues/14056">#14056</a> (<a href="https://github.com/susiwen8">susiwen8</a>)</li>
+<li>[Fix] [pie] [gauge] Fix <code>zero</code> value sector may be incorrectly drawn as a circle. <a href="https://github.com/ecomfe/zrender/issues/699">#699</a> (<a href="https://github.com/plainheart">plainheart</a>)</li>
+<li>[Fix] [pie] Fix hiding wrong labels in pie. <a href="https://github.com/apache/echarts/issues/14108">#14108</a> (<a href="https://github.com/Nick22nd">Nick22nd</a>)</li>
+<li>[Fix] [map] Add <code>geo</code> as dependency in map. <a href="https://github.com/apache/echarts/issues/14124">#14124</a> (<a href="https://github.com/pissang">pissang</a>)</li>
+<li>[Fix] [pie] Fix <code>labelLine</code> will not been hidden when <code>label</code> is switched from outside to inside <a href="https://github.com/apache/echarts/issues/14017">#14017</a> (<a href="https://github.com/susiwen8">susiwen8</a>)</li>
+<li>[Fix] [toolbox] Fix <code>yAxisIndex: false</code> in toolbox dataZoom may have error. <a href="https://github.com/apache/echarts/issues/14175">#14175</a> (<a href="https://github.com/100pah">100pah</a>)</li>
+<li>[Fix] [toolbox] Fix image download may have error when not using default <code>pixelRatio</code>. <a href="https://github.com/ecomfe/zrender/issues/706">#706</a> (<a href="https://github.com/plainheart">plainheart</a>)</li>
+<li>[Fix] [toolbox] Use current <code>devicePixelRatio</code> by default for exporting crisp and clear images by default. <a href="https://github.com/apache/echarts/issues/14002">#14002</a> (<a href="https://github.com/plainheart">plainheart</a>)</li>
+<li>[Fix] [line] endLabel color support <code>&#39;inherit&#39;</code> <a href="https://github.com/apache/echarts/issues/14000">#14000</a> (<a href="https://github.com/susiwen8">susiwen8</a>)</li>
+<li>[Fix] [svg] fix <code>opacity</code> may not work in SVG renderer. <a href="https://github.com/ecomfe/zrender/issues/675">#675</a> (<a href="https://github.com/plainheart">plainheart</a>)</li>
+<li><p>[Fix] [type] Optimize event param types <a href="https://github.com/apache/echarts/issues/14155">#14155</a> (<a href="https://github.com/pissang">pissang</a>)</p>
+<h2 id="v5-0-1">v5.0.1</h2>
+<div class="time">2021-01-11</div>
+</li>
+<li><p>[Feature] New minimal import API. Improved exported option types. <a href="https://github.com/apache/incubator-echarts/issues/13890">#13890</a> (<a href="https://github.com/pissang">pissang</a>)</p>
+</li>
 <li>[Fix] [tooltip] Fix tooltip of markPoint is wrong <a href="https://github.com/apache/incubator-echarts/issues/13992">#13992</a> (<a href="https://github.com/susiwen8">susiwen8</a>)</li>
 <li>[Fix] [loading] Fix <code>showLoading</code> center align and <code>fontSize</code> not work. Add <code>fontFamily</code>, <code>fontWeight</code>, <code>fontStyle</code> <a href="https://github.com/apache/incubator-echarts/issues/13972">#13972</a> (<a href="https://github.com/yufeng04">yufeng04</a>)</li>
 <li>[Fix] [gauge] <code>pointer.offsetCenter</code> doesn&#39;t work without icon <a href="https://github.com/apache/incubator-echarts/issues/13966">#13966</a> (<a href="https://github.com/yufeng04">yufeng04</a>)</li>
diff --git a/en/coding-standard.html b/en/coding-standard.html
index 66f1bef..ca1f0fb 100644
--- a/en/coding-standard.html
+++ b/en/coding-standard.html
@@ -39,7 +39,7 @@ default:
 </code></pre>
 <h3 id="space">Space</h3>
 <p><strong>[MUST]</strong> Set off binary operator with spaces. But place no space between unary operator and its operand.</p>
-<pre><code class="lang-js">var a = !arr.length;
+<pre><code class="lang-js">let a = !arr.length;
 a++;
 a = b + c;
 </code></pre>
@@ -97,14 +97,14 @@ while(condition) {
 </code></pre>
 <p><strong>[MUST]</strong> In the object creating statement, place 1 space after <code>:</code>, but no space before it.</p>
 <pre><code class="lang-js">// good
-var obj = {
+const obj = {
     a: 1,
     b: 2,
     c: 3
 };
 
 // bad
-var obj = {
+const obj = {
     a : 1,
     b:2,
     c :3
@@ -116,7 +116,7 @@ var obj = {
 function funcName() {
 }
 
-var funcName = function funcName() {
+const funcName = function funcName() {
 };
 
 funcName();
@@ -127,7 +127,7 @@ funcName();
 function funcName () {
 }
 
-var funcName = function funcName () {
+const funcName = function funcName () {
 };
 
 funcName ();
@@ -171,22 +171,22 @@ while ( len-- ) {
 
 
 // good
-var arr1 = [];
-var arr2 = [1, 2, 3];
-var obj1 = {};
-var obj2 = {name: &#39;obj&#39;};
-var obj3 = {
+const arr1 = [];
+const arr2 = [1, 2, 3];
+const obj1 = {};
+const obj2 = {name: &#39;obj&#39;};
+const obj3 = {
     name: &#39;obj&#39;,
     age: 20,
     sex: 1
 };
 
 // bad
-var arr1 = [ ];
-var arr2 = [ 1, 2, 3 ];
-var obj1 = { };
-var obj2 = { name: &#39;obj&#39; };
-var obj3 = {name: &#39;obj&#39;, age: 20, sex: 1};
+const arr1 = [ ];
+const arr2 = [ 1, 2, 3 ];
+const obj1 = { };
+const obj2 = { name: &#39;obj&#39; };
+const obj3 = {name: &#39;obj&#39;, age: 20, sex: 1};
 </code></pre>
 <p><strong>[MUST]</strong> Must no trailing space in each line.</p>
 <h3 id="line-break">Line Break</h3>
@@ -202,7 +202,7 @@ if (user.isAuthenticated()
     // Code
 }
 
-var result = number1 + number2 + number3
+const result = number1 + number2 + number3
     + number4 + number5;
 
 
@@ -214,7 +214,7 @@ if (user.isAuthenticated() &amp;&amp;
     // Code
 }
 
-var result = number1 + number2 + number3 +
+const result = number1 + number2 + number3 +
     number4 + number5;
 </code></pre>
 <p><strong>[MUST]</strong> Start a new line for <code>)</code>, <code>]</code>, <code>}</code> if the content inside the brackets occupies multiple lines.
@@ -229,7 +229,7 @@ if (product) {
         sendProduct(user, product);
     }
 }
-var arr = [
+const arr = [
     &#39;candy&#39;, &#39;sugar&#39;
 ];
 
@@ -242,13 +242,13 @@ if (product) {
         sendProduct(user, product);
     }
 }
-var arr = [
+const arr = [
         &#39;candy&#39;, &#39;sugar&#39;
     ];
 </code></pre>
 <p><strong>[MUST]</strong> Must not break lines before <code>,</code> or <code>;</code>.</p>
 <pre><code class="lang-js">// good
-var obj = {
+const obj = {
     a: 1,
     b: 2,
     c: 3
@@ -262,7 +262,7 @@ foo(
 
 
 // bad
-var obj = {
+const obj = {
     a: 1
     , b: 2
     , c: 3
@@ -298,10 +298,10 @@ $(&#39;#items&#39;)
     .highlight()
     .end();
 
-var result = thisIsAVeryVeryLongCondition
+const result = thisIsAVeryVeryLongCondition
     ? resultA : resultB;
 
-var result = condition
+const res = condition
     ? thisIsAVeryVeryLongResult
     : resultB;
 </code></pre>
@@ -360,18 +360,18 @@ function funcName() {
 };
 
 // For function expression, the semicolon must not be ignored.
-var funcName = function () {
+const funcName = function () {
 };
 </code></pre>
 <p><strong>[MUST]</strong> No trailing comma in object and array declarations.</p>
 <pre><code class="lang-js">// good
 
-var obj = {
+const obj = {
     attr1: &#39;xxx&#39;,
     attr2: &#39;yyy&#39;
 };
 
-var arr = [
+const arr = [
     &#39;xxx&#39;,
     &#39;yyy&#39;
 ];
@@ -379,19 +379,19 @@ var arr = [
 
 // bad
 
-var obj = {
+const obj = {
     attr1: &#39;xxx&#39;,
     attr2: &#39;yyy&#39;,
 };
 
-var arr = [
+const arr = [
     &#39;xxx&#39;,
     &#39;yyy&#39;,
 ];
 </code></pre>
 <h3 id="naming-conventions">Naming Conventions</h3>
 <p><strong>[MUST]</strong> Use lowerCamelCase for variables, properties and function names.</p>
-<pre><code class="lang-js">var loadingModules = {};
+<pre><code class="lang-js">const loadingModules = {};
 function loadProduct() {
 }
 </code></pre>
@@ -402,12 +402,10 @@ function loadProduct() {
 <p><strong>[SUGGEST]</strong> All of the letters of a abbreviation should be both upper cases or both lower cases.</p>
 <pre><code class="lang-js">function parseSVG() {
 }
-var svgParser;
+const svgParser;
 </code></pre>
 <h2 id="language-features">Language features</h2>
 <h3 id="compatibility">Compatibility</h3>
-<p><strong>[MUST]</strong> The JavaScript code of ECharts should be based on <code>ECMAScript Language Specification Edition 3 (ES3)</code>. The language features that not supported by ES3 (namely, features that are only supported by ES5, ES6 or upper versions) must not be used.</p>
-<p>But there is an exception that ES Module can be used.</p>
 <p>Language features can be polyfilled by some utilities, but must not by modifying the prototype of the built-in JS objects.</p>
 <pre><code class="lang-js">// good
 
@@ -417,13 +415,13 @@ zrUtil.each(array, function (val, index) {
     sum += val;
 });
 
-var result = zrUtil.map(array, function (val) {
+const result = zrUtil.map(array, function (val) {
     return parse(val);
 });
 
-var pos = zrUtil.indexOf(array, val);
+const pos = zrUtil.indexOf(array, val);
 
-var obj2 = zrUtil.extend({}, obj1);
+const obj2 = zrUtil.extend({}, obj1);
 
 function Element() {
     // ...
@@ -442,7 +440,7 @@ let result = array.map(function (val) {
 
 const pos = array.indexOf(val);
 
-var obj2 = Object.assign({}, obj1);
+const obj2 = Object.assign({}, obj1);
 
 class Element {
     // ...
@@ -452,16 +450,16 @@ String.prototype.trim = function () {
 };
 </code></pre>
 <h3 id="variable">Variable</h3>
-<p><strong>[MUST]</strong> Variables must be declared by <code>var</code>. And a <code>var</code> can not declares more than one variable.</p>
+<p><strong>[MUST]</strong> Prefer using <code>const</code> to declare variable. And one line can not declares more than one variable.</p>
 <pre><code class="lang-js">// good
-var name = &#39;MyName&#39;;
-var hangModules = [];
-var missModules = [];
-var visited = {};
+const name = &#39;MyName&#39;;
+const hangModules = [];
+const missModules = [];
+const visited = {};
 
 // bad
 name = &#39;MyName&#39;;
-var hangModules = [],
+const hangModules = [],
     missModules = [],
     visited = {};
 </code></pre>
@@ -488,15 +486,15 @@ function clicker() {
     // ......
 }
 
-for (var i = 0, len = elements.length; i &lt; len; i++) {
-    var element = elements[i];
+for (let i = 0, len = elements.length; i &lt; len; i++) {
+    const element = elements[i];
     addListener(element, &#39;click&#39;, clicker);
 }
 
 
 // bad
-for (var i = 0, len = elements.length; i &lt; len; i++) {
-    var element = elements[i];
+for (let i = 0, len = elements.length; i &lt; len; i++) {
+    const element = elements[i];
     addListener(element, &#39;click&#39;, function () {});
 }
 </code></pre>
@@ -528,24 +526,24 @@ parseInt(str);
 <p><strong>[MUST]</strong> Use <code>&#39;</code> but not <code>&quot;</code> to define a string.</p>
 <p><strong>[MUST]</strong> Use object literal <code>{}</code> to create a plain object.</p>
 <pre><code class="lang-js">// good
-var obj = {};
+const obj = {};
 
 // bad
-var obj = new Object();
+const obj = new Object();
 </code></pre>
 <p><strong>[MUST]</strong> If all of the properties of an object literal do not need quotation marks, they should ignore them. If quotation marks is necessary, use <code>&#39;</code> but not <code>&quot;</code>.</p>
 <pre><code class="lang-js">// good
-var info = {
+const info = {
     name: &#39;someone&#39;,
     age: 28
 };
 
 // bad
-var info = {
+const info = {
     &#39;name&#39;: &#39;someone&#39;,
     &#39;age&#39;: 28
 };
-var info2 = {
+const info2 = {
     &quot;age&quot;: 40
 };
 </code></pre>
@@ -556,8 +554,8 @@ String.prototype.trim = function () {
 </code></pre>
 <p><strong>[SUGGEST]</strong> Try best to use <code>.</code> but not <code>[]</code> to visit properties of an object.</p>
 <p><strong>[SUGGEST]</strong> <code>hasOwnProperty</code> should be used to when using <code>for ... in ...</code>, in case that some extra properties is added on the prototype of <code>Object</code> in some runtime environment.</p>
-<pre><code class="lang-js">var newInfo = {};
-for (var key in info) {
+<pre><code class="lang-js">const newInfo = {};
+for (const key in info) {
     if (info.hasOwnProperty(key)) {
         newInfo[key] = info[key];
     }
@@ -565,11 +563,11 @@ for (var key in info) {
 </code></pre>
 <p><strong>[MUST]</strong> Use array literal <code>[]</code> to create an array, except intending to create an array with a given length.</p>
 <pre><code class="lang-js">// good
-var arr = [];
-var arr2 = new Array(1e4);
+const arr = [];
+const arr2 = new Array(1e4);
 
 // bad
-var arr = new Array();
+const arr = new Array();
 </code></pre>
 <p><strong>[MUST]</strong> Do not use <code>for in</code> in array traverse.</p>
 <h3 id="others">Others</h3>
diff --git a/en/documents/api-parts/api-outline.js b/en/documents/api-parts/api-outline.js
index b98fc18..1c4fb42 100644
--- a/en/documents/api-parts/api-outline.js
+++ b/en/documents/api-parts/api-outline.js
@@ -1 +1 @@
-window.__EC_DOC_api_outline = {"children":[{"type":"Object","isObject":true,"prop":"echarts","children":[{"type":"Function","prop":"init"},{"type":"Function","prop":"connect"},{"type":"Function","prop":"disconnect"},{"type":"Function","prop":"dispose"},{"type":"Function","prop":"getInstanceByDom"},{"type":"Function","prop":"use"},{"type":"Function","prop":"registerMap"},{"type":"Function","prop":"getMap"},{"type":"Function","prop":"registerTheme"},{"type":"Function","prop":"registerLocal [...]
\ No newline at end of file
+window.__EC_DOC_api_outline = {"children":[{"type":"Object","isObject":true,"prop":"echarts","children":[{"type":"Function","prop":"init"},{"type":"Function","prop":"connect"},{"type":"Function","prop":"disconnect"},{"type":"Function","prop":"dispose"},{"type":"Function","prop":"getInstanceByDom"},{"type":"Function","prop":"use"},{"type":"Function","prop":"registerMap"},{"type":"Function","prop":"getMap"},{"type":"Function","prop":"registerTheme"},{"type":"Function","prop":"registerLocal [...]
\ No newline at end of file
diff --git a/en/documents/api-parts/api-outline.json b/en/documents/api-parts/api-outline.json
index f06da5a..9b9e88e 100644
--- a/en/documents/api-parts/api-outline.json
+++ b/en/documents/api-parts/api-outline.json
@@ -1 +1 @@
-{"children":[{"type":"Object","isObject":true,"prop":"echarts","children":[{"type":"Function","prop":"init"},{"type":"Function","prop":"connect"},{"type":"Function","prop":"disconnect"},{"type":"Function","prop":"dispose"},{"type":"Function","prop":"getInstanceByDom"},{"type":"Function","prop":"use"},{"type":"Function","prop":"registerMap"},{"type":"Function","prop":"getMap"},{"type":"Function","prop":"registerTheme"},{"type":"Function","prop":"registerLocale"},{"type":"*","isObject":tru [...]
\ No newline at end of file
+{"children":[{"type":"Object","isObject":true,"prop":"echarts","children":[{"type":"Function","prop":"init"},{"type":"Function","prop":"connect"},{"type":"Function","prop":"disconnect"},{"type":"Function","prop":"dispose"},{"type":"Function","prop":"getInstanceByDom"},{"type":"Function","prop":"use"},{"type":"Function","prop":"registerMap"},{"type":"Function","prop":"getMap"},{"type":"Function","prop":"registerTheme"},{"type":"Function","prop":"registerLocale"},{"type":"*","isObject":tru [...]
\ No newline at end of file
diff --git a/en/documents/api-parts/api.action.js b/en/documents/api-parts/api.action.js
index 3732088..056574c 100644
--- a/en/documents/api-parts/api.action.js
+++ b/en/documents/api-parts/api.action.js
@@ -86,15 +86,6 @@ window.__EC_DOC_api_action = {
   "geo.geoToggleSelect": {
     "desc": "<p>Toggles selecting status of specified geo region.</p>\n<pre><code class=\"lang-js\">dispatchAction({\n    type: &#39;geoToggleSelect&#39;,\n    // optional; series index; could be an array of multiple series\n    seriesIndex?: number|Array,\n    // optional; series name; could be an array of multiple series\n    seriesName?: string|Array,\n    // data index; could assign by name attribute when not defined\n    dataIndex?: number,\n    // optional; data name; ignored when  [...]
   },
-  "graph": {
-    "desc": "<p>Actions related to <a href=\"option.html#series-graph\" target=\"_blank\">graph</a>, <a href=\"option.html#series-graph\" target=\"_blank\">graph</a> should be imported before use.</p>\n"
-  },
-  "graph.focusNodeAdjacency": {
-    "desc": "<p>Highlight the specified node and all of its adjacent nodes.</p>\n<pre><code class=\"lang-js\">dispatchAction({\n    type: &#39;focusNodeAdjacency&#39;,\n\n    // Use seriesId or seriesIndex or seriesName to specify\n    // the target series.\n    seriesId: &#39;xxx&#39;,\n    seriesIndex: 0,\n    seriesName: &#39;nnn&#39;,\n\n    // Use either `dataIndex` or `edgeDataIndex` to specify\n    // the target node or target edge.\n    dataIndex: 12\n    edgeDataIndex: 5\n})\n</ [...]
-  },
-  "graph.unfocusNodeAdjacency": {
-    "desc": "<p>Reverse highlight the specified node and all of its adjacent nodes.</p>\n<pre><code class=\"lang-js\">dispatchAction({\n    type: &#39;unfocusNodeAdjacency&#39;,\n\n    // Use seriesId or seriesIndex or seriesName to location the series.\n    seriesId: &#39;xxx&#39;,\n    seriesIndex: 0,\n    seriesName: &#39;nnn&#39;\n})\n</code></pre>\n<p>Event <a href=\"#event.unfocusNodeAdjacency\">unfocusNodeAdjacency</a> will be thrown finally.</p>\n"
-  },
   "brush": {
     "desc": "<p><a href=\"option.html#brush\" target=\"_blank\">brush</a> related actions.</p>\n"
   },
diff --git a/en/documents/api-parts/api.action.json b/en/documents/api-parts/api.action.json
index 3d78938..277f980 100644
--- a/en/documents/api-parts/api.action.json
+++ b/en/documents/api-parts/api.action.json
@@ -86,15 +86,6 @@
   "geo.geoToggleSelect": {
     "desc": "<p>Toggles selecting status of specified geo region.</p>\n<pre><code class=\"lang-js\">dispatchAction({\n    type: &#39;geoToggleSelect&#39;,\n    // optional; series index; could be an array of multiple series\n    seriesIndex?: number|Array,\n    // optional; series name; could be an array of multiple series\n    seriesName?: string|Array,\n    // data index; could assign by name attribute when not defined\n    dataIndex?: number,\n    // optional; data name; ignored when  [...]
   },
-  "graph": {
-    "desc": "<p>Actions related to <a href=\"option.html#series-graph\" target=\"_blank\">graph</a>, <a href=\"option.html#series-graph\" target=\"_blank\">graph</a> should be imported before use.</p>\n"
-  },
-  "graph.focusNodeAdjacency": {
-    "desc": "<p>Highlight the specified node and all of its adjacent nodes.</p>\n<pre><code class=\"lang-js\">dispatchAction({\n    type: &#39;focusNodeAdjacency&#39;,\n\n    // Use seriesId or seriesIndex or seriesName to specify\n    // the target series.\n    seriesId: &#39;xxx&#39;,\n    seriesIndex: 0,\n    seriesName: &#39;nnn&#39;,\n\n    // Use either `dataIndex` or `edgeDataIndex` to specify\n    // the target node or target edge.\n    dataIndex: 12\n    edgeDataIndex: 5\n})\n</ [...]
-  },
-  "graph.unfocusNodeAdjacency": {
-    "desc": "<p>Reverse highlight the specified node and all of its adjacent nodes.</p>\n<pre><code class=\"lang-js\">dispatchAction({\n    type: &#39;unfocusNodeAdjacency&#39;,\n\n    // Use seriesId or seriesIndex or seriesName to location the series.\n    seriesId: &#39;xxx&#39;,\n    seriesIndex: 0,\n    seriesName: &#39;nnn&#39;\n})\n</code></pre>\n<p>Event <a href=\"#event.unfocusNodeAdjacency\">unfocusNodeAdjacency</a> will be thrown finally.</p>\n"
-  },
   "brush": {
     "desc": "<p><a href=\"option.html#brush\" target=\"_blank\">brush</a> related actions.</p>\n"
   },
diff --git a/en/documents/api-parts/api.echarts.js b/en/documents/api-parts/api.echarts.js
index e756bf7..f2d47e2 100644
--- a/en/documents/api-parts/api.echarts.js
+++ b/en/documents/api-parts/api.echarts.js
@@ -15,7 +15,7 @@ window.__EC_DOC_api_echarts = {
     "desc": "<pre><code class=\"lang-js\">(target: HTMLDivElement|HTMLCanvasElement) =&gt; ECharts\n</code></pre>\n<p>Returns chart instance of dom container.</p>\n"
   },
   "use": {
-    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">5.0.1</code></p>\n</blockquote>\n<p>Use components. Used with the new tree-shaking API.</p>\n<pre><code class=\"lang-js\">// Import the echarts core module, which provides the necessary interfaces for using echarts.\nimport * as echarts from &#39;echarts/core&#39;;\n// Import bar charts, all with Chart suffix\nimport {\n    BarChart\n} from &#39;echarts/charts&#39;;\n// import rectangular coordinate system component, all suffix [...]
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">5.0.1</code></p>\n</blockquote>\n<p>Use components. Used with the new tree-shaking API.</p>\n<p>NOTE: <code class=\"codespan\">echarts.use</code> must be used before <code class=\"codespan\">eharts.init</code></p>\n<pre><code class=\"lang-js\">// Import the echarts core module, which provides the necessary interfaces for using echarts.\nimport * as echarts from &#39;echarts/core&#39;;\n// Import bar charts, all with Chart suffi [...]
   },
   "registerMap": {
     "desc": "<pre><code class=\"lang-js\">(mapName: string, geoJson: Object, specialAreas?: Object)\n</code></pre>\n<p>Registers available maps. This can only be used after including <a href=\"option.html#geo\" target=\"_blank\">geo</a> component or chart series of <a href=\"option.html#series-map\" target=\"_blank\">map</a>.</p>\n<p>Please refer to <a href=\"option.html#geo.map\" target=\"_blank\">option.geo</a> for usage.</p>\n<p><strong>Parameters</strong></p>\n<ul>\n<li><p><code clas [...]
diff --git a/en/documents/api-parts/api.echarts.json b/en/documents/api-parts/api.echarts.json
index dddceb1..0fbabca 100644
--- a/en/documents/api-parts/api.echarts.json
+++ b/en/documents/api-parts/api.echarts.json
@@ -15,7 +15,7 @@
     "desc": "<pre><code class=\"lang-js\">(target: HTMLDivElement|HTMLCanvasElement) =&gt; ECharts\n</code></pre>\n<p>Returns chart instance of dom container.</p>\n"
   },
   "use": {
-    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">5.0.1</code></p>\n</blockquote>\n<p>Use components. Used with the new tree-shaking API.</p>\n<pre><code class=\"lang-js\">// Import the echarts core module, which provides the necessary interfaces for using echarts.\nimport * as echarts from &#39;echarts/core&#39;;\n// Import bar charts, all with Chart suffix\nimport {\n    BarChart\n} from &#39;echarts/charts&#39;;\n// import rectangular coordinate system component, all suffix [...]
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">5.0.1</code></p>\n</blockquote>\n<p>Use components. Used with the new tree-shaking API.</p>\n<p>NOTE: <code class=\"codespan\">echarts.use</code> must be used before <code class=\"codespan\">eharts.init</code></p>\n<pre><code class=\"lang-js\">// Import the echarts core module, which provides the necessary interfaces for using echarts.\nimport * as echarts from &#39;echarts/core&#39;;\n// Import bar charts, all with Chart suffi [...]
   },
   "registerMap": {
     "desc": "<pre><code class=\"lang-js\">(mapName: string, geoJson: Object, specialAreas?: Object)\n</code></pre>\n<p>Registers available maps. This can only be used after including <a href=\"option.html#geo\" target=\"_blank\">geo</a> component or chart series of <a href=\"option.html#series-map\" target=\"_blank\">map</a>.</p>\n<p>Please refer to <a href=\"option.html#geo.map\" target=\"_blank\">option.geo</a> for usage.</p>\n<p><strong>Parameters</strong></p>\n<ul>\n<li><p><code clas [...]
diff --git a/en/documents/api-parts/api.events.js b/en/documents/api-parts/api.events.js
index 9d2afd8..a6e4116 100644
--- a/en/documents/api-parts/api.events.js
+++ b/en/documents/api-parts/api.events.js
@@ -62,12 +62,6 @@ window.__EC_DOC_api_events = {
   "axisareaselected": {
     "desc": "<p>Selecting event of range of <a href=\"option.html#parallelAxis\" target=\"_blank\">parallel axis</a>.</p>\n<p>When selecting axis range, the following method can be used to get data indices of currently highlighted lines, which is the list of indices in <code class=\"codespan\">data</code> of <code class=\"codespan\">series</code>.</p>\n<pre><code class=\"lang-javascript\">chart.on(&#39;axisareaselected&#39;, function () {\n    var series1 = chart.getModel().getSeries()[0 [...]
   },
-  "focusnodeadjacency": {
-    "desc": "<p>Adjacent nodes highlight event in <a href=\"option.html#graph\" target=\"_blank\">graph</a>.</p>\n<p>See <a href=\"#action.graph.focusNodeAdjacency\">focusNodeAdjacency</a>.</p>\n"
-  },
-  "unfocusnodeadjacency": {
-    "desc": "<p>Adjacent nodes reverse-highlight event in <a href=\"option.html#graph\" target=\"_blank\">graph</a>.</p>\n<p>See <a href=\"#action.graph.unfocusNodeAdjacency\">unfocusNodeAdjacency</a>.</p>\n"
-  },
   "brush": {
     "desc": "<p>Event triggered after action <a href=\"#action.brush.brush\">brush</a> dispatched.</p>\n"
   },
diff --git a/en/documents/api-parts/api.events.json b/en/documents/api-parts/api.events.json
index 6ff0d1d..b3567b8 100644
--- a/en/documents/api-parts/api.events.json
+++ b/en/documents/api-parts/api.events.json
@@ -62,12 +62,6 @@
   "axisareaselected": {
     "desc": "<p>Selecting event of range of <a href=\"option.html#parallelAxis\" target=\"_blank\">parallel axis</a>.</p>\n<p>When selecting axis range, the following method can be used to get data indices of currently highlighted lines, which is the list of indices in <code class=\"codespan\">data</code> of <code class=\"codespan\">series</code>.</p>\n<pre><code class=\"lang-javascript\">chart.on(&#39;axisareaselected&#39;, function () {\n    var series1 = chart.getModel().getSeries()[0 [...]
   },
-  "focusnodeadjacency": {
-    "desc": "<p>Adjacent nodes highlight event in <a href=\"option.html#graph\" target=\"_blank\">graph</a>.</p>\n<p>See <a href=\"#action.graph.focusNodeAdjacency\">focusNodeAdjacency</a>.</p>\n"
-  },
-  "unfocusnodeadjacency": {
-    "desc": "<p>Adjacent nodes reverse-highlight event in <a href=\"option.html#graph\" target=\"_blank\">graph</a>.</p>\n<p>See <a href=\"#action.graph.unfocusNodeAdjacency\">unfocusNodeAdjacency</a>.</p>\n"
-  },
   "brush": {
     "desc": "<p>Event triggered after action <a href=\"#action.brush.brush\">brush</a> dispatched.</p>\n"
   },
diff --git a/en/documents/api.json b/en/documents/api.json
index 094c982..9b4cf8e 100644
--- a/en/documents/api.json
+++ b/en/documents/api.json
@@ -1 +1 @@
-{"$schema":"https://echarts.apache.org/doc/json-schem","option":{"type":"Object","properties":{"echarts":{"type":["Object"],"description":"<p>Global echarts object, which can be accessed after including <code class=\"codespan\">echarts.js</code> in script tag or through <code class=\"codespan\">require(&#39;echarts&#39;)</code> in AMD environment.</p>\n","properties":{"init":{"type":["Function"],"description":"<pre><code class=\"lang-js\">(dom: HTMLDivElement|HTMLCanvasElement, theme?: O [...]
\ No newline at end of file
+{"$schema":"https://echarts.apache.org/doc/json-schem","option":{"type":"Object","properties":{"echarts":{"type":["Object"],"description":"<p>Global echarts object, which can be accessed after including <code class=\"codespan\">echarts.js</code> in script tag or through <code class=\"codespan\">require(&#39;echarts&#39;)</code> in AMD environment.</p>\n","properties":{"init":{"type":["Function"],"description":"<pre><code class=\"lang-js\">(dom: HTMLDivElement|HTMLCanvasElement, theme?: O [...]
\ No newline at end of file
diff --git a/en/documents/option-parts/option-outline.js b/en/documents/option-parts/option-outline.js
index dea8cf5..185b0f3 100644
--- a/en/documents/option-parts/option-outline.js
+++ b/en/documents/option-parts/option-outline.js
@@ -1 +1 @@
-window.__EC_DOC_option_outline = {"children":[{"type":"Object","isObject":true,"prop":"title","children":[{"type":"string","prop":"id"},{"default":true,"prop":"show"},{"default":"''","prop":"text"},{"default":"''","prop":"link"},{"default":"'blank'","prop":"target"},{"type":"Object","isObject":true,"prop":"textStyle","children":[{"type":"Color","default":"'#333'","prop":"color"},{"default":"'normal'","prop":"fontStyle"},{"type":["string","number"],"default":"'bolder'","prop":"fontWeight" [...]
\ No newline at end of file
+window.__EC_DOC_option_outline = {"children":[{"type":"Object","isObject":true,"prop":"title","children":[{"type":"string","prop":"id"},{"default":true,"prop":"show"},{"default":"''","prop":"text"},{"default":"''","prop":"link"},{"default":"'blank'","prop":"target"},{"type":"Object","isObject":true,"prop":"textStyle","children":[{"type":"Color","default":"'#333'","prop":"color"},{"default":"'normal'","prop":"fontStyle"},{"type":["string","number"],"default":"'bolder'","prop":"fontWeight" [...]
\ No newline at end of file
diff --git a/en/documents/option-parts/option-outline.json b/en/documents/option-parts/option-outline.json
index c36392b..031277c 100644
--- a/en/documents/option-parts/option-outline.json
+++ b/en/documents/option-parts/option-outline.json
@@ -1 +1 @@
-{"children":[{"type":"Object","isObject":true,"prop":"title","children":[{"type":"string","prop":"id"},{"default":true,"prop":"show"},{"default":"''","prop":"text"},{"default":"''","prop":"link"},{"default":"'blank'","prop":"target"},{"type":"Object","isObject":true,"prop":"textStyle","children":[{"type":"Color","default":"'#333'","prop":"color"},{"default":"'normal'","prop":"fontStyle"},{"type":["string","number"],"default":"'bolder'","prop":"fontWeight"},{"default":"'sans-serif'","prop [...]
\ No newline at end of file
+{"children":[{"type":"Object","isObject":true,"prop":"title","children":[{"type":"string","prop":"id"},{"default":true,"prop":"show"},{"default":"''","prop":"text"},{"default":"''","prop":"link"},{"default":"'blank'","prop":"target"},{"type":"Object","isObject":true,"prop":"textStyle","children":[{"type":"Color","default":"'#333'","prop":"color"},{"default":"'normal'","prop":"fontStyle"},{"type":["string","number"],"default":"'bolder'","prop":"fontWeight"},{"default":"'sans-serif'","prop [...]
\ No newline at end of file
diff --git a/en/documents/option-parts/option.angleAxis.js b/en/documents/option-parts/option.angleAxis.js
index 1de6cfd..5aa47ca 100644
--- a/en/documents/option-parts/option.angleAxis.js
+++ b/en/documents/option-parts/option.angleAxis.js
@@ -562,9 +562,9 @@ window.__EC_DOC_option_angleAxis = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -574,7 +574,7 @@ window.__EC_DOC_option_angleAxis = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1181,9 +1181,9 @@ window.__EC_DOC_option_angleAxis = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1193,7 +1193,7 @@ window.__EC_DOC_option_angleAxis = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1524,9 +1524,9 @@ window.__EC_DOC_option_angleAxis = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1536,7 +1536,7 @@ window.__EC_DOC_option_angleAxis = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
diff --git a/en/documents/option-parts/option.angleAxis.json b/en/documents/option-parts/option.angleAxis.json
index a58607e..a4809ff 100644
--- a/en/documents/option-parts/option.angleAxis.json
+++ b/en/documents/option-parts/option.angleAxis.json
@@ -562,9 +562,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -574,7 +574,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1181,9 +1181,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1193,7 +1193,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1524,9 +1524,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1536,7 +1536,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
diff --git a/en/documents/option-parts/option.axisPointer.js b/en/documents/option-parts/option.axisPointer.js
index 44bb114..c3e97e3 100644
--- a/en/documents/option-parts/option.axisPointer.js
+++ b/en/documents/option-parts/option.axisPointer.js
@@ -89,9 +89,9 @@ window.__EC_DOC_option_axisPointer = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -101,7 +101,7 @@ window.__EC_DOC_option_axisPointer = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
diff --git a/en/documents/option-parts/option.axisPointer.json b/en/documents/option-parts/option.axisPointer.json
index 7c165a9..b3d06a8 100644
--- a/en/documents/option-parts/option.axisPointer.json
+++ b/en/documents/option-parts/option.axisPointer.json
@@ -89,9 +89,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -101,7 +101,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
diff --git a/en/documents/option-parts/option.calendar.js b/en/documents/option-parts/option.calendar.js
index bde3548..ef49315 100644
--- a/en/documents/option-parts/option.calendar.js
+++ b/en/documents/option-parts/option.calendar.js
@@ -397,9 +397,9 @@ window.__EC_DOC_option_calendar = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -409,7 +409,7 @@ window.__EC_DOC_option_calendar = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -820,9 +820,9 @@ window.__EC_DOC_option_calendar = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -832,7 +832,7 @@ window.__EC_DOC_option_calendar = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1234,9 +1234,9 @@ window.__EC_DOC_option_calendar = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1246,7 +1246,7 @@ window.__EC_DOC_option_calendar = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
diff --git a/en/documents/option-parts/option.calendar.json b/en/documents/option-parts/option.calendar.json
index 9276398..8865c83 100644
--- a/en/documents/option-parts/option.calendar.json
+++ b/en/documents/option-parts/option.calendar.json
@@ -397,9 +397,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -409,7 +409,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -820,9 +820,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -832,7 +832,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1234,9 +1234,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1246,7 +1246,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
diff --git a/en/documents/option-parts/option.dataZoom-slider.js b/en/documents/option-parts/option.dataZoom-slider.js
index 132e4ed..ecf4261 100644
--- a/en/documents/option-parts/option.dataZoom-slider.js
+++ b/en/documents/option-parts/option.dataZoom-slider.js
@@ -536,9 +536,9 @@ window.__EC_DOC_option_dataZoom_slider = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -548,7 +548,7 @@ window.__EC_DOC_option_dataZoom_slider = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
diff --git a/en/documents/option-parts/option.dataZoom-slider.json b/en/documents/option-parts/option.dataZoom-slider.json
index 30e5092..4e675c0 100644
--- a/en/documents/option-parts/option.dataZoom-slider.json
+++ b/en/documents/option-parts/option.dataZoom-slider.json
@@ -536,9 +536,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -548,7 +548,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
diff --git a/en/documents/option-parts/option.geo.js b/en/documents/option-parts/option.geo.js
index 7691aa4..825f002 100644
--- a/en/documents/option-parts/option.geo.js
+++ b/en/documents/option-parts/option.geo.js
@@ -91,7 +91,7 @@ window.__EC_DOC_option_geo = {
     }
   },
   "label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -226,9 +226,9 @@ window.__EC_DOC_option_geo = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -238,7 +238,7 @@ window.__EC_DOC_option_geo = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -602,7 +602,7 @@ window.__EC_DOC_option_geo = {
     }
   },
   "emphasis.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "emphasis.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -737,9 +737,9 @@ window.__EC_DOC_option_geo = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -749,7 +749,7 @@ window.__EC_DOC_option_geo = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1110,7 +1110,7 @@ window.__EC_DOC_option_geo = {
     }
   },
   "select.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "select.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -1245,9 +1245,9 @@ window.__EC_DOC_option_geo = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1257,7 +1257,7 @@ window.__EC_DOC_option_geo = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1744,7 +1744,7 @@ window.__EC_DOC_option_geo = {
     }
   },
   "regions.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "regions.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -1879,9 +1879,9 @@ window.__EC_DOC_option_geo = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1891,7 +1891,7 @@ window.__EC_DOC_option_geo = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -2252,7 +2252,7 @@ window.__EC_DOC_option_geo = {
     }
   },
   "regions.emphasis.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "regions.emphasis.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -2387,9 +2387,9 @@ window.__EC_DOC_option_geo = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -2399,7 +2399,7 @@ window.__EC_DOC_option_geo = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -2760,7 +2760,7 @@ window.__EC_DOC_option_geo = {
     }
   },
   "regions.select.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "regions.select.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -2895,9 +2895,9 @@ window.__EC_DOC_option_geo = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -2907,7 +2907,7 @@ window.__EC_DOC_option_geo = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
diff --git a/en/documents/option-parts/option.geo.json b/en/documents/option-parts/option.geo.json
index 28da500..1e621bf 100644
--- a/en/documents/option-parts/option.geo.json
+++ b/en/documents/option-parts/option.geo.json
@@ -91,7 +91,7 @@
     }
   },
   "label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -226,9 +226,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -238,7 +238,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -602,7 +602,7 @@
     }
   },
   "emphasis.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "emphasis.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -737,9 +737,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -749,7 +749,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1110,7 +1110,7 @@
     }
   },
   "select.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "select.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -1245,9 +1245,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1257,7 +1257,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1744,7 +1744,7 @@
     }
   },
   "regions.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "regions.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -1879,9 +1879,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1891,7 +1891,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -2252,7 +2252,7 @@
     }
   },
   "regions.emphasis.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "regions.emphasis.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -2387,9 +2387,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -2399,7 +2399,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -2760,7 +2760,7 @@
     }
   },
   "regions.select.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "regions.select.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -2895,9 +2895,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -2907,7 +2907,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
diff --git a/en/documents/option-parts/option.graphic.js b/en/documents/option-parts/option.graphic.js
index fed65d8..c8f80a9 100644
--- a/en/documents/option-parts/option.graphic.js
+++ b/en/documents/option-parts/option.graphic.js
@@ -71,6 +71,45 @@ window.__EC_DOC_option_graphic = {
   "elements-group.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "elements-group.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#graphic.elements-text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "elements-group.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "elements-group.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "elements-group.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "elements-group.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "elements-group.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "elements-group.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "elements-group.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "elements-group.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "elements-group.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "elements-group.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "elements-group.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "elements-group.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "elements-group.cursor": {
     "desc": "\n\n<p>The mouse style when mouse hovers on an element, the same as <code class=\"codespan\">cursor</code> property in <code class=\"codespan\">CSS</code>.</p>\n",
     "uiControl": {
@@ -160,6 +199,45 @@ window.__EC_DOC_option_graphic = {
   "elements-image.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "elements-image.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#graphic.elements-text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "elements-image.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "elements-image.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "elements-image.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "elements-image.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "elements-image.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "elements-image.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "elements-image.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "elements-image.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "elements-image.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "elements-image.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "elements-image.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "elements-image.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "elements-image.cursor": {
     "desc": "\n\n<p>The mouse style when mouse hovers on an element, the same as <code class=\"codespan\">cursor</code> property in <code class=\"codespan\">CSS</code>.</p>\n",
     "uiControl": {
@@ -210,6 +288,12 @@ window.__EC_DOC_option_graphic = {
   "elements-image.style.shadowColor": {
     "desc": "<p>color of shadow.</p>\n"
   },
+  "elements-image.focus": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
+  },
+  "elements-image.blurScope": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
+  },
   "elements-text": {
     "desc": "<p>Text block.</p>\n"
   },
@@ -276,6 +360,45 @@ window.__EC_DOC_option_graphic = {
   "elements-text.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "elements-text.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#graphic.elements-text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "elements-text.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "elements-text.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "elements-text.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "elements-text.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "elements-text.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "elements-text.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "elements-text.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "elements-text.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "elements-text.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "elements-text.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "elements-text.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "elements-text.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "elements-text.cursor": {
     "desc": "\n\n<p>The mouse style when mouse hovers on an element, the same as <code class=\"codespan\">cursor</code> property in <code class=\"codespan\">CSS</code>.</p>\n",
     "uiControl": {
@@ -329,6 +452,12 @@ window.__EC_DOC_option_graphic = {
   "elements-text.style.shadowColor": {
     "desc": "<p>color of shadow.</p>\n"
   },
+  "elements-text.focus": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
+  },
+  "elements-text.blurScope": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
+  },
   "elements-rect": {
     "desc": "<p>Rectangle element.</p>\n"
   },
@@ -395,6 +524,45 @@ window.__EC_DOC_option_graphic = {
   "elements-rect.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "elements-rect.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#graphic.elements-text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "elements-rect.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "elements-rect.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "elements-rect.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "elements-rect.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "elements-rect.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "elements-rect.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "elements-rect.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "elements-rect.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "elements-rect.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "elements-rect.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "elements-rect.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "elements-rect.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "elements-rect.cursor": {
     "desc": "\n\n<p>The mouse style when mouse hovers on an element, the same as <code class=\"codespan\">cursor</code> property in <code class=\"codespan\">CSS</code>.</p>\n",
     "uiControl": {
@@ -448,6 +616,12 @@ window.__EC_DOC_option_graphic = {
   "elements-rect.style.shadowColor": {
     "desc": "<p>color of shadow.</p>\n"
   },
+  "elements-rect.focus": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
+  },
+  "elements-rect.blurScope": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
+  },
   "elements-circle": {
     "desc": "<p>Circle element.</p>\n"
   },
@@ -514,6 +688,45 @@ window.__EC_DOC_option_graphic = {
   "elements-circle.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "elements-circle.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#graphic.elements-text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "elements-circle.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "elements-circle.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "elements-circle.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "elements-circle.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "elements-circle.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "elements-circle.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "elements-circle.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "elements-circle.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "elements-circle.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "elements-circle.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "elements-circle.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "elements-circle.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "elements-circle.cursor": {
     "desc": "\n\n<p>The mouse style when mouse hovers on an element, the same as <code class=\"codespan\">cursor</code> property in <code class=\"codespan\">CSS</code>.</p>\n",
     "uiControl": {
@@ -561,6 +774,12 @@ window.__EC_DOC_option_graphic = {
   "elements-circle.style.shadowColor": {
     "desc": "<p>color of shadow.</p>\n"
   },
+  "elements-circle.focus": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
+  },
+  "elements-circle.blurScope": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
+  },
   "elements-ring": {
     "desc": "<p>Ring element.</p>\n"
   },
@@ -627,6 +846,45 @@ window.__EC_DOC_option_graphic = {
   "elements-ring.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "elements-ring.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#graphic.elements-text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "elements-ring.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "elements-ring.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "elements-ring.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "elements-ring.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "elements-ring.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "elements-ring.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "elements-ring.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "elements-ring.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "elements-ring.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "elements-ring.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "elements-ring.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "elements-ring.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "elements-ring.cursor": {
     "desc": "\n\n<p>The mouse style when mouse hovers on an element, the same as <code class=\"codespan\">cursor</code> property in <code class=\"codespan\">CSS</code>.</p>\n",
     "uiControl": {
@@ -677,6 +935,12 @@ window.__EC_DOC_option_graphic = {
   "elements-ring.style.shadowColor": {
     "desc": "<p>color of shadow.</p>\n"
   },
+  "elements-ring.focus": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
+  },
+  "elements-ring.blurScope": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
+  },
   "elements-sector": {
     "desc": "<p>Sector element.</p>\n"
   },
@@ -743,6 +1007,45 @@ window.__EC_DOC_option_graphic = {
   "elements-sector.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "elements-sector.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#graphic.elements-text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "elements-sector.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "elements-sector.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "elements-sector.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "elements-sector.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "elements-sector.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "elements-sector.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "elements-sector.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "elements-sector.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "elements-sector.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "elements-sector.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "elements-sector.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "elements-sector.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "elements-sector.cursor": {
     "desc": "\n\n<p>The mouse style when mouse hovers on an element, the same as <code class=\"codespan\">cursor</code> property in <code class=\"codespan\">CSS</code>.</p>\n",
     "uiControl": {
@@ -802,6 +1105,12 @@ window.__EC_DOC_option_graphic = {
   "elements-sector.style.shadowColor": {
     "desc": "<p>color of shadow.</p>\n"
   },
+  "elements-sector.focus": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
+  },
+  "elements-sector.blurScope": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
+  },
   "elements-arc": {
     "desc": "<p>Arc element.</p>\n"
   },
@@ -868,6 +1177,45 @@ window.__EC_DOC_option_graphic = {
   "elements-arc.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "elements-arc.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#graphic.elements-text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "elements-arc.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "elements-arc.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "elements-arc.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "elements-arc.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "elements-arc.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "elements-arc.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "elements-arc.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "elements-arc.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "elements-arc.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "elements-arc.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "elements-arc.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "elements-arc.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "elements-arc.cursor": {
     "desc": "\n\n<p>The mouse style when mouse hovers on an element, the same as <code class=\"codespan\">cursor</code> property in <code class=\"codespan\">CSS</code>.</p>\n",
     "uiControl": {
@@ -927,6 +1275,12 @@ window.__EC_DOC_option_graphic = {
   "elements-arc.style.shadowColor": {
     "desc": "<p>color of shadow.</p>\n"
   },
+  "elements-arc.focus": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
+  },
+  "elements-arc.blurScope": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
+  },
   "elements-polygon": {
     "desc": "<p>Polygon element.</p>\n"
   },
@@ -993,6 +1347,45 @@ window.__EC_DOC_option_graphic = {
   "elements-polygon.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "elements-polygon.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#graphic.elements-text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "elements-polygon.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "elements-polygon.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "elements-polygon.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "elements-polygon.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "elements-polygon.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "elements-polygon.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "elements-polygon.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "elements-polygon.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "elements-polygon.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "elements-polygon.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "elements-polygon.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "elements-polygon.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "elements-polygon.cursor": {
     "desc": "\n\n<p>The mouse style when mouse hovers on an element, the same as <code class=\"codespan\">cursor</code> property in <code class=\"codespan\">CSS</code>.</p>\n",
     "uiControl": {
@@ -1040,6 +1433,12 @@ window.__EC_DOC_option_graphic = {
   "elements-polygon.style.shadowColor": {
     "desc": "<p>color of shadow.</p>\n"
   },
+  "elements-polygon.focus": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
+  },
+  "elements-polygon.blurScope": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
+  },
   "elements-polyline": {
     "desc": "<p>Polyline element.</p>\n"
   },
@@ -1106,6 +1505,45 @@ window.__EC_DOC_option_graphic = {
   "elements-polyline.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "elements-polyline.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#graphic.elements-text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "elements-polyline.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "elements-polyline.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "elements-polyline.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "elements-polyline.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "elements-polyline.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "elements-polyline.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "elements-polyline.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "elements-polyline.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "elements-polyline.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "elements-polyline.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "elements-polyline.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "elements-polyline.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "elements-polyline.cursor": {
     "desc": "\n\n<p>The mouse style when mouse hovers on an element, the same as <code class=\"codespan\">cursor</code> property in <code class=\"codespan\">CSS</code>.</p>\n",
     "uiControl": {
@@ -1153,6 +1591,12 @@ window.__EC_DOC_option_graphic = {
   "elements-polyline.style.shadowColor": {
     "desc": "<p>color of shadow.</p>\n"
   },
+  "elements-polyline.focus": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
+  },
+  "elements-polyline.blurScope": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
+  },
   "elements-line": {
     "desc": "<p>Line element.</p>\n"
   },
@@ -1219,6 +1663,45 @@ window.__EC_DOC_option_graphic = {
   "elements-line.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "elements-line.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#graphic.elements-text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "elements-line.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "elements-line.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "elements-line.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "elements-line.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "elements-line.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "elements-line.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "elements-line.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "elements-line.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "elements-line.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "elements-line.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "elements-line.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "elements-line.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "elements-line.cursor": {
     "desc": "\n\n<p>The mouse style when mouse hovers on an element, the same as <code class=\"codespan\">cursor</code> property in <code class=\"codespan\">CSS</code>.</p>\n",
     "uiControl": {
@@ -1272,6 +1755,12 @@ window.__EC_DOC_option_graphic = {
   "elements-line.style.shadowColor": {
     "desc": "<p>color of shadow.</p>\n"
   },
+  "elements-line.focus": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
+  },
+  "elements-line.blurScope": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
+  },
   "elements-bezierCurve": {
     "desc": "<p>Quadratic bezier curve or cubic bezier curve.</p>\n"
   },
@@ -1338,6 +1827,45 @@ window.__EC_DOC_option_graphic = {
   "elements-bezierCurve.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "elements-bezierCurve.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#graphic.elements-text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "elements-bezierCurve.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "elements-bezierCurve.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "elements-bezierCurve.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "elements-bezierCurve.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "elements-bezierCurve.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "elements-bezierCurve.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "elements-bezierCurve.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "elements-bezierCurve.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "elements-bezierCurve.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "elements-bezierCurve.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "elements-bezierCurve.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "elements-bezierCurve.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "elements-bezierCurve.cursor": {
     "desc": "\n\n<p>The mouse style when mouse hovers on an element, the same as <code class=\"codespan\">cursor</code> property in <code class=\"codespan\">CSS</code>.</p>\n",
     "uiControl": {
@@ -1402,5 +1930,11 @@ window.__EC_DOC_option_graphic = {
   },
   "elements-bezierCurve.style.shadowColor": {
     "desc": "<p>color of shadow.</p>\n"
+  },
+  "elements-bezierCurve.focus": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
+  },
+  "elements-bezierCurve.blurScope": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
   }
 }
\ No newline at end of file
diff --git a/en/documents/option-parts/option.graphic.json b/en/documents/option-parts/option.graphic.json
index 16ccae1..868ff77 100644
--- a/en/documents/option-parts/option.graphic.json
+++ b/en/documents/option-parts/option.graphic.json
@@ -71,6 +71,45 @@
   "elements-group.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "elements-group.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#graphic.elements-text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "elements-group.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "elements-group.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "elements-group.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "elements-group.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "elements-group.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "elements-group.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "elements-group.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "elements-group.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "elements-group.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "elements-group.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "elements-group.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "elements-group.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "elements-group.cursor": {
     "desc": "\n\n<p>The mouse style when mouse hovers on an element, the same as <code class=\"codespan\">cursor</code> property in <code class=\"codespan\">CSS</code>.</p>\n",
     "uiControl": {
@@ -160,6 +199,45 @@
   "elements-image.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "elements-image.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#graphic.elements-text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "elements-image.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "elements-image.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "elements-image.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "elements-image.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "elements-image.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "elements-image.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "elements-image.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "elements-image.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "elements-image.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "elements-image.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "elements-image.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "elements-image.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "elements-image.cursor": {
     "desc": "\n\n<p>The mouse style when mouse hovers on an element, the same as <code class=\"codespan\">cursor</code> property in <code class=\"codespan\">CSS</code>.</p>\n",
     "uiControl": {
@@ -210,6 +288,12 @@
   "elements-image.style.shadowColor": {
     "desc": "<p>color of shadow.</p>\n"
   },
+  "elements-image.focus": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
+  },
+  "elements-image.blurScope": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
+  },
   "elements-text": {
     "desc": "<p>Text block.</p>\n"
   },
@@ -276,6 +360,45 @@
   "elements-text.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "elements-text.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#graphic.elements-text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "elements-text.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "elements-text.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "elements-text.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "elements-text.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "elements-text.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "elements-text.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "elements-text.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "elements-text.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "elements-text.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "elements-text.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "elements-text.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "elements-text.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "elements-text.cursor": {
     "desc": "\n\n<p>The mouse style when mouse hovers on an element, the same as <code class=\"codespan\">cursor</code> property in <code class=\"codespan\">CSS</code>.</p>\n",
     "uiControl": {
@@ -329,6 +452,12 @@
   "elements-text.style.shadowColor": {
     "desc": "<p>color of shadow.</p>\n"
   },
+  "elements-text.focus": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
+  },
+  "elements-text.blurScope": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
+  },
   "elements-rect": {
     "desc": "<p>Rectangle element.</p>\n"
   },
@@ -395,6 +524,45 @@
   "elements-rect.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "elements-rect.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#graphic.elements-text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "elements-rect.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "elements-rect.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "elements-rect.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "elements-rect.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "elements-rect.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "elements-rect.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "elements-rect.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "elements-rect.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "elements-rect.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "elements-rect.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "elements-rect.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "elements-rect.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "elements-rect.cursor": {
     "desc": "\n\n<p>The mouse style when mouse hovers on an element, the same as <code class=\"codespan\">cursor</code> property in <code class=\"codespan\">CSS</code>.</p>\n",
     "uiControl": {
@@ -448,6 +616,12 @@
   "elements-rect.style.shadowColor": {
     "desc": "<p>color of shadow.</p>\n"
   },
+  "elements-rect.focus": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
+  },
+  "elements-rect.blurScope": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
+  },
   "elements-circle": {
     "desc": "<p>Circle element.</p>\n"
   },
@@ -514,6 +688,45 @@
   "elements-circle.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "elements-circle.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#graphic.elements-text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "elements-circle.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "elements-circle.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "elements-circle.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "elements-circle.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "elements-circle.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "elements-circle.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "elements-circle.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "elements-circle.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "elements-circle.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "elements-circle.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "elements-circle.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "elements-circle.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "elements-circle.cursor": {
     "desc": "\n\n<p>The mouse style when mouse hovers on an element, the same as <code class=\"codespan\">cursor</code> property in <code class=\"codespan\">CSS</code>.</p>\n",
     "uiControl": {
@@ -561,6 +774,12 @@
   "elements-circle.style.shadowColor": {
     "desc": "<p>color of shadow.</p>\n"
   },
+  "elements-circle.focus": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
+  },
+  "elements-circle.blurScope": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
+  },
   "elements-ring": {
     "desc": "<p>Ring element.</p>\n"
   },
@@ -627,6 +846,45 @@
   "elements-ring.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "elements-ring.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#graphic.elements-text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "elements-ring.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "elements-ring.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "elements-ring.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "elements-ring.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "elements-ring.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "elements-ring.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "elements-ring.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "elements-ring.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "elements-ring.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "elements-ring.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "elements-ring.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "elements-ring.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "elements-ring.cursor": {
     "desc": "\n\n<p>The mouse style when mouse hovers on an element, the same as <code class=\"codespan\">cursor</code> property in <code class=\"codespan\">CSS</code>.</p>\n",
     "uiControl": {
@@ -677,6 +935,12 @@
   "elements-ring.style.shadowColor": {
     "desc": "<p>color of shadow.</p>\n"
   },
+  "elements-ring.focus": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
+  },
+  "elements-ring.blurScope": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
+  },
   "elements-sector": {
     "desc": "<p>Sector element.</p>\n"
   },
@@ -743,6 +1007,45 @@
   "elements-sector.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "elements-sector.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#graphic.elements-text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "elements-sector.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "elements-sector.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "elements-sector.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "elements-sector.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "elements-sector.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "elements-sector.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "elements-sector.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "elements-sector.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "elements-sector.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "elements-sector.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "elements-sector.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "elements-sector.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "elements-sector.cursor": {
     "desc": "\n\n<p>The mouse style when mouse hovers on an element, the same as <code class=\"codespan\">cursor</code> property in <code class=\"codespan\">CSS</code>.</p>\n",
     "uiControl": {
@@ -802,6 +1105,12 @@
   "elements-sector.style.shadowColor": {
     "desc": "<p>color of shadow.</p>\n"
   },
+  "elements-sector.focus": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
+  },
+  "elements-sector.blurScope": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
+  },
   "elements-arc": {
     "desc": "<p>Arc element.</p>\n"
   },
@@ -868,6 +1177,45 @@
   "elements-arc.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "elements-arc.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#graphic.elements-text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "elements-arc.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "elements-arc.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "elements-arc.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "elements-arc.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "elements-arc.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "elements-arc.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "elements-arc.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "elements-arc.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "elements-arc.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "elements-arc.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "elements-arc.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "elements-arc.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "elements-arc.cursor": {
     "desc": "\n\n<p>The mouse style when mouse hovers on an element, the same as <code class=\"codespan\">cursor</code> property in <code class=\"codespan\">CSS</code>.</p>\n",
     "uiControl": {
@@ -927,6 +1275,12 @@
   "elements-arc.style.shadowColor": {
     "desc": "<p>color of shadow.</p>\n"
   },
+  "elements-arc.focus": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
+  },
+  "elements-arc.blurScope": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
+  },
   "elements-polygon": {
     "desc": "<p>Polygon element.</p>\n"
   },
@@ -993,6 +1347,45 @@
   "elements-polygon.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "elements-polygon.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#graphic.elements-text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "elements-polygon.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "elements-polygon.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "elements-polygon.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "elements-polygon.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "elements-polygon.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "elements-polygon.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "elements-polygon.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "elements-polygon.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "elements-polygon.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "elements-polygon.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "elements-polygon.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "elements-polygon.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "elements-polygon.cursor": {
     "desc": "\n\n<p>The mouse style when mouse hovers on an element, the same as <code class=\"codespan\">cursor</code> property in <code class=\"codespan\">CSS</code>.</p>\n",
     "uiControl": {
@@ -1040,6 +1433,12 @@
   "elements-polygon.style.shadowColor": {
     "desc": "<p>color of shadow.</p>\n"
   },
+  "elements-polygon.focus": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
+  },
+  "elements-polygon.blurScope": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
+  },
   "elements-polyline": {
     "desc": "<p>Polyline element.</p>\n"
   },
@@ -1106,6 +1505,45 @@
   "elements-polyline.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "elements-polyline.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#graphic.elements-text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "elements-polyline.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "elements-polyline.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "elements-polyline.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "elements-polyline.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "elements-polyline.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "elements-polyline.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "elements-polyline.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "elements-polyline.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "elements-polyline.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "elements-polyline.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "elements-polyline.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "elements-polyline.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "elements-polyline.cursor": {
     "desc": "\n\n<p>The mouse style when mouse hovers on an element, the same as <code class=\"codespan\">cursor</code> property in <code class=\"codespan\">CSS</code>.</p>\n",
     "uiControl": {
@@ -1153,6 +1591,12 @@
   "elements-polyline.style.shadowColor": {
     "desc": "<p>color of shadow.</p>\n"
   },
+  "elements-polyline.focus": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
+  },
+  "elements-polyline.blurScope": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
+  },
   "elements-line": {
     "desc": "<p>Line element.</p>\n"
   },
@@ -1219,6 +1663,45 @@
   "elements-line.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "elements-line.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#graphic.elements-text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "elements-line.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "elements-line.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "elements-line.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "elements-line.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "elements-line.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "elements-line.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "elements-line.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "elements-line.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "elements-line.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "elements-line.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "elements-line.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "elements-line.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "elements-line.cursor": {
     "desc": "\n\n<p>The mouse style when mouse hovers on an element, the same as <code class=\"codespan\">cursor</code> property in <code class=\"codespan\">CSS</code>.</p>\n",
     "uiControl": {
@@ -1272,6 +1755,12 @@
   "elements-line.style.shadowColor": {
     "desc": "<p>color of shadow.</p>\n"
   },
+  "elements-line.focus": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
+  },
+  "elements-line.blurScope": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
+  },
   "elements-bezierCurve": {
     "desc": "<p>Quadratic bezier curve or cubic bezier curve.</p>\n"
   },
@@ -1338,6 +1827,45 @@
   "elements-bezierCurve.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "elements-bezierCurve.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#graphic.elements-text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "elements-bezierCurve.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "elements-bezierCurve.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "elements-bezierCurve.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "elements-bezierCurve.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "elements-bezierCurve.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "elements-bezierCurve.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "elements-bezierCurve.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "elements-bezierCurve.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "elements-bezierCurve.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "elements-bezierCurve.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "elements-bezierCurve.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "elements-bezierCurve.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "elements-bezierCurve.cursor": {
     "desc": "\n\n<p>The mouse style when mouse hovers on an element, the same as <code class=\"codespan\">cursor</code> property in <code class=\"codespan\">CSS</code>.</p>\n",
     "uiControl": {
@@ -1402,5 +1930,11 @@
   },
   "elements-bezierCurve.style.shadowColor": {
     "desc": "<p>color of shadow.</p>\n"
+  },
+  "elements-bezierCurve.focus": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
+  },
+  "elements-bezierCurve.blurScope": {
+    "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
   }
 }
\ No newline at end of file
diff --git a/en/documents/option-parts/option.grid.js b/en/documents/option-parts/option.grid.js
index fdc9ce7..99cb703 100644
--- a/en/documents/option-parts/option.grid.js
+++ b/en/documents/option-parts/option.grid.js
@@ -224,9 +224,9 @@ window.__EC_DOC_option_grid = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -236,7 +236,7 @@ window.__EC_DOC_option_grid = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -587,7 +587,7 @@ window.__EC_DOC_option_grid = {
     "desc": "<p>The position of the tooltip&#39;s floating layer, which would follow the position of mouse by default.</p>\n<p>Options:</p>\n<ul>\n<li><p><code class=\"codespan\">Array</code></p>\n<p>  Display the position of tooltip&#39;s floating layer through array, which supports absolute position and relative percentage.</p>\n<p>  Example:</p>\n<pre><code class=\"lang-js\">  // absolute position, which is 10px to the left side and 10px to the top side of the container\n  position: [ [...]
   },
   "tooltip.formatter": {
-    "desc": "<p>The content formatter of tooltip&#39;s floating layer which supports string template and callback function.</p>\n<p><strong>1. String template</strong></p>\n<p>The template variables are <code class=\"codespan\">{a}</code>, <code class=\"codespan\">{b}</code>, <code class=\"codespan\">{c}</code>, <code class=\"codespan\">{d}</code> and <code class=\"codespan\">{e}</code>, which stands for series name, data name and data value and ect. When <a href=\"#tooltip.trigger\">tri [...]
+    "desc": "<p>The content formatter of tooltip&#39;s floating layer which supports string template and callback function.</p>\n<p><strong>1. String template</strong></p>\n<p>The template variables are <code class=\"codespan\">{a}</code>, <code class=\"codespan\">{b}</code>, <code class=\"codespan\">{c}</code>, <code class=\"codespan\">{d}</code> and <code class=\"codespan\">{e}</code>, which stands for series name, data name and data value and ect. When <a href=\"#tooltip.trigger\">tri [...]
   },
   "tooltip.backgroundColor": {
     "desc": "<p>The background color of tooltip&#39;s floating layer.</p>\n"
@@ -671,9 +671,9 @@ window.__EC_DOC_option_grid = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -683,7 +683,7 @@ window.__EC_DOC_option_grid = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -744,6 +744,9 @@ window.__EC_DOC_option_grid = {
     "desc": "<p>Determine how to display the text when it&#39;s overflow on height.</p>\n<ul>\n<li><code class=\"codespan\">&#39;truncate&#39;</code> Truncate the overflow lines.</li>\n</ul>\n"
   },
   "tooltip.extraCssText": {
-    "desc": "<p>Extra CSS style for floating layer. The following is an example for adding shadow.</p>\n<pre><code class=\"lang-js\">extraCssText: &#39;box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);&#39;\n</code></pre>\n"
+    "desc": "\n\n\n\n\n\n\n\n\n\n<p>Extra CSS style for floating layer. The following is an example for adding shadow.</p>\n<pre><code class=\"lang-js\">extraCssText: &#39;box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);&#39;\n</code></pre>\n",
+    "uiControl": {
+      "type": "text"
+    }
   }
 }
\ No newline at end of file
diff --git a/en/documents/option-parts/option.grid.json b/en/documents/option-parts/option.grid.json
index de59e34..097897a 100644
--- a/en/documents/option-parts/option.grid.json
+++ b/en/documents/option-parts/option.grid.json
@@ -224,9 +224,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -236,7 +236,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -587,7 +587,7 @@
     "desc": "<p>The position of the tooltip&#39;s floating layer, which would follow the position of mouse by default.</p>\n<p>Options:</p>\n<ul>\n<li><p><code class=\"codespan\">Array</code></p>\n<p>  Display the position of tooltip&#39;s floating layer through array, which supports absolute position and relative percentage.</p>\n<p>  Example:</p>\n<pre><code class=\"lang-js\">  // absolute position, which is 10px to the left side and 10px to the top side of the container\n  position: [ [...]
   },
   "tooltip.formatter": {
-    "desc": "<p>The content formatter of tooltip&#39;s floating layer which supports string template and callback function.</p>\n<p><strong>1. String template</strong></p>\n<p>The template variables are <code class=\"codespan\">{a}</code>, <code class=\"codespan\">{b}</code>, <code class=\"codespan\">{c}</code>, <code class=\"codespan\">{d}</code> and <code class=\"codespan\">{e}</code>, which stands for series name, data name and data value and ect. When <a href=\"#tooltip.trigger\">tri [...]
+    "desc": "<p>The content formatter of tooltip&#39;s floating layer which supports string template and callback function.</p>\n<p><strong>1. String template</strong></p>\n<p>The template variables are <code class=\"codespan\">{a}</code>, <code class=\"codespan\">{b}</code>, <code class=\"codespan\">{c}</code>, <code class=\"codespan\">{d}</code> and <code class=\"codespan\">{e}</code>, which stands for series name, data name and data value and ect. When <a href=\"#tooltip.trigger\">tri [...]
   },
   "tooltip.backgroundColor": {
     "desc": "<p>The background color of tooltip&#39;s floating layer.</p>\n"
@@ -671,9 +671,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -683,7 +683,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -744,6 +744,9 @@
     "desc": "<p>Determine how to display the text when it&#39;s overflow on height.</p>\n<ul>\n<li><code class=\"codespan\">&#39;truncate&#39;</code> Truncate the overflow lines.</li>\n</ul>\n"
   },
   "tooltip.extraCssText": {
-    "desc": "<p>Extra CSS style for floating layer. The following is an example for adding shadow.</p>\n<pre><code class=\"lang-js\">extraCssText: &#39;box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);&#39;\n</code></pre>\n"
+    "desc": "\n\n\n\n\n\n\n\n\n\n<p>Extra CSS style for floating layer. The following is an example for adding shadow.</p>\n<pre><code class=\"lang-js\">extraCssText: &#39;box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);&#39;\n</code></pre>\n",
+    "uiControl": {
+      "type": "text"
+    }
   }
 }
\ No newline at end of file
diff --git a/en/documents/option-parts/option.js b/en/documents/option-parts/option.js
index f2d1b8d..9b42a60 100644
--- a/en/documents/option-parts/option.js
+++ b/en/documents/option-parts/option.js
@@ -518,7 +518,7 @@ window.__EC_DOC_option = {
     "desc": "<p><strong>custom series</strong></p>\n<p><code class=\"codespan\">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 handling those issue themselves.</p>\n<p><strong>For example, a &quot;x-range&quot; chart is made by custom  [...]
   },
   "color": {
-    "desc": "<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"
+    "desc": "<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;#5470c6&#39;, &#39;#91cc75&#39;, &#39;#fac858&#39;, &#39;#ee6666&#39;, &#39;#73c0de&#39;, &#39;#3ba272&#39;, &#39;#fc8452&#39;, &#39;#9a60b4&#39;, &#39;#ea7ccc&#39;]\n</code></pre>\n"
   },
   "backgroundColor": {
     "desc": "<p>Background color. Defaults to have no background.</p>\n<blockquote>\n<p>Color can be represented in RGB, for example <code class=\"codespan\">&#39;rgb(128, 128, 128)&#39;</code>. RGBA can be used when you need alpha channel, for example <code class=\"codespan\">&#39;rgba(128, 128, 128, 0.5)&#39;</code>. You may also use hexadecimal format, for example <code class=\"codespan\">&#39;#ccc&#39;</code>. Gradient color and texture are also supported besides single colors.</p>\n [...]
diff --git a/en/documents/option-parts/option.json b/en/documents/option-parts/option.json
index eaba1c3..8bba6a6 100644
--- a/en/documents/option-parts/option.json
+++ b/en/documents/option-parts/option.json
@@ -518,7 +518,7 @@
     "desc": "<p><strong>custom series</strong></p>\n<p><code class=\"codespan\">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 handling those issue themselves.</p>\n<p><strong>For example, a &quot;x-range&quot; chart is made by custom  [...]
   },
   "color": {
-    "desc": "<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"
+    "desc": "<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;#5470c6&#39;, &#39;#91cc75&#39;, &#39;#fac858&#39;, &#39;#ee6666&#39;, &#39;#73c0de&#39;, &#39;#3ba272&#39;, &#39;#fc8452&#39;, &#39;#9a60b4&#39;, &#39;#ea7ccc&#39;]\n</code></pre>\n"
   },
   "backgroundColor": {
     "desc": "<p>Background color. Defaults to have no background.</p>\n<blockquote>\n<p>Color can be represented in RGB, for example <code class=\"codespan\">&#39;rgb(128, 128, 128)&#39;</code>. RGBA can be used when you need alpha channel, for example <code class=\"codespan\">&#39;rgba(128, 128, 128, 0.5)&#39;</code>. You may also use hexadecimal format, for example <code class=\"codespan\">&#39;#ccc&#39;</code>. Gradient color and texture are also supported besides single colors.</p>\n [...]
diff --git a/en/documents/option-parts/option.legend.js b/en/documents/option-parts/option.legend.js
index c656972..3f9a3fb 100644
--- a/en/documents/option-parts/option.legend.js
+++ b/en/documents/option-parts/option.legend.js
@@ -263,9 +263,9 @@ window.__EC_DOC_option_legend = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -275,7 +275,7 @@ window.__EC_DOC_option_legend = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -701,9 +701,9 @@ window.__EC_DOC_option_legend = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -713,7 +713,7 @@ window.__EC_DOC_option_legend = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -960,9 +960,9 @@ window.__EC_DOC_option_legend = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -972,7 +972,7 @@ window.__EC_DOC_option_legend = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1387,9 +1387,9 @@ window.__EC_DOC_option_legend = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1399,7 +1399,7 @@ window.__EC_DOC_option_legend = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
diff --git a/en/documents/option-parts/option.legend.json b/en/documents/option-parts/option.legend.json
index 42da23a..fe03874 100644
--- a/en/documents/option-parts/option.legend.json
+++ b/en/documents/option-parts/option.legend.json
@@ -263,9 +263,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -275,7 +275,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -701,9 +701,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -713,7 +713,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -960,9 +960,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -972,7 +972,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1387,9 +1387,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1399,7 +1399,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
diff --git a/en/documents/option-parts/option.parallel.js b/en/documents/option-parts/option.parallel.js
index b58c836..9ca3aa5 100644
--- a/en/documents/option-parts/option.parallel.js
+++ b/en/documents/option-parts/option.parallel.js
@@ -250,9 +250,9 @@ window.__EC_DOC_option_parallel = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -262,7 +262,7 @@ window.__EC_DOC_option_parallel = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1072,9 +1072,9 @@ window.__EC_DOC_option_parallel = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1084,7 +1084,7 @@ window.__EC_DOC_option_parallel = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1467,9 +1467,9 @@ window.__EC_DOC_option_parallel = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1479,7 +1479,7 @@ window.__EC_DOC_option_parallel = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
diff --git a/en/documents/option-parts/option.parallel.json b/en/documents/option-parts/option.parallel.json
index d44208f..d3b118b 100644
--- a/en/documents/option-parts/option.parallel.json
+++ b/en/documents/option-parts/option.parallel.json
@@ -250,9 +250,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -262,7 +262,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1072,9 +1072,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1084,7 +1084,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1467,9 +1467,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1479,7 +1479,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
diff --git a/en/documents/option-parts/option.parallelAxis.js b/en/documents/option-parts/option.parallelAxis.js
index 6013fe5..9f82dda 100644
--- a/en/documents/option-parts/option.parallelAxis.js
+++ b/en/documents/option-parts/option.parallelAxis.js
@@ -211,9 +211,9 @@ window.__EC_DOC_option_parallelAxis = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -223,7 +223,7 @@ window.__EC_DOC_option_parallelAxis = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1033,9 +1033,9 @@ window.__EC_DOC_option_parallelAxis = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1045,7 +1045,7 @@ window.__EC_DOC_option_parallelAxis = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1428,9 +1428,9 @@ window.__EC_DOC_option_parallelAxis = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1440,7 +1440,7 @@ window.__EC_DOC_option_parallelAxis = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
diff --git a/en/documents/option-parts/option.parallelAxis.json b/en/documents/option-parts/option.parallelAxis.json
index f95e2a7..a24be0c 100644
--- a/en/documents/option-parts/option.parallelAxis.json
+++ b/en/documents/option-parts/option.parallelAxis.json
@@ -211,9 +211,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -223,7 +223,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1033,9 +1033,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1045,7 +1045,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1428,9 +1428,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1440,7 +1440,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
diff --git a/en/documents/option-parts/option.polar.js b/en/documents/option-parts/option.polar.js
index 4bce208..57723ab 100644
--- a/en/documents/option-parts/option.polar.js
+++ b/en/documents/option-parts/option.polar.js
@@ -129,9 +129,9 @@ window.__EC_DOC_option_polar = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -141,7 +141,7 @@ window.__EC_DOC_option_polar = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -492,7 +492,7 @@ window.__EC_DOC_option_polar = {
     "desc": "<p>The position of the tooltip&#39;s floating layer, which would follow the position of mouse by default.</p>\n<p>Options:</p>\n<ul>\n<li><p><code class=\"codespan\">Array</code></p>\n<p>  Display the position of tooltip&#39;s floating layer through array, which supports absolute position and relative percentage.</p>\n<p>  Example:</p>\n<pre><code class=\"lang-js\">  // absolute position, which is 10px to the left side and 10px to the top side of the container\n  position: [ [...]
   },
   "tooltip.formatter": {
-    "desc": "<p>The content formatter of tooltip&#39;s floating layer which supports string template and callback function.</p>\n<p><strong>1. String template</strong></p>\n<p>The template variables are <code class=\"codespan\">{a}</code>, <code class=\"codespan\">{b}</code>, <code class=\"codespan\">{c}</code>, <code class=\"codespan\">{d}</code> and <code class=\"codespan\">{e}</code>, which stands for series name, data name and data value and ect. When <a href=\"#tooltip.trigger\">tri [...]
+    "desc": "<p>The content formatter of tooltip&#39;s floating layer which supports string template and callback function.</p>\n<p><strong>1. String template</strong></p>\n<p>The template variables are <code class=\"codespan\">{a}</code>, <code class=\"codespan\">{b}</code>, <code class=\"codespan\">{c}</code>, <code class=\"codespan\">{d}</code> and <code class=\"codespan\">{e}</code>, which stands for series name, data name and data value and ect. When <a href=\"#tooltip.trigger\">tri [...]
   },
   "tooltip.backgroundColor": {
     "desc": "<p>The background color of tooltip&#39;s floating layer.</p>\n"
@@ -576,9 +576,9 @@ window.__EC_DOC_option_polar = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -588,7 +588,7 @@ window.__EC_DOC_option_polar = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -649,6 +649,9 @@ window.__EC_DOC_option_polar = {
     "desc": "<p>Determine how to display the text when it&#39;s overflow on height.</p>\n<ul>\n<li><code class=\"codespan\">&#39;truncate&#39;</code> Truncate the overflow lines.</li>\n</ul>\n"
   },
   "tooltip.extraCssText": {
-    "desc": "<p>Extra CSS style for floating layer. The following is an example for adding shadow.</p>\n<pre><code class=\"lang-js\">extraCssText: &#39;box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);&#39;\n</code></pre>\n"
+    "desc": "\n\n\n\n\n\n\n\n\n\n<p>Extra CSS style for floating layer. The following is an example for adding shadow.</p>\n<pre><code class=\"lang-js\">extraCssText: &#39;box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);&#39;\n</code></pre>\n",
+    "uiControl": {
+      "type": "text"
+    }
   }
 }
\ No newline at end of file
diff --git a/en/documents/option-parts/option.polar.json b/en/documents/option-parts/option.polar.json
index bd2bbd9..6ee77ea 100644
--- a/en/documents/option-parts/option.polar.json
+++ b/en/documents/option-parts/option.polar.json
@@ -129,9 +129,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -141,7 +141,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -492,7 +492,7 @@
     "desc": "<p>The position of the tooltip&#39;s floating layer, which would follow the position of mouse by default.</p>\n<p>Options:</p>\n<ul>\n<li><p><code class=\"codespan\">Array</code></p>\n<p>  Display the position of tooltip&#39;s floating layer through array, which supports absolute position and relative percentage.</p>\n<p>  Example:</p>\n<pre><code class=\"lang-js\">  // absolute position, which is 10px to the left side and 10px to the top side of the container\n  position: [ [...]
   },
   "tooltip.formatter": {
-    "desc": "<p>The content formatter of tooltip&#39;s floating layer which supports string template and callback function.</p>\n<p><strong>1. String template</strong></p>\n<p>The template variables are <code class=\"codespan\">{a}</code>, <code class=\"codespan\">{b}</code>, <code class=\"codespan\">{c}</code>, <code class=\"codespan\">{d}</code> and <code class=\"codespan\">{e}</code>, which stands for series name, data name and data value and ect. When <a href=\"#tooltip.trigger\">tri [...]
+    "desc": "<p>The content formatter of tooltip&#39;s floating layer which supports string template and callback function.</p>\n<p><strong>1. String template</strong></p>\n<p>The template variables are <code class=\"codespan\">{a}</code>, <code class=\"codespan\">{b}</code>, <code class=\"codespan\">{c}</code>, <code class=\"codespan\">{d}</code> and <code class=\"codespan\">{e}</code>, which stands for series name, data name and data value and ect. When <a href=\"#tooltip.trigger\">tri [...]
   },
   "tooltip.backgroundColor": {
     "desc": "<p>The background color of tooltip&#39;s floating layer.</p>\n"
@@ -576,9 +576,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -588,7 +588,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -649,6 +649,9 @@
     "desc": "<p>Determine how to display the text when it&#39;s overflow on height.</p>\n<ul>\n<li><code class=\"codespan\">&#39;truncate&#39;</code> Truncate the overflow lines.</li>\n</ul>\n"
   },
   "tooltip.extraCssText": {
-    "desc": "<p>Extra CSS style for floating layer. The following is an example for adding shadow.</p>\n<pre><code class=\"lang-js\">extraCssText: &#39;box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);&#39;\n</code></pre>\n"
+    "desc": "\n\n\n\n\n\n\n\n\n\n<p>Extra CSS style for floating layer. The following is an example for adding shadow.</p>\n<pre><code class=\"lang-js\">extraCssText: &#39;box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);&#39;\n</code></pre>\n",
+    "uiControl": {
+      "type": "text"
+    }
   }
 }
\ No newline at end of file
diff --git a/en/documents/option-parts/option.radar.js b/en/documents/option-parts/option.radar.js
index 7cc7771..1d00cf5 100644
--- a/en/documents/option-parts/option.radar.js
+++ b/en/documents/option-parts/option.radar.js
@@ -154,9 +154,9 @@ window.__EC_DOC_option_radar = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -166,7 +166,7 @@ window.__EC_DOC_option_radar = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -796,9 +796,9 @@ window.__EC_DOC_option_radar = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -808,7 +808,7 @@ window.__EC_DOC_option_radar = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
diff --git a/en/documents/option-parts/option.radar.json b/en/documents/option-parts/option.radar.json
index 5edad73..16f02db 100644
--- a/en/documents/option-parts/option.radar.json
+++ b/en/documents/option-parts/option.radar.json
@@ -154,9 +154,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -166,7 +166,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -796,9 +796,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -808,7 +808,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
diff --git a/en/documents/option-parts/option.radiusAxis.js b/en/documents/option-parts/option.radiusAxis.js
index 7ee3b6a..19be789 100644
--- a/en/documents/option-parts/option.radiusAxis.js
+++ b/en/documents/option-parts/option.radiusAxis.js
@@ -157,9 +157,9 @@ window.__EC_DOC_option_radiusAxis = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -169,7 +169,7 @@ window.__EC_DOC_option_radiusAxis = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -979,9 +979,9 @@ window.__EC_DOC_option_radiusAxis = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -991,7 +991,7 @@ window.__EC_DOC_option_radiusAxis = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1598,9 +1598,9 @@ window.__EC_DOC_option_radiusAxis = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1610,7 +1610,7 @@ window.__EC_DOC_option_radiusAxis = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1941,9 +1941,9 @@ window.__EC_DOC_option_radiusAxis = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1953,7 +1953,7 @@ window.__EC_DOC_option_radiusAxis = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
diff --git a/en/documents/option-parts/option.radiusAxis.json b/en/documents/option-parts/option.radiusAxis.json
index d002651..5fac1d4 100644
--- a/en/documents/option-parts/option.radiusAxis.json
+++ b/en/documents/option-parts/option.radiusAxis.json
@@ -157,9 +157,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -169,7 +169,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -979,9 +979,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -991,7 +991,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1598,9 +1598,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1610,7 +1610,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1941,9 +1941,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1953,7 +1953,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
diff --git a/en/documents/option-parts/option.series-bar.js b/en/documents/option-parts/option.series-bar.js
index f116d86..e03ae38 100644
--- a/en/documents/option-parts/option.series-bar.js
+++ b/en/documents/option-parts/option.series-bar.js
@@ -164,7 +164,7 @@ window.__EC_DOC_option_series_bar = {
     }
   },
   "label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -299,9 +299,9 @@ window.__EC_DOC_option_series_bar = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -311,7 +311,7 @@ window.__EC_DOC_option_series_bar = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -863,7 +863,7 @@ window.__EC_DOC_option_series_bar = {
     }
   },
   "emphasis.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "emphasis.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -998,9 +998,9 @@ window.__EC_DOC_option_series_bar = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1010,7 +1010,7 @@ window.__EC_DOC_option_series_bar = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1457,7 +1457,7 @@ window.__EC_DOC_option_series_bar = {
     }
   },
   "blur.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "blur.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -1592,9 +1592,9 @@ window.__EC_DOC_option_series_bar = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1604,7 +1604,7 @@ window.__EC_DOC_option_series_bar = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -2051,7 +2051,7 @@ window.__EC_DOC_option_series_bar = {
     }
   },
   "select.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "select.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -2186,9 +2186,9 @@ window.__EC_DOC_option_series_bar = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -2198,7 +2198,7 @@ window.__EC_DOC_option_series_bar = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -2875,9 +2875,9 @@ window.__EC_DOC_option_series_bar = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -2887,7 +2887,7 @@ window.__EC_DOC_option_series_bar = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -3520,9 +3520,9 @@ window.__EC_DOC_option_series_bar = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -3532,7 +3532,7 @@ window.__EC_DOC_option_series_bar = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -4111,9 +4111,9 @@ window.__EC_DOC_option_series_bar = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -4123,7 +4123,7 @@ window.__EC_DOC_option_series_bar = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -4702,9 +4702,9 @@ window.__EC_DOC_option_series_bar = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -4714,7 +4714,7 @@ window.__EC_DOC_option_series_bar = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -5189,7 +5189,7 @@ window.__EC_DOC_option_series_bar = {
     "desc": "<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The position of the tooltip&#39;s floating layer, which would follow the position of mouse by default.</p>\n<p>Options:</p>\n<ul>\n<li><p><code class=\"codespan\">Array</code></p>\n<p>  Display the position of tooltip&#39;s floating layer through array, which support [...]
   },
   "tooltip.formatter": {
-    "desc": "<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The content formatter of tooltip&#39;s floating layer which supports string template and callback function.</p>\n<p><strong>1. String template</strong></p>\n<p>The template variables are <code class=\"codespan\">{a}</code>, <code class=\"codespan\">{b}</code>, <code  [...]
+    "desc": "<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The content formatter of tooltip&#39;s floating layer which supports string template and callback function.</p>\n<p><strong>1. String template</strong></p>\n<p>The template variables are <code class=\"codespan\">{a}</code>, <code class=\"codespan\">{b}</code>, <code  [...]
   },
   "tooltip.backgroundColor": {
     "desc": "<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The background color of tooltip&#39;s floating layer.</p>\n"
@@ -5273,9 +5273,9 @@ window.__EC_DOC_option_series_bar = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -5285,7 +5285,7 @@ window.__EC_DOC_option_series_bar = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -5346,6 +5346,9 @@ window.__EC_DOC_option_series_bar = {
     "desc": "<p>Determine how to display the text when it&#39;s overflow on height.</p>\n<ul>\n<li><code class=\"codespan\">&#39;truncate&#39;</code> Truncate the overflow lines.</li>\n</ul>\n"
   },
   "tooltip.extraCssText": {
-    "desc": "<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>Extra CSS style for floating layer. The following is an example for adding shadow.</p>\n<pre><code class=\"lang-js\">extraCssText: &#39;box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);&#39;\n</code></pre>\n"
+    "desc": "\n\n\n\n\n<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>Extra CSS style for floating layer. The following is an example for adding shadow.</p>\n<pre><code class=\"lang-js\">extraCssText: &#39;box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);&#39;\n</code></pre>\n",
+    "uiControl": {
+      "type": "text"
+    }
   }
 }
\ No newline at end of file
diff --git a/en/documents/option-parts/option.series-bar.json b/en/documents/option-parts/option.series-bar.json
index fd9a03b..02de46f 100644
--- a/en/documents/option-parts/option.series-bar.json
+++ b/en/documents/option-parts/option.series-bar.json
@@ -164,7 +164,7 @@
     }
   },
   "label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -299,9 +299,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -311,7 +311,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -863,7 +863,7 @@
     }
   },
   "emphasis.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "emphasis.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -998,9 +998,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1010,7 +1010,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1457,7 +1457,7 @@
     }
   },
   "blur.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "blur.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -1592,9 +1592,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1604,7 +1604,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -2051,7 +2051,7 @@
     }
   },
   "select.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "select.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -2186,9 +2186,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -2198,7 +2198,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -2875,9 +2875,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -2887,7 +2887,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -3520,9 +3520,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -3532,7 +3532,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -4111,9 +4111,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -4123,7 +4123,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -4702,9 +4702,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -4714,7 +4714,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -5189,7 +5189,7 @@
     "desc": "<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The position of the tooltip&#39;s floating layer, which would follow the position of mouse by default.</p>\n<p>Options:</p>\n<ul>\n<li><p><code class=\"codespan\">Array</code></p>\n<p>  Display the position of tooltip&#39;s floating layer through array, which support [...]
   },
   "tooltip.formatter": {
-    "desc": "<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The content formatter of tooltip&#39;s floating layer which supports string template and callback function.</p>\n<p><strong>1. String template</strong></p>\n<p>The template variables are <code class=\"codespan\">{a}</code>, <code class=\"codespan\">{b}</code>, <code  [...]
+    "desc": "<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The content formatter of tooltip&#39;s floating layer which supports string template and callback function.</p>\n<p><strong>1. String template</strong></p>\n<p>The template variables are <code class=\"codespan\">{a}</code>, <code class=\"codespan\">{b}</code>, <code  [...]
   },
   "tooltip.backgroundColor": {
     "desc": "<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The background color of tooltip&#39;s floating layer.</p>\n"
@@ -5273,9 +5273,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -5285,7 +5285,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -5346,6 +5346,9 @@
     "desc": "<p>Determine how to display the text when it&#39;s overflow on height.</p>\n<ul>\n<li><code class=\"codespan\">&#39;truncate&#39;</code> Truncate the overflow lines.</li>\n</ul>\n"
   },
   "tooltip.extraCssText": {
-    "desc": "<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>Extra CSS style for floating layer. The following is an example for adding shadow.</p>\n<pre><code class=\"lang-js\">extraCssText: &#39;box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);&#39;\n</code></pre>\n"
+    "desc": "\n\n\n\n\n<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>Extra CSS style for floating layer. The following is an example for adding shadow.</p>\n<pre><code class=\"lang-js\">extraCssText: &#39;box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);&#39;\n</code></pre>\n",
+    "uiControl": {
+      "type": "text"
+    }
   }
 }
\ No newline at end of file
diff --git a/en/documents/option-parts/option.series-boxplot.js b/en/documents/option-parts/option.series-boxplot.js
index 00fc37c..34172b3 100644
--- a/en/documents/option-parts/option.series-boxplot.js
+++ b/en/documents/option-parts/option.series-boxplot.js
@@ -471,6 +471,39 @@ window.__EC_DOC_option_series_boxplot = {
       "step": "0.01"
     }
   },
+  "data.itemStyle.decal(Object | 'none')": {
+    "desc": "<p>The style of the decal pattern. It works only if <a href=\"#aria.enabled\">aria.enabled</a> and <a href=\"#aria.decal.show\">aria.decal.show</a> are both set to be <code class=\"codespan\">true</code>.</p>\n<p>If it is set to be <code class=\"codespan\">&#39;none&#39;</code>, no decal will be used.</p>\n<p>It works only if <code class=\"codespan\">areaStyle</code> is set.</p>\n"
+  },
+  "data.itemStyle.decal(Object | 'none').symbol(string|string[]) = 'rect'": {
+    "desc": "<p>The symbol type of the decal. If it is in the type of <code class=\"codespan\">string[]</code>, it means the symbols are used one by one.</p>\n<p>Icon types provided by ECharts includes</p>\n<p><code class=\"codespan\">&#39;circle&#39;</code>, <code class=\"codespan\">&#39;rect&#39;</code>, <code class=\"codespan\">&#39;roundRect&#39;</code>, <code class=\"codespan\">&#39;triangle&#39;</code>, <code class=\"codespan\">&#39;diamond&#39;</code>, <code class=\"codespan\">&#3 [...]
+  },
+  "data.itemStyle.decal(Object | 'none').symbolSize": {
+    "desc": "<p>Range of values: <code class=\"codespan\">0</code> to <code class=\"codespan\">1</code>, representing the size of symbol relative to decal.</p>\n"
+  },
+  "data.itemStyle.decal(Object | 'none').symbolKeepAspect": {
+    "desc": "<p>Whether or not to keep the aspect ratio of the pattern.</p>\n"
+  },
+  "data.itemStyle.decal(Object | 'none').color": {
+    "desc": "<p>For the color of the decal pattern, it is recommended to use a translucent color, which can be superimposed on the color of the series itself.</p>\n"
+  },
+  "data.itemStyle.decal(Object | 'none').backgroundColor": {
+    "desc": "<p>The background color of the decal will be over the color of the series itself, under the decal pattern.</p>\n"
+  },
+  "data.itemStyle.decal(Object | 'none').dashArrayX(number | number[] | (number | number[])[]) = 5": {
+    "desc": "<p>The basic pattern of the decal pattern is an infinite loop in the form of <code class=\"codespan\">Pattern - Blank - Pattern - Blank - Pattern - Blank</code> both horizontally and vertically, respectively. By setting the length of each pattern and blank, complex pattern effects can be achieved.</p>\n<p><code class=\"codespan\">dashArrayX</code> controls the horizontal pattern pattern. When its value is of type <code class=\"codespan\">number</code> or <code class=\"codesp [...]
+  },
+  "data.itemStyle.decal(Object | 'none').dashArrayY(number | number[]) = 5": {
+    "desc": "<p>The basic pattern of the decal pattern is an infinite loop in the form of <code class=\"codespan\">Pattern - Blank - Pattern - Blank - Pattern - Blank</code> both horizontally and vertically, respectively. By setting the length of each pattern and blank, complex pattern effects can be achieved.</p>\n<p><code class=\"codespan\">dashArrayY</code> controls the horizontal pattern pattern. Similar to <a href=\"https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-d [...]
+  },
+  "data.itemStyle.decal(Object | 'none').rotation": {
+    "desc": "<p>The overall rotation angle (in radians) of the pattern, in the range from `-Math.</p>\n"
+  },
+  "data.itemStyle.decal(Object | 'none').maxTileWidth": {
+    "desc": "<p>The upper limit of the width of the generated pattern before it is duplicated. Usually this value is not necessary, but you can try to increase it if you notice discontinuous seams in the pattern when it repeats.</p>\n"
+  },
+  "data.itemStyle.decal(Object | 'none').maxTileHeight": {
+    "desc": "<p>The upper limit of the height of the generated pattern before it repeats. This value is usually not necessary to set, but you can try to increase it if you find that the pattern has discontinuous seams when it is repeated.</p>\n"
+  },
   "data.emphasis": {
     "desc": "<p>Emphasis state of a single data.</p>\n"
   },
@@ -693,39 +726,6 @@ window.__EC_DOC_option_series_boxplot = {
       "step": "0.01"
     }
   },
-  "data.select.itemStyle.decal(Object | 'none')": {
-    "desc": "<p>The style of the decal pattern. It works only if <a href=\"#aria.enabled\">aria.enabled</a> and <a href=\"#aria.decal.show\">aria.decal.show</a> are both set to be <code class=\"codespan\">true</code>.</p>\n<p>If it is set to be <code class=\"codespan\">&#39;none&#39;</code>, no decal will be used.</p>\n<p>It works only if <code class=\"codespan\">areaStyle</code> is set.</p>\n"
-  },
-  "data.select.itemStyle.decal(Object | 'none').symbol(string|string[]) = 'rect'": {
-    "desc": "<p>The symbol type of the decal. If it is in the type of <code class=\"codespan\">string[]</code>, it means the symbols are used one by one.</p>\n<p>Icon types provided by ECharts includes</p>\n<p><code class=\"codespan\">&#39;circle&#39;</code>, <code class=\"codespan\">&#39;rect&#39;</code>, <code class=\"codespan\">&#39;roundRect&#39;</code>, <code class=\"codespan\">&#39;triangle&#39;</code>, <code class=\"codespan\">&#39;diamond&#39;</code>, <code class=\"codespan\">&#3 [...]
-  },
-  "data.select.itemStyle.decal(Object | 'none').symbolSize": {
-    "desc": "<p>Range of values: <code class=\"codespan\">0</code> to <code class=\"codespan\">1</code>, representing the size of symbol relative to decal.</p>\n"
-  },
-  "data.select.itemStyle.decal(Object | 'none').symbolKeepAspect": {
-    "desc": "<p>Whether or not to keep the aspect ratio of the pattern.</p>\n"
-  },
-  "data.select.itemStyle.decal(Object | 'none').color": {
-    "desc": "<p>For the color of the decal pattern, it is recommended to use a translucent color, which can be superimposed on the color of the series itself.</p>\n"
-  },
-  "data.select.itemStyle.decal(Object | 'none').backgroundColor": {
-    "desc": "<p>The background color of the decal will be over the color of the series itself, under the decal pattern.</p>\n"
-  },
-  "data.select.itemStyle.decal(Object | 'none').dashArrayX(number | number[] | (number | number[])[]) = 5": {
-    "desc": "<p>The basic pattern of the decal pattern is an infinite loop in the form of <code class=\"codespan\">Pattern - Blank - Pattern - Blank - Pattern - Blank</code> both horizontally and vertically, respectively. By setting the length of each pattern and blank, complex pattern effects can be achieved.</p>\n<p><code class=\"codespan\">dashArrayX</code> controls the horizontal pattern pattern. When its value is of type <code class=\"codespan\">number</code> or <code class=\"codesp [...]
-  },
-  "data.select.itemStyle.decal(Object | 'none').dashArrayY(number | number[]) = 5": {
-    "desc": "<p>The basic pattern of the decal pattern is an infinite loop in the form of <code class=\"codespan\">Pattern - Blank - Pattern - Blank - Pattern - Blank</code> both horizontally and vertically, respectively. By setting the length of each pattern and blank, complex pattern effects can be achieved.</p>\n<p><code class=\"codespan\">dashArrayY</code> controls the horizontal pattern pattern. Similar to <a href=\"https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-d [...]
-  },
-  "data.select.itemStyle.decal(Object | 'none').rotation": {
-    "desc": "<p>The overall rotation angle (in radians) of the pattern, in the range from `-Math.</p>\n"
-  },
-  "data.select.itemStyle.decal(Object | 'none').maxTileWidth": {
-    "desc": "<p>The upper limit of the width of the generated pattern before it is duplicated. Usually this value is not necessary, but you can try to increase it if you notice discontinuous seams in the pattern when it repeats.</p>\n"
-  },
-  "data.select.itemStyle.decal(Object | 'none').maxTileHeight": {
-    "desc": "<p>The upper limit of the height of the generated pattern before it repeats. This value is usually not necessary to set, but you can try to increase it if you find that the pattern has discontinuous seams when it is repeated.</p>\n"
-  },
   "data.tooltip": {
     "desc": "<p>tooltip settings in this series data.</p>\n"
   },
@@ -733,7 +733,7 @@ window.__EC_DOC_option_series_boxplot = {
     "desc": "<blockquote>\n<p><strong>Notice:</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The position of the tooltip&#39;s floating layer, which would follow the position of mouse by default.</p>\n<p>Options:</p>\n<ul>\n<li><p><code class=\"codespan\">Array</code></p>\n<p>  Display the position of tooltip&#39;s floating layer through array, which supports absolu [...]
   },
   "data.tooltip.formatter": {
-    "desc": "<blockquote>\n<p><strong>Notice:</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The content formatter of tooltip&#39;s floating layer which supports string template and callback function.</p>\n<p><strong>1. String template</strong></p>\n<p>The template variables are <code class=\"codespan\">{a}</code>, <code class=\"codespan\">{b}</code>, <code class=\" [...]
+    "desc": "<blockquote>\n<p><strong>Notice:</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The content formatter of tooltip&#39;s floating layer which supports string template and callback function.</p>\n<p><strong>1. String template</strong></p>\n<p>The template variables are <code class=\"codespan\">{a}</code>, <code class=\"codespan\">{b}</code>, <code class=\" [...]
   },
   "data.tooltip.backgroundColor": {
     "desc": "<blockquote>\n<p><strong>Notice:</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The background color of tooltip&#39;s floating layer.</p>\n"
@@ -817,9 +817,9 @@ window.__EC_DOC_option_series_boxplot = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -829,7 +829,7 @@ window.__EC_DOC_option_series_boxplot = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -890,7 +890,10 @@ window.__EC_DOC_option_series_boxplot = {
     "desc": "<p>Determine how to display the text when it&#39;s overflow on height.</p>\n<ul>\n<li><code class=\"codespan\">&#39;truncate&#39;</code> Truncate the overflow lines.</li>\n</ul>\n"
   },
   "data.tooltip.extraCssText": {
-    "desc": "<blockquote>\n<p><strong>Notice:</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>Extra CSS style for floating layer. The following is an example for adding shadow.</p>\n<pre><code class=\"lang-js\">extraCssText: &#39;box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);&#39;\n</code></pre>\n"
+    "desc": "\n\n\n\n\n<blockquote>\n<p><strong>Notice:</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>Extra CSS style for floating layer. The following is an example for adding shadow.</p>\n<pre><code class=\"lang-js\">extraCssText: &#39;box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);&#39;\n</code></pre>\n",
+    "uiControl": {
+      "type": "text"
+    }
   },
   "markPoint": {
     "desc": "<p>Mark point in a chart.</p>\n"
@@ -985,7 +988,7 @@ window.__EC_DOC_option_series_boxplot = {
     }
   },
   "markPoint.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markPoint.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -1120,9 +1123,9 @@ window.__EC_DOC_option_series_boxplot = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1132,7 +1135,7 @@ window.__EC_DOC_option_series_boxplot = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1493,7 +1496,7 @@ window.__EC_DOC_option_series_boxplot = {
     }
   },
   "markPoint.emphasis.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markPoint.emphasis.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -1628,9 +1631,9 @@ window.__EC_DOC_option_series_boxplot = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1640,7 +1643,7 @@ window.__EC_DOC_option_series_boxplot = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1998,7 +2001,7 @@ window.__EC_DOC_option_series_boxplot = {
     }
   },
   "markPoint.blur.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markPoint.blur.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -2133,9 +2136,9 @@ window.__EC_DOC_option_series_boxplot = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -2145,7 +2148,7 @@ window.__EC_DOC_option_series_boxplot = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -2789,9 +2792,9 @@ window.__EC_DOC_option_series_boxplot = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -2801,7 +2804,7 @@ window.__EC_DOC_option_series_boxplot = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -3217,9 +3220,9 @@ window.__EC_DOC_option_series_boxplot = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -3229,7 +3232,7 @@ window.__EC_DOC_option_series_boxplot = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -3623,7 +3626,7 @@ window.__EC_DOC_option_series_boxplot = {
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -3744,9 +3747,9 @@ window.__EC_DOC_option_series_boxplot = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -3756,7 +3759,7 @@ window.__EC_DOC_option_series_boxplot = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -4088,7 +4091,7 @@ window.__EC_DOC_option_series_boxplot = {
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.emphasis.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.emphasis.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -4209,9 +4212,9 @@ window.__EC_DOC_option_series_boxplot = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -4221,7 +4224,7 @@ window.__EC_DOC_option_series_boxplot = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -4540,7 +4543,7 @@ window.__EC_DOC_option_series_boxplot = {
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.blur.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.blur.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -4661,9 +4664,9 @@ window.__EC_DOC_option_series_boxplot = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -4673,7 +4676,7 @@ window.__EC_DOC_option_series_boxplot = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -5156,7 +5159,7 @@ window.__EC_DOC_option_series_boxplot = {
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.data.0.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.data.0.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -5277,9 +5280,9 @@ window.__EC_DOC_option_series_boxplot = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -5289,7 +5292,7 @@ window.__EC_DOC_option_series_boxplot = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -5615,7 +5618,7 @@ window.__EC_DOC_option_series_boxplot = {
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.data.0.emphasis.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.data.0.emphasis.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -5736,9 +5739,9 @@ window.__EC_DOC_option_series_boxplot = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -5748,7 +5751,7 @@ window.__EC_DOC_option_series_boxplot = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -6077,7 +6080,7 @@ window.__EC_DOC_option_series_boxplot = {
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.data.0.blur.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.data.0.blur.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -6198,9 +6201,9 @@ window.__EC_DOC_option_series_boxplot = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -6210,7 +6213,7 @@ window.__EC_DOC_option_series_boxplot = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -6625,7 +6628,7 @@ window.__EC_DOC_option_series_boxplot = {
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.data.1.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.data.1.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -6746,9 +6749,9 @@ window.__EC_DOC_option_series_boxplot = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -6758,7 +6761,7 @@ window.__EC_DOC_option_series_boxplot = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -7084,7 +7087,7 @@ window.__EC_DOC_option_series_boxplot = {
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.data.1.emphasis.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.data.1.emphasis.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -7205,9 +7208,9 @@ window.__EC_DOC_option_series_boxplot = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -7217,7 +7220,7 @@ window.__EC_DOC_option_series_boxplot = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -7546,7 +7549,7 @@ window.__EC_DOC_option_series_boxplot = {
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.data.1.blur.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.data.1.blur.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -7667,9 +7670,9 @@ window.__EC_DOC_option_series_boxplot = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -7679,7 +7682,7 @@ window.__EC_DOC_option_series_boxplot = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -8158,9 +8161,9 @@ window.__EC_DOC_option_series_boxplot = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -8170,7 +8173,7 @@ window.__EC_DOC_option_series_boxplot = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -8663,9 +8666,9 @@ window.__EC_DOC_option_series_boxplot = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -8675,7 +8678,7 @@ window.__EC_DOC_option_series_boxplot = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -9165,9 +9168,9 @@ window.__EC_DOC_option_series_boxplot = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -9177,7 +9180,7 @@ window.__EC_DOC_option_series_boxplot = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -9789,9 +9792,9 @@ window.__EC_DOC_option_series_boxplot = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -9801,7 +9804,7 @@ window.__EC_DOC_option_series_boxplot = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -10288,9 +10291,9 @@ window.__EC_DOC_option_series_boxplot = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -10300,7 +10303,7 @@ window.__EC_DOC_option_series_boxplot = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -10790,9 +10793,9 @@ window.__EC_DOC_option_series_boxplot = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -10802,7 +10805,7 @@ window.__EC_DOC_option_series_boxplot = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -11340,9 +11343,9 @@ window.__EC_DOC_option_series_boxplot = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -11352,7 +11355,7 @@ window.__EC_DOC_option_series_boxplot = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -11839,9 +11842,9 @@ window.__EC_DOC_option_series_boxplot = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -11851,7 +11854,7 @@ window.__EC_DOC_option_series_boxplot = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -12341,9 +12344,9 @@ window.__EC_DOC_option_series_boxplot = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -12353,7 +12356,7 @@ window.__EC_DOC_option_series_boxplot = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -12685,7 +12688,7 @@ window.__EC_DOC_option_series_boxplot = {
     "desc": "<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The position of the tooltip&#39;s floating layer, which would follow the position of mouse by default.</p>\n<p>Options:</p>\n<ul>\n<li><p><code class=\"codespan\">Array</code></p>\n<p>  Display the position of tooltip&#39;s floating layer through array, which support [...]
   },
   "tooltip.formatter": {
-    "desc": "<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The content formatter of tooltip&#39;s floating layer which supports string template and callback function.</p>\n<p><strong>1. String template</strong></p>\n<p>The template variables are <code class=\"codespan\">{a}</code>, <code class=\"codespan\">{b}</code>, <code  [...]
+    "desc": "<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The content formatter of tooltip&#39;s floating layer which supports string template and callback function.</p>\n<p><strong>1. String template</strong></p>\n<p>The template variables are <code class=\"codespan\">{a}</code>, <code class=\"codespan\">{b}</code>, <code  [...]
   },
   "tooltip.backgroundColor": {
     "desc": "<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The background color of tooltip&#39;s floating layer.</p>\n"
@@ -12769,9 +12772,9 @@ window.__EC_DOC_option_series_boxplot = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -12781,7 +12784,7 @@ window.__EC_DOC_option_series_boxplot = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -12842,6 +12845,9 @@ window.__EC_DOC_option_series_boxplot = {
     "desc": "<p>Determine how to display the text when it&#39;s overflow on height.</p>\n<ul>\n<li><code class=\"codespan\">&#39;truncate&#39;</code> Truncate the overflow lines.</li>\n</ul>\n"
   },
   "tooltip.extraCssText": {
-    "desc": "<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>Extra CSS style for floating layer. The following is an example for adding shadow.</p>\n<pre><code class=\"lang-js\">extraCssText: &#39;box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);&#39;\n</code></pre>\n"
+    "desc": "\n\n\n\n\n<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>Extra CSS style for floating layer. The following is an example for adding shadow.</p>\n<pre><code class=\"lang-js\">extraCssText: &#39;box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);&#39;\n</code></pre>\n",
+    "uiControl": {
+      "type": "text"
+    }
   }
 }
\ No newline at end of file
diff --git a/en/documents/option-parts/option.series-boxplot.json b/en/documents/option-parts/option.series-boxplot.json
index dc39091..5d03e09 100644
--- a/en/documents/option-parts/option.series-boxplot.json
+++ b/en/documents/option-parts/option.series-boxplot.json
@@ -471,6 +471,39 @@
       "step": "0.01"
     }
   },
+  "data.itemStyle.decal(Object | 'none')": {
+    "desc": "<p>The style of the decal pattern. It works only if <a href=\"#aria.enabled\">aria.enabled</a> and <a href=\"#aria.decal.show\">aria.decal.show</a> are both set to be <code class=\"codespan\">true</code>.</p>\n<p>If it is set to be <code class=\"codespan\">&#39;none&#39;</code>, no decal will be used.</p>\n<p>It works only if <code class=\"codespan\">areaStyle</code> is set.</p>\n"
+  },
+  "data.itemStyle.decal(Object | 'none').symbol(string|string[]) = 'rect'": {
+    "desc": "<p>The symbol type of the decal. If it is in the type of <code class=\"codespan\">string[]</code>, it means the symbols are used one by one.</p>\n<p>Icon types provided by ECharts includes</p>\n<p><code class=\"codespan\">&#39;circle&#39;</code>, <code class=\"codespan\">&#39;rect&#39;</code>, <code class=\"codespan\">&#39;roundRect&#39;</code>, <code class=\"codespan\">&#39;triangle&#39;</code>, <code class=\"codespan\">&#39;diamond&#39;</code>, <code class=\"codespan\">&#3 [...]
+  },
+  "data.itemStyle.decal(Object | 'none').symbolSize": {
+    "desc": "<p>Range of values: <code class=\"codespan\">0</code> to <code class=\"codespan\">1</code>, representing the size of symbol relative to decal.</p>\n"
+  },
+  "data.itemStyle.decal(Object | 'none').symbolKeepAspect": {
+    "desc": "<p>Whether or not to keep the aspect ratio of the pattern.</p>\n"
+  },
+  "data.itemStyle.decal(Object | 'none').color": {
+    "desc": "<p>For the color of the decal pattern, it is recommended to use a translucent color, which can be superimposed on the color of the series itself.</p>\n"
+  },
+  "data.itemStyle.decal(Object | 'none').backgroundColor": {
+    "desc": "<p>The background color of the decal will be over the color of the series itself, under the decal pattern.</p>\n"
+  },
+  "data.itemStyle.decal(Object | 'none').dashArrayX(number | number[] | (number | number[])[]) = 5": {
+    "desc": "<p>The basic pattern of the decal pattern is an infinite loop in the form of <code class=\"codespan\">Pattern - Blank - Pattern - Blank - Pattern - Blank</code> both horizontally and vertically, respectively. By setting the length of each pattern and blank, complex pattern effects can be achieved.</p>\n<p><code class=\"codespan\">dashArrayX</code> controls the horizontal pattern pattern. When its value is of type <code class=\"codespan\">number</code> or <code class=\"codesp [...]
+  },
+  "data.itemStyle.decal(Object | 'none').dashArrayY(number | number[]) = 5": {
+    "desc": "<p>The basic pattern of the decal pattern is an infinite loop in the form of <code class=\"codespan\">Pattern - Blank - Pattern - Blank - Pattern - Blank</code> both horizontally and vertically, respectively. By setting the length of each pattern and blank, complex pattern effects can be achieved.</p>\n<p><code class=\"codespan\">dashArrayY</code> controls the horizontal pattern pattern. Similar to <a href=\"https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-d [...]
+  },
+  "data.itemStyle.decal(Object | 'none').rotation": {
+    "desc": "<p>The overall rotation angle (in radians) of the pattern, in the range from `-Math.</p>\n"
+  },
+  "data.itemStyle.decal(Object | 'none').maxTileWidth": {
+    "desc": "<p>The upper limit of the width of the generated pattern before it is duplicated. Usually this value is not necessary, but you can try to increase it if you notice discontinuous seams in the pattern when it repeats.</p>\n"
+  },
+  "data.itemStyle.decal(Object | 'none').maxTileHeight": {
+    "desc": "<p>The upper limit of the height of the generated pattern before it repeats. This value is usually not necessary to set, but you can try to increase it if you find that the pattern has discontinuous seams when it is repeated.</p>\n"
+  },
   "data.emphasis": {
     "desc": "<p>Emphasis state of a single data.</p>\n"
   },
@@ -693,39 +726,6 @@
       "step": "0.01"
     }
   },
-  "data.select.itemStyle.decal(Object | 'none')": {
-    "desc": "<p>The style of the decal pattern. It works only if <a href=\"#aria.enabled\">aria.enabled</a> and <a href=\"#aria.decal.show\">aria.decal.show</a> are both set to be <code class=\"codespan\">true</code>.</p>\n<p>If it is set to be <code class=\"codespan\">&#39;none&#39;</code>, no decal will be used.</p>\n<p>It works only if <code class=\"codespan\">areaStyle</code> is set.</p>\n"
-  },
-  "data.select.itemStyle.decal(Object | 'none').symbol(string|string[]) = 'rect'": {
-    "desc": "<p>The symbol type of the decal. If it is in the type of <code class=\"codespan\">string[]</code>, it means the symbols are used one by one.</p>\n<p>Icon types provided by ECharts includes</p>\n<p><code class=\"codespan\">&#39;circle&#39;</code>, <code class=\"codespan\">&#39;rect&#39;</code>, <code class=\"codespan\">&#39;roundRect&#39;</code>, <code class=\"codespan\">&#39;triangle&#39;</code>, <code class=\"codespan\">&#39;diamond&#39;</code>, <code class=\"codespan\">&#3 [...]
-  },
-  "data.select.itemStyle.decal(Object | 'none').symbolSize": {
-    "desc": "<p>Range of values: <code class=\"codespan\">0</code> to <code class=\"codespan\">1</code>, representing the size of symbol relative to decal.</p>\n"
-  },
-  "data.select.itemStyle.decal(Object | 'none').symbolKeepAspect": {
-    "desc": "<p>Whether or not to keep the aspect ratio of the pattern.</p>\n"
-  },
-  "data.select.itemStyle.decal(Object | 'none').color": {
-    "desc": "<p>For the color of the decal pattern, it is recommended to use a translucent color, which can be superimposed on the color of the series itself.</p>\n"
-  },
-  "data.select.itemStyle.decal(Object | 'none').backgroundColor": {
-    "desc": "<p>The background color of the decal will be over the color of the series itself, under the decal pattern.</p>\n"
-  },
-  "data.select.itemStyle.decal(Object | 'none').dashArrayX(number | number[] | (number | number[])[]) = 5": {
-    "desc": "<p>The basic pattern of the decal pattern is an infinite loop in the form of <code class=\"codespan\">Pattern - Blank - Pattern - Blank - Pattern - Blank</code> both horizontally and vertically, respectively. By setting the length of each pattern and blank, complex pattern effects can be achieved.</p>\n<p><code class=\"codespan\">dashArrayX</code> controls the horizontal pattern pattern. When its value is of type <code class=\"codespan\">number</code> or <code class=\"codesp [...]
-  },
-  "data.select.itemStyle.decal(Object | 'none').dashArrayY(number | number[]) = 5": {
-    "desc": "<p>The basic pattern of the decal pattern is an infinite loop in the form of <code class=\"codespan\">Pattern - Blank - Pattern - Blank - Pattern - Blank</code> both horizontally and vertically, respectively. By setting the length of each pattern and blank, complex pattern effects can be achieved.</p>\n<p><code class=\"codespan\">dashArrayY</code> controls the horizontal pattern pattern. Similar to <a href=\"https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-d [...]
-  },
-  "data.select.itemStyle.decal(Object | 'none').rotation": {
-    "desc": "<p>The overall rotation angle (in radians) of the pattern, in the range from `-Math.</p>\n"
-  },
-  "data.select.itemStyle.decal(Object | 'none').maxTileWidth": {
-    "desc": "<p>The upper limit of the width of the generated pattern before it is duplicated. Usually this value is not necessary, but you can try to increase it if you notice discontinuous seams in the pattern when it repeats.</p>\n"
-  },
-  "data.select.itemStyle.decal(Object | 'none').maxTileHeight": {
-    "desc": "<p>The upper limit of the height of the generated pattern before it repeats. This value is usually not necessary to set, but you can try to increase it if you find that the pattern has discontinuous seams when it is repeated.</p>\n"
-  },
   "data.tooltip": {
     "desc": "<p>tooltip settings in this series data.</p>\n"
   },
@@ -733,7 +733,7 @@
     "desc": "<blockquote>\n<p><strong>Notice:</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The position of the tooltip&#39;s floating layer, which would follow the position of mouse by default.</p>\n<p>Options:</p>\n<ul>\n<li><p><code class=\"codespan\">Array</code></p>\n<p>  Display the position of tooltip&#39;s floating layer through array, which supports absolu [...]
   },
   "data.tooltip.formatter": {
-    "desc": "<blockquote>\n<p><strong>Notice:</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The content formatter of tooltip&#39;s floating layer which supports string template and callback function.</p>\n<p><strong>1. String template</strong></p>\n<p>The template variables are <code class=\"codespan\">{a}</code>, <code class=\"codespan\">{b}</code>, <code class=\" [...]
+    "desc": "<blockquote>\n<p><strong>Notice:</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The content formatter of tooltip&#39;s floating layer which supports string template and callback function.</p>\n<p><strong>1. String template</strong></p>\n<p>The template variables are <code class=\"codespan\">{a}</code>, <code class=\"codespan\">{b}</code>, <code class=\" [...]
   },
   "data.tooltip.backgroundColor": {
     "desc": "<blockquote>\n<p><strong>Notice:</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The background color of tooltip&#39;s floating layer.</p>\n"
@@ -817,9 +817,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -829,7 +829,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -890,7 +890,10 @@
     "desc": "<p>Determine how to display the text when it&#39;s overflow on height.</p>\n<ul>\n<li><code class=\"codespan\">&#39;truncate&#39;</code> Truncate the overflow lines.</li>\n</ul>\n"
   },
   "data.tooltip.extraCssText": {
-    "desc": "<blockquote>\n<p><strong>Notice:</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>Extra CSS style for floating layer. The following is an example for adding shadow.</p>\n<pre><code class=\"lang-js\">extraCssText: &#39;box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);&#39;\n</code></pre>\n"
+    "desc": "\n\n\n\n\n<blockquote>\n<p><strong>Notice:</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>Extra CSS style for floating layer. The following is an example for adding shadow.</p>\n<pre><code class=\"lang-js\">extraCssText: &#39;box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);&#39;\n</code></pre>\n",
+    "uiControl": {
+      "type": "text"
+    }
   },
   "markPoint": {
     "desc": "<p>Mark point in a chart.</p>\n"
@@ -985,7 +988,7 @@
     }
   },
   "markPoint.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markPoint.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -1120,9 +1123,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1132,7 +1135,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1493,7 +1496,7 @@
     }
   },
   "markPoint.emphasis.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markPoint.emphasis.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -1628,9 +1631,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1640,7 +1643,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1998,7 +2001,7 @@
     }
   },
   "markPoint.blur.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markPoint.blur.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -2133,9 +2136,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -2145,7 +2148,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -2789,9 +2792,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -2801,7 +2804,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -3217,9 +3220,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -3229,7 +3232,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -3623,7 +3626,7 @@
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -3744,9 +3747,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -3756,7 +3759,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -4088,7 +4091,7 @@
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.emphasis.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.emphasis.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -4209,9 +4212,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -4221,7 +4224,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -4540,7 +4543,7 @@
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.blur.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.blur.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -4661,9 +4664,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -4673,7 +4676,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -5156,7 +5159,7 @@
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.data.0.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.data.0.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -5277,9 +5280,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -5289,7 +5292,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -5615,7 +5618,7 @@
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.data.0.emphasis.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.data.0.emphasis.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -5736,9 +5739,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -5748,7 +5751,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -6077,7 +6080,7 @@
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.data.0.blur.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.data.0.blur.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -6198,9 +6201,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -6210,7 +6213,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -6625,7 +6628,7 @@
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.data.1.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.data.1.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -6746,9 +6749,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -6758,7 +6761,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -7084,7 +7087,7 @@
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.data.1.emphasis.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.data.1.emphasis.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -7205,9 +7208,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -7217,7 +7220,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -7546,7 +7549,7 @@
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.data.1.blur.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.data.1.blur.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -7667,9 +7670,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -7679,7 +7682,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -8158,9 +8161,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -8170,7 +8173,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -8663,9 +8666,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -8675,7 +8678,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -9165,9 +9168,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -9177,7 +9180,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -9789,9 +9792,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -9801,7 +9804,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -10288,9 +10291,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -10300,7 +10303,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -10790,9 +10793,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -10802,7 +10805,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -11340,9 +11343,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -11352,7 +11355,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -11839,9 +11842,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -11851,7 +11854,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -12341,9 +12344,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -12353,7 +12356,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -12685,7 +12688,7 @@
     "desc": "<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The position of the tooltip&#39;s floating layer, which would follow the position of mouse by default.</p>\n<p>Options:</p>\n<ul>\n<li><p><code class=\"codespan\">Array</code></p>\n<p>  Display the position of tooltip&#39;s floating layer through array, which support [...]
   },
   "tooltip.formatter": {
-    "desc": "<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The content formatter of tooltip&#39;s floating layer which supports string template and callback function.</p>\n<p><strong>1. String template</strong></p>\n<p>The template variables are <code class=\"codespan\">{a}</code>, <code class=\"codespan\">{b}</code>, <code  [...]
+    "desc": "<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The content formatter of tooltip&#39;s floating layer which supports string template and callback function.</p>\n<p><strong>1. String template</strong></p>\n<p>The template variables are <code class=\"codespan\">{a}</code>, <code class=\"codespan\">{b}</code>, <code  [...]
   },
   "tooltip.backgroundColor": {
     "desc": "<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The background color of tooltip&#39;s floating layer.</p>\n"
@@ -12769,9 +12772,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -12781,7 +12784,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -12842,6 +12845,9 @@
     "desc": "<p>Determine how to display the text when it&#39;s overflow on height.</p>\n<ul>\n<li><code class=\"codespan\">&#39;truncate&#39;</code> Truncate the overflow lines.</li>\n</ul>\n"
   },
   "tooltip.extraCssText": {
-    "desc": "<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>Extra CSS style for floating layer. The following is an example for adding shadow.</p>\n<pre><code class=\"lang-js\">extraCssText: &#39;box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);&#39;\n</code></pre>\n"
+    "desc": "\n\n\n\n\n<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>Extra CSS style for floating layer. The following is an example for adding shadow.</p>\n<pre><code class=\"lang-js\">extraCssText: &#39;box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);&#39;\n</code></pre>\n",
+    "uiControl": {
+      "type": "text"
+    }
   }
 }
\ No newline at end of file
diff --git a/en/documents/option-parts/option.series-candlestick.js b/en/documents/option-parts/option.series-candlestick.js
index a6b19b2..39606a7 100644
--- a/en/documents/option-parts/option.series-candlestick.js
+++ b/en/documents/option-parts/option.series-candlestick.js
@@ -727,7 +727,7 @@ window.__EC_DOC_option_series_candlestick = {
     "desc": "<blockquote>\n<p><strong>Notice:</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The position of the tooltip&#39;s floating layer, which would follow the position of mouse by default.</p>\n<p>Options:</p>\n<ul>\n<li><p><code class=\"codespan\">Array</code></p>\n<p>  Display the position of tooltip&#39;s floating layer through array, which supports absolu [...]
   },
   "data.tooltip.formatter": {
-    "desc": "<blockquote>\n<p><strong>Notice:</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The content formatter of tooltip&#39;s floating layer which supports string template and callback function.</p>\n<p><strong>1. String template</strong></p>\n<p>The template variables are <code class=\"codespan\">{a}</code>, <code class=\"codespan\">{b}</code>, <code class=\" [...]
+    "desc": "<blockquote>\n<p><strong>Notice:</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The content formatter of tooltip&#39;s floating layer which supports string template and callback function.</p>\n<p><strong>1. String template</strong></p>\n<p>The template variables are <code class=\"codespan\">{a}</code>, <code class=\"codespan\">{b}</code>, <code class=\" [...]
   },
   "data.tooltip.backgroundColor": {
     "desc": "<blockquote>\n<p><strong>Notice:</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The background color of tooltip&#39;s floating layer.</p>\n"
@@ -811,9 +811,9 @@ window.__EC_DOC_option_series_candlestick = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -823,7 +823,7 @@ window.__EC_DOC_option_series_candlestick = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -884,7 +884,10 @@ window.__EC_DOC_option_series_candlestick = {
     "desc": "<p>Determine how to display the text when it&#39;s overflow on height.</p>\n<ul>\n<li><code class=\"codespan\">&#39;truncate&#39;</code> Truncate the overflow lines.</li>\n</ul>\n"
   },
   "data.tooltip.extraCssText": {
-    "desc": "<blockquote>\n<p><strong>Notice:</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>Extra CSS style for floating layer. The following is an example for adding shadow.</p>\n<pre><code class=\"lang-js\">extraCssText: &#39;box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);&#39;\n</code></pre>\n"
+    "desc": "\n\n\n\n\n<blockquote>\n<p><strong>Notice:</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>Extra CSS style for floating layer. The following is an example for adding shadow.</p>\n<pre><code class=\"lang-js\">extraCssText: &#39;box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);&#39;\n</code></pre>\n",
+    "uiControl": {
+      "type": "text"
+    }
   },
   "markPoint": {
     "desc": "<p>Mark point in a chart.</p>\n"
@@ -979,7 +982,7 @@ window.__EC_DOC_option_series_candlestick = {
     }
   },
   "markPoint.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markPoint.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -1114,9 +1117,9 @@ window.__EC_DOC_option_series_candlestick = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1126,7 +1129,7 @@ window.__EC_DOC_option_series_candlestick = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1487,7 +1490,7 @@ window.__EC_DOC_option_series_candlestick = {
     }
   },
   "markPoint.emphasis.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markPoint.emphasis.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -1622,9 +1625,9 @@ window.__EC_DOC_option_series_candlestick = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1634,7 +1637,7 @@ window.__EC_DOC_option_series_candlestick = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1992,7 +1995,7 @@ window.__EC_DOC_option_series_candlestick = {
     }
   },
   "markPoint.blur.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markPoint.blur.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -2127,9 +2130,9 @@ window.__EC_DOC_option_series_candlestick = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -2139,7 +2142,7 @@ window.__EC_DOC_option_series_candlestick = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -2783,9 +2786,9 @@ window.__EC_DOC_option_series_candlestick = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -2795,7 +2798,7 @@ window.__EC_DOC_option_series_candlestick = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -3211,9 +3214,9 @@ window.__EC_DOC_option_series_candlestick = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -3223,7 +3226,7 @@ window.__EC_DOC_option_series_candlestick = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -3617,7 +3620,7 @@ window.__EC_DOC_option_series_candlestick = {
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -3738,9 +3741,9 @@ window.__EC_DOC_option_series_candlestick = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -3750,7 +3753,7 @@ window.__EC_DOC_option_series_candlestick = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -4082,7 +4085,7 @@ window.__EC_DOC_option_series_candlestick = {
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.emphasis.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.emphasis.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -4203,9 +4206,9 @@ window.__EC_DOC_option_series_candlestick = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -4215,7 +4218,7 @@ window.__EC_DOC_option_series_candlestick = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -4534,7 +4537,7 @@ window.__EC_DOC_option_series_candlestick = {
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.blur.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.blur.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -4655,9 +4658,9 @@ window.__EC_DOC_option_series_candlestick = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -4667,7 +4670,7 @@ window.__EC_DOC_option_series_candlestick = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -5150,7 +5153,7 @@ window.__EC_DOC_option_series_candlestick = {
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.data.0.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.data.0.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -5271,9 +5274,9 @@ window.__EC_DOC_option_series_candlestick = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -5283,7 +5286,7 @@ window.__EC_DOC_option_series_candlestick = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -5609,7 +5612,7 @@ window.__EC_DOC_option_series_candlestick = {
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.data.0.emphasis.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.data.0.emphasis.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -5730,9 +5733,9 @@ window.__EC_DOC_option_series_candlestick = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -5742,7 +5745,7 @@ window.__EC_DOC_option_series_candlestick = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -6071,7 +6074,7 @@ window.__EC_DOC_option_series_candlestick = {
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.data.0.blur.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.data.0.blur.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -6192,9 +6195,9 @@ window.__EC_DOC_option_series_candlestick = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -6204,7 +6207,7 @@ window.__EC_DOC_option_series_candlestick = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -6619,7 +6622,7 @@ window.__EC_DOC_option_series_candlestick = {
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.data.1.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.data.1.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -6740,9 +6743,9 @@ window.__EC_DOC_option_series_candlestick = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -6752,7 +6755,7 @@ window.__EC_DOC_option_series_candlestick = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -7078,7 +7081,7 @@ window.__EC_DOC_option_series_candlestick = {
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.data.1.emphasis.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.data.1.emphasis.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -7199,9 +7202,9 @@ window.__EC_DOC_option_series_candlestick = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -7211,7 +7214,7 @@ window.__EC_DOC_option_series_candlestick = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -7540,7 +7543,7 @@ window.__EC_DOC_option_series_candlestick = {
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.data.1.blur.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.data.1.blur.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -7661,9 +7664,9 @@ window.__EC_DOC_option_series_candlestick = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -7673,7 +7676,7 @@ window.__EC_DOC_option_series_candlestick = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -8152,9 +8155,9 @@ window.__EC_DOC_option_series_candlestick = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -8164,7 +8167,7 @@ window.__EC_DOC_option_series_candlestick = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -8657,9 +8660,9 @@ window.__EC_DOC_option_series_candlestick = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -8669,7 +8672,7 @@ window.__EC_DOC_option_series_candlestick = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -9159,9 +9162,9 @@ window.__EC_DOC_option_series_candlestick = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -9171,7 +9174,7 @@ window.__EC_DOC_option_series_candlestick = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -9783,9 +9786,9 @@ window.__EC_DOC_option_series_candlestick = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -9795,7 +9798,7 @@ window.__EC_DOC_option_series_candlestick = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -10282,9 +10285,9 @@ window.__EC_DOC_option_series_candlestick = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -10294,7 +10297,7 @@ window.__EC_DOC_option_series_candlestick = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -10784,9 +10787,9 @@ window.__EC_DOC_option_series_candlestick = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -10796,7 +10799,7 @@ window.__EC_DOC_option_series_candlestick = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -11334,9 +11337,9 @@ window.__EC_DOC_option_series_candlestick = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -11346,7 +11349,7 @@ window.__EC_DOC_option_series_candlestick = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -11833,9 +11836,9 @@ window.__EC_DOC_option_series_candlestick = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -11845,7 +11848,7 @@ window.__EC_DOC_option_series_candlestick = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -12335,9 +12338,9 @@ window.__EC_DOC_option_series_candlestick = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -12347,7 +12350,7 @@ window.__EC_DOC_option_series_candlestick = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -12686,7 +12689,7 @@ window.__EC_DOC_option_series_candlestick = {
     "desc": "<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The position of the tooltip&#39;s floating layer, which would follow the position of mouse by default.</p>\n<p>Options:</p>\n<ul>\n<li><p><code class=\"codespan\">Array</code></p>\n<p>  Display the position of tooltip&#39;s floating layer through array, which support [...]
   },
   "tooltip.formatter": {
-    "desc": "<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The content formatter of tooltip&#39;s floating layer which supports string template and callback function.</p>\n<p><strong>1. String template</strong></p>\n<p>The template variables are <code class=\"codespan\">{a}</code>, <code class=\"codespan\">{b}</code>, <code  [...]
+    "desc": "<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The content formatter of tooltip&#39;s floating layer which supports string template and callback function.</p>\n<p><strong>1. String template</strong></p>\n<p>The template variables are <code class=\"codespan\">{a}</code>, <code class=\"codespan\">{b}</code>, <code  [...]
   },
   "tooltip.backgroundColor": {
     "desc": "<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The background color of tooltip&#39;s floating layer.</p>\n"
@@ -12770,9 +12773,9 @@ window.__EC_DOC_option_series_candlestick = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -12782,7 +12785,7 @@ window.__EC_DOC_option_series_candlestick = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -12843,6 +12846,9 @@ window.__EC_DOC_option_series_candlestick = {
     "desc": "<p>Determine how to display the text when it&#39;s overflow on height.</p>\n<ul>\n<li><code class=\"codespan\">&#39;truncate&#39;</code> Truncate the overflow lines.</li>\n</ul>\n"
   },
   "tooltip.extraCssText": {
-    "desc": "<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>Extra CSS style for floating layer. The following is an example for adding shadow.</p>\n<pre><code class=\"lang-js\">extraCssText: &#39;box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);&#39;\n</code></pre>\n"
+    "desc": "\n\n\n\n\n<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>Extra CSS style for floating layer. The following is an example for adding shadow.</p>\n<pre><code class=\"lang-js\">extraCssText: &#39;box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);&#39;\n</code></pre>\n",
+    "uiControl": {
+      "type": "text"
+    }
   }
 }
\ No newline at end of file
diff --git a/en/documents/option-parts/option.series-candlestick.json b/en/documents/option-parts/option.series-candlestick.json
index ffd2847..66789fa 100644
--- a/en/documents/option-parts/option.series-candlestick.json
+++ b/en/documents/option-parts/option.series-candlestick.json
@@ -727,7 +727,7 @@
     "desc": "<blockquote>\n<p><strong>Notice:</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The position of the tooltip&#39;s floating layer, which would follow the position of mouse by default.</p>\n<p>Options:</p>\n<ul>\n<li><p><code class=\"codespan\">Array</code></p>\n<p>  Display the position of tooltip&#39;s floating layer through array, which supports absolu [...]
   },
   "data.tooltip.formatter": {
-    "desc": "<blockquote>\n<p><strong>Notice:</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The content formatter of tooltip&#39;s floating layer which supports string template and callback function.</p>\n<p><strong>1. String template</strong></p>\n<p>The template variables are <code class=\"codespan\">{a}</code>, <code class=\"codespan\">{b}</code>, <code class=\" [...]
+    "desc": "<blockquote>\n<p><strong>Notice:</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The content formatter of tooltip&#39;s floating layer which supports string template and callback function.</p>\n<p><strong>1. String template</strong></p>\n<p>The template variables are <code class=\"codespan\">{a}</code>, <code class=\"codespan\">{b}</code>, <code class=\" [...]
   },
   "data.tooltip.backgroundColor": {
     "desc": "<blockquote>\n<p><strong>Notice:</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The background color of tooltip&#39;s floating layer.</p>\n"
@@ -811,9 +811,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -823,7 +823,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -884,7 +884,10 @@
     "desc": "<p>Determine how to display the text when it&#39;s overflow on height.</p>\n<ul>\n<li><code class=\"codespan\">&#39;truncate&#39;</code> Truncate the overflow lines.</li>\n</ul>\n"
   },
   "data.tooltip.extraCssText": {
-    "desc": "<blockquote>\n<p><strong>Notice:</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>Extra CSS style for floating layer. The following is an example for adding shadow.</p>\n<pre><code class=\"lang-js\">extraCssText: &#39;box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);&#39;\n</code></pre>\n"
+    "desc": "\n\n\n\n\n<blockquote>\n<p><strong>Notice:</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>Extra CSS style for floating layer. The following is an example for adding shadow.</p>\n<pre><code class=\"lang-js\">extraCssText: &#39;box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);&#39;\n</code></pre>\n",
+    "uiControl": {
+      "type": "text"
+    }
   },
   "markPoint": {
     "desc": "<p>Mark point in a chart.</p>\n"
@@ -979,7 +982,7 @@
     }
   },
   "markPoint.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markPoint.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -1114,9 +1117,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1126,7 +1129,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1487,7 +1490,7 @@
     }
   },
   "markPoint.emphasis.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markPoint.emphasis.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -1622,9 +1625,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1634,7 +1637,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1992,7 +1995,7 @@
     }
   },
   "markPoint.blur.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markPoint.blur.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -2127,9 +2130,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -2139,7 +2142,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -2783,9 +2786,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -2795,7 +2798,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -3211,9 +3214,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -3223,7 +3226,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -3617,7 +3620,7 @@
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -3738,9 +3741,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -3750,7 +3753,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -4082,7 +4085,7 @@
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.emphasis.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.emphasis.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -4203,9 +4206,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -4215,7 +4218,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -4534,7 +4537,7 @@
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.blur.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.blur.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -4655,9 +4658,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -4667,7 +4670,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -5150,7 +5153,7 @@
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.data.0.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.data.0.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -5271,9 +5274,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -5283,7 +5286,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -5609,7 +5612,7 @@
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.data.0.emphasis.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.data.0.emphasis.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -5730,9 +5733,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -5742,7 +5745,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -6071,7 +6074,7 @@
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.data.0.blur.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.data.0.blur.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -6192,9 +6195,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -6204,7 +6207,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -6619,7 +6622,7 @@
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.data.1.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.data.1.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -6740,9 +6743,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -6752,7 +6755,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -7078,7 +7081,7 @@
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.data.1.emphasis.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.data.1.emphasis.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -7199,9 +7202,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -7211,7 +7214,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -7540,7 +7543,7 @@
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.data.1.blur.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.data.1.blur.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -7661,9 +7664,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -7673,7 +7676,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -8152,9 +8155,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -8164,7 +8167,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -8657,9 +8660,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -8669,7 +8672,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -9159,9 +9162,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -9171,7 +9174,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -9783,9 +9786,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -9795,7 +9798,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -10282,9 +10285,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -10294,7 +10297,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -10784,9 +10787,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -10796,7 +10799,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -11334,9 +11337,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -11346,7 +11349,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -11833,9 +11836,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -11845,7 +11848,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -12335,9 +12338,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -12347,7 +12350,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -12686,7 +12689,7 @@
     "desc": "<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The position of the tooltip&#39;s floating layer, which would follow the position of mouse by default.</p>\n<p>Options:</p>\n<ul>\n<li><p><code class=\"codespan\">Array</code></p>\n<p>  Display the position of tooltip&#39;s floating layer through array, which support [...]
   },
   "tooltip.formatter": {
-    "desc": "<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The content formatter of tooltip&#39;s floating layer which supports string template and callback function.</p>\n<p><strong>1. String template</strong></p>\n<p>The template variables are <code class=\"codespan\">{a}</code>, <code class=\"codespan\">{b}</code>, <code  [...]
+    "desc": "<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The content formatter of tooltip&#39;s floating layer which supports string template and callback function.</p>\n<p><strong>1. String template</strong></p>\n<p>The template variables are <code class=\"codespan\">{a}</code>, <code class=\"codespan\">{b}</code>, <code  [...]
   },
   "tooltip.backgroundColor": {
     "desc": "<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The background color of tooltip&#39;s floating layer.</p>\n"
@@ -12770,9 +12773,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -12782,7 +12785,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -12843,6 +12846,9 @@
     "desc": "<p>Determine how to display the text when it&#39;s overflow on height.</p>\n<ul>\n<li><code class=\"codespan\">&#39;truncate&#39;</code> Truncate the overflow lines.</li>\n</ul>\n"
   },
   "tooltip.extraCssText": {
-    "desc": "<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>Extra CSS style for floating layer. The following is an example for adding shadow.</p>\n<pre><code class=\"lang-js\">extraCssText: &#39;box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);&#39;\n</code></pre>\n"
+    "desc": "\n\n\n\n\n<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>Extra CSS style for floating layer. The following is an example for adding shadow.</p>\n<pre><code class=\"lang-js\">extraCssText: &#39;box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);&#39;\n</code></pre>\n",
+    "uiControl": {
+      "type": "text"
+    }
   }
 }
\ No newline at end of file
diff --git a/en/documents/option-parts/option.series-custom.js b/en/documents/option-parts/option.series-custom.js
index 573fa09..dc34ae7 100644
--- a/en/documents/option-parts/option.series-custom.js
+++ b/en/documents/option-parts/option.series-custom.js
@@ -135,6 +135,45 @@ window.__EC_DOC_option_series_custom = {
   "renderItem.return_group.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "renderItem.return_group.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#series-custom.renderItem.return_text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "renderItem.return_group.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "renderItem.return_group.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "renderItem.return_group.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "renderItem.return_group.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "renderItem.return_group.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "renderItem.return_group.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "renderItem.return_group.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "renderItem.return_group.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "renderItem.return_group.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "renderItem.return_group.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "renderItem.return_group.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "renderItem.return_group.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "renderItem.return_group.during": {
     "desc": "<p><code class=\"codespan\">during</code> callback enable users to set props to an element in each animation frame.</p>\n<pre><code class=\"lang-js\">(duringAPI: CustomDuringAPI) =&gt; void\n\ninterface CustomDuringAPI {\n    // Set transform prop value.\n    // Transform prop see `TransformProp`.\n    setTransform(key: TransformProp, val: unknown): void;\n    // Get transform prop value of the current animation frame.\n    getTransform(key: TransformProp): unknown;\n    //  [...]
   },
@@ -210,6 +249,45 @@ window.__EC_DOC_option_series_custom = {
   "renderItem.return_path.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "renderItem.return_path.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#series-custom.renderItem.return_text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "renderItem.return_path.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "renderItem.return_path.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "renderItem.return_path.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "renderItem.return_path.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "renderItem.return_path.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "renderItem.return_path.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "renderItem.return_path.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "renderItem.return_path.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "renderItem.return_path.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "renderItem.return_path.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "renderItem.return_path.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "renderItem.return_path.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "renderItem.return_path.during": {
     "desc": "<p><code class=\"codespan\">during</code> callback enable users to set props to an element in each animation frame.</p>\n<pre><code class=\"lang-js\">(duringAPI: CustomDuringAPI) =&gt; void\n\ninterface CustomDuringAPI {\n    // Set transform prop value.\n    // Transform prop see `TransformProp`.\n    setTransform(key: TransformProp, val: unknown): void;\n    // Get transform prop value of the current animation frame.\n    getTransform(key: TransformProp): unknown;\n    //  [...]
   },
@@ -270,15 +348,15 @@ window.__EC_DOC_option_series_custom = {
   "renderItem.return_path.style.transition": {
     "desc": "<p>Can be a single property name or an array of property names.\nEnable transition animation when the specified properties changed.\nCan only specify properties that are under this <code class=\"codespan\">style</code>.</p>\n<p>For example:</p>\n<pre><code class=\"lang-js\">renderItem: function (params, api) {\n    return {\n        type: &#39;xxx&#39;,\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n             [...]
   },
-  "renderItem.return_path.emphasis": {
-    "desc": "<p>Emphasis state of the element.</p>\n"
-  },
-  "renderItem.return_path.emphasis.focus": {
+  "renderItem.return_path.focus": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
   },
-  "renderItem.return_path.emphasis.blurScope": {
+  "renderItem.return_path.blurScope": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
   },
+  "renderItem.return_path.emphasis": {
+    "desc": "<p>Emphasis state of the element.</p>\n"
+  },
   "renderItem.return_path.emphasis.style": {
     "desc": "<p>Same to <a href=\"#series-custom.renderItem.return_polygon.style\">style</a>.</p>\n"
   },
@@ -342,6 +420,45 @@ window.__EC_DOC_option_series_custom = {
   "renderItem.return_image.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "renderItem.return_image.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#series-custom.renderItem.return_text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "renderItem.return_image.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "renderItem.return_image.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "renderItem.return_image.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "renderItem.return_image.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "renderItem.return_image.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "renderItem.return_image.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "renderItem.return_image.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "renderItem.return_image.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "renderItem.return_image.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "renderItem.return_image.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "renderItem.return_image.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "renderItem.return_image.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "renderItem.return_image.during": {
     "desc": "<p><code class=\"codespan\">during</code> callback enable users to set props to an element in each animation frame.</p>\n<pre><code class=\"lang-js\">(duringAPI: CustomDuringAPI) =&gt; void\n\ninterface CustomDuringAPI {\n    // Set transform prop value.\n    // Transform prop see `TransformProp`.\n    setTransform(key: TransformProp, val: unknown): void;\n    // Get transform prop value of the current animation frame.\n    getTransform(key: TransformProp): unknown;\n    //  [...]
   },
@@ -390,15 +507,15 @@ window.__EC_DOC_option_series_custom = {
   "renderItem.return_image.style.transition": {
     "desc": "<p>Can be a single property name or an array of property names.\nEnable transition animation when the specified properties changed.\nCan only specify properties that are under this <code class=\"codespan\">style</code>.</p>\n<p>For example:</p>\n<pre><code class=\"lang-js\">renderItem: function (params, api) {\n    return {\n        type: &#39;xxx&#39;,\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n             [...]
   },
-  "renderItem.return_image.emphasis": {
-    "desc": "<p>Emphasis state of the element.</p>\n"
-  },
-  "renderItem.return_image.emphasis.focus": {
+  "renderItem.return_image.focus": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
   },
-  "renderItem.return_image.emphasis.blurScope": {
+  "renderItem.return_image.blurScope": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
   },
+  "renderItem.return_image.emphasis": {
+    "desc": "<p>Emphasis state of the element.</p>\n"
+  },
   "renderItem.return_image.emphasis.style": {
     "desc": "<p>Same to <a href=\"#series-custom.renderItem.return_polygon.style\">style</a>.</p>\n"
   },
@@ -465,6 +582,45 @@ window.__EC_DOC_option_series_custom = {
   "renderItem.return_text.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "renderItem.return_text.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#series-custom.renderItem.return_text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "renderItem.return_text.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "renderItem.return_text.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "renderItem.return_text.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "renderItem.return_text.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "renderItem.return_text.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "renderItem.return_text.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "renderItem.return_text.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "renderItem.return_text.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "renderItem.return_text.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "renderItem.return_text.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "renderItem.return_text.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "renderItem.return_text.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "renderItem.return_text.during": {
     "desc": "<p><code class=\"codespan\">during</code> callback enable users to set props to an element in each animation frame.</p>\n<pre><code class=\"lang-js\">(duringAPI: CustomDuringAPI) =&gt; void\n\ninterface CustomDuringAPI {\n    // Set transform prop value.\n    // Transform prop see `TransformProp`.\n    setTransform(key: TransformProp, val: unknown): void;\n    // Get transform prop value of the current animation frame.\n    getTransform(key: TransformProp): unknown;\n    //  [...]
   },
@@ -516,15 +672,15 @@ window.__EC_DOC_option_series_custom = {
   "renderItem.return_text.style.transition": {
     "desc": "<p>Can be a single property name or an array of property names.\nEnable transition animation when the specified properties changed.\nCan only specify properties that are under this <code class=\"codespan\">style</code>.</p>\n<p>For example:</p>\n<pre><code class=\"lang-js\">renderItem: function (params, api) {\n    return {\n        type: &#39;xxx&#39;,\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n             [...]
   },
-  "renderItem.return_text.emphasis": {
-    "desc": "<p>Emphasis state of the element.</p>\n"
-  },
-  "renderItem.return_text.emphasis.focus": {
+  "renderItem.return_text.focus": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
   },
-  "renderItem.return_text.emphasis.blurScope": {
+  "renderItem.return_text.blurScope": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
   },
+  "renderItem.return_text.emphasis": {
+    "desc": "<p>Emphasis state of the element.</p>\n"
+  },
   "renderItem.return_text.emphasis.style": {
     "desc": "<p>Same to <a href=\"#series-custom.renderItem.return_polygon.style\">style</a>.</p>\n"
   },
@@ -594,6 +750,45 @@ window.__EC_DOC_option_series_custom = {
   "renderItem.return_rect.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "renderItem.return_rect.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#series-custom.renderItem.return_text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "renderItem.return_rect.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "renderItem.return_rect.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "renderItem.return_rect.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "renderItem.return_rect.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "renderItem.return_rect.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "renderItem.return_rect.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "renderItem.return_rect.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "renderItem.return_rect.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "renderItem.return_rect.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "renderItem.return_rect.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "renderItem.return_rect.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "renderItem.return_rect.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "renderItem.return_rect.during": {
     "desc": "<p><code class=\"codespan\">during</code> callback enable users to set props to an element in each animation frame.</p>\n<pre><code class=\"lang-js\">(duringAPI: CustomDuringAPI) =&gt; void\n\ninterface CustomDuringAPI {\n    // Set transform prop value.\n    // Transform prop see `TransformProp`.\n    setTransform(key: TransformProp, val: unknown): void;\n    // Get transform prop value of the current animation frame.\n    getTransform(key: TransformProp): unknown;\n    //  [...]
   },
@@ -648,15 +843,15 @@ window.__EC_DOC_option_series_custom = {
   "renderItem.return_rect.style.transition": {
     "desc": "<p>Can be a single property name or an array of property names.\nEnable transition animation when the specified properties changed.\nCan only specify properties that are under this <code class=\"codespan\">style</code>.</p>\n<p>For example:</p>\n<pre><code class=\"lang-js\">renderItem: function (params, api) {\n    return {\n        type: &#39;xxx&#39;,\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n             [...]
   },
-  "renderItem.return_rect.emphasis": {
-    "desc": "<p>Emphasis state of the element.</p>\n"
-  },
-  "renderItem.return_rect.emphasis.focus": {
+  "renderItem.return_rect.focus": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
   },
-  "renderItem.return_rect.emphasis.blurScope": {
+  "renderItem.return_rect.blurScope": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
   },
+  "renderItem.return_rect.emphasis": {
+    "desc": "<p>Emphasis state of the element.</p>\n"
+  },
   "renderItem.return_rect.emphasis.style": {
     "desc": "<p>Same to <a href=\"#series-custom.renderItem.return_polygon.style\">style</a>.</p>\n"
   },
@@ -726,6 +921,45 @@ window.__EC_DOC_option_series_custom = {
   "renderItem.return_circle.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "renderItem.return_circle.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#series-custom.renderItem.return_text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "renderItem.return_circle.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "renderItem.return_circle.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "renderItem.return_circle.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "renderItem.return_circle.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "renderItem.return_circle.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "renderItem.return_circle.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "renderItem.return_circle.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "renderItem.return_circle.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "renderItem.return_circle.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "renderItem.return_circle.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "renderItem.return_circle.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "renderItem.return_circle.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "renderItem.return_circle.during": {
     "desc": "<p><code class=\"codespan\">during</code> callback enable users to set props to an element in each animation frame.</p>\n<pre><code class=\"lang-js\">(duringAPI: CustomDuringAPI) =&gt; void\n\ninterface CustomDuringAPI {\n    // Set transform prop value.\n    // Transform prop see `TransformProp`.\n    setTransform(key: TransformProp, val: unknown): void;\n    // Get transform prop value of the current animation frame.\n    getTransform(key: TransformProp): unknown;\n    //  [...]
   },
@@ -774,15 +1008,15 @@ window.__EC_DOC_option_series_custom = {
   "renderItem.return_circle.style.transition": {
     "desc": "<p>Can be a single property name or an array of property names.\nEnable transition animation when the specified properties changed.\nCan only specify properties that are under this <code class=\"codespan\">style</code>.</p>\n<p>For example:</p>\n<pre><code class=\"lang-js\">renderItem: function (params, api) {\n    return {\n        type: &#39;xxx&#39;,\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n             [...]
   },
-  "renderItem.return_circle.emphasis": {
-    "desc": "<p>Emphasis state of the element.</p>\n"
-  },
-  "renderItem.return_circle.emphasis.focus": {
+  "renderItem.return_circle.focus": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
   },
-  "renderItem.return_circle.emphasis.blurScope": {
+  "renderItem.return_circle.blurScope": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
   },
+  "renderItem.return_circle.emphasis": {
+    "desc": "<p>Emphasis state of the element.</p>\n"
+  },
   "renderItem.return_circle.emphasis.style": {
     "desc": "<p>Same to <a href=\"#series-custom.renderItem.return_polygon.style\">style</a>.</p>\n"
   },
@@ -852,6 +1086,45 @@ window.__EC_DOC_option_series_custom = {
   "renderItem.return_ring.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "renderItem.return_ring.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#series-custom.renderItem.return_text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "renderItem.return_ring.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "renderItem.return_ring.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "renderItem.return_ring.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "renderItem.return_ring.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "renderItem.return_ring.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "renderItem.return_ring.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "renderItem.return_ring.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "renderItem.return_ring.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "renderItem.return_ring.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "renderItem.return_ring.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "renderItem.return_ring.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "renderItem.return_ring.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "renderItem.return_ring.during": {
     "desc": "<p><code class=\"codespan\">during</code> callback enable users to set props to an element in each animation frame.</p>\n<pre><code class=\"lang-js\">(duringAPI: CustomDuringAPI) =&gt; void\n\ninterface CustomDuringAPI {\n    // Set transform prop value.\n    // Transform prop see `TransformProp`.\n    setTransform(key: TransformProp, val: unknown): void;\n    // Get transform prop value of the current animation frame.\n    getTransform(key: TransformProp): unknown;\n    //  [...]
   },
@@ -903,15 +1176,15 @@ window.__EC_DOC_option_series_custom = {
   "renderItem.return_ring.style.transition": {
     "desc": "<p>Can be a single property name or an array of property names.\nEnable transition animation when the specified properties changed.\nCan only specify properties that are under this <code class=\"codespan\">style</code>.</p>\n<p>For example:</p>\n<pre><code class=\"lang-js\">renderItem: function (params, api) {\n    return {\n        type: &#39;xxx&#39;,\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n             [...]
   },
-  "renderItem.return_ring.emphasis": {
-    "desc": "<p>Emphasis state of the element.</p>\n"
-  },
-  "renderItem.return_ring.emphasis.focus": {
+  "renderItem.return_ring.focus": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
   },
-  "renderItem.return_ring.emphasis.blurScope": {
+  "renderItem.return_ring.blurScope": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
   },
+  "renderItem.return_ring.emphasis": {
+    "desc": "<p>Emphasis state of the element.</p>\n"
+  },
   "renderItem.return_ring.emphasis.style": {
     "desc": "<p>Same to <a href=\"#series-custom.renderItem.return_polygon.style\">style</a>.</p>\n"
   },
@@ -981,6 +1254,45 @@ window.__EC_DOC_option_series_custom = {
   "renderItem.return_sector.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "renderItem.return_sector.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#series-custom.renderItem.return_text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "renderItem.return_sector.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "renderItem.return_sector.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "renderItem.return_sector.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "renderItem.return_sector.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "renderItem.return_sector.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "renderItem.return_sector.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "renderItem.return_sector.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "renderItem.return_sector.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "renderItem.return_sector.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "renderItem.return_sector.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "renderItem.return_sector.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "renderItem.return_sector.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "renderItem.return_sector.during": {
     "desc": "<p><code class=\"codespan\">during</code> callback enable users to set props to an element in each animation frame.</p>\n<pre><code class=\"lang-js\">(duringAPI: CustomDuringAPI) =&gt; void\n\ninterface CustomDuringAPI {\n    // Set transform prop value.\n    // Transform prop see `TransformProp`.\n    setTransform(key: TransformProp, val: unknown): void;\n    // Get transform prop value of the current animation frame.\n    getTransform(key: TransformProp): unknown;\n    //  [...]
   },
@@ -1041,15 +1353,15 @@ window.__EC_DOC_option_series_custom = {
   "renderItem.return_sector.style.transition": {
     "desc": "<p>Can be a single property name or an array of property names.\nEnable transition animation when the specified properties changed.\nCan only specify properties that are under this <code class=\"codespan\">style</code>.</p>\n<p>For example:</p>\n<pre><code class=\"lang-js\">renderItem: function (params, api) {\n    return {\n        type: &#39;xxx&#39;,\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n             [...]
   },
-  "renderItem.return_sector.emphasis": {
-    "desc": "<p>Emphasis state of the element.</p>\n"
-  },
-  "renderItem.return_sector.emphasis.focus": {
+  "renderItem.return_sector.focus": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
   },
-  "renderItem.return_sector.emphasis.blurScope": {
+  "renderItem.return_sector.blurScope": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
   },
+  "renderItem.return_sector.emphasis": {
+    "desc": "<p>Emphasis state of the element.</p>\n"
+  },
   "renderItem.return_sector.emphasis.style": {
     "desc": "<p>Same to <a href=\"#series-custom.renderItem.return_polygon.style\">style</a>.</p>\n"
   },
@@ -1119,6 +1431,45 @@ window.__EC_DOC_option_series_custom = {
   "renderItem.return_arc.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "renderItem.return_arc.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#series-custom.renderItem.return_text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "renderItem.return_arc.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "renderItem.return_arc.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "renderItem.return_arc.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "renderItem.return_arc.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "renderItem.return_arc.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "renderItem.return_arc.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "renderItem.return_arc.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "renderItem.return_arc.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "renderItem.return_arc.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "renderItem.return_arc.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "renderItem.return_arc.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "renderItem.return_arc.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "renderItem.return_arc.during": {
     "desc": "<p><code class=\"codespan\">during</code> callback enable users to set props to an element in each animation frame.</p>\n<pre><code class=\"lang-js\">(duringAPI: CustomDuringAPI) =&gt; void\n\ninterface CustomDuringAPI {\n    // Set transform prop value.\n    // Transform prop see `TransformProp`.\n    setTransform(key: TransformProp, val: unknown): void;\n    // Get transform prop value of the current animation frame.\n    getTransform(key: TransformProp): unknown;\n    //  [...]
   },
@@ -1179,15 +1530,15 @@ window.__EC_DOC_option_series_custom = {
   "renderItem.return_arc.style.transition": {
     "desc": "<p>Can be a single property name or an array of property names.\nEnable transition animation when the specified properties changed.\nCan only specify properties that are under this <code class=\"codespan\">style</code>.</p>\n<p>For example:</p>\n<pre><code class=\"lang-js\">renderItem: function (params, api) {\n    return {\n        type: &#39;xxx&#39;,\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n             [...]
   },
-  "renderItem.return_arc.emphasis": {
-    "desc": "<p>Emphasis state of the element.</p>\n"
-  },
-  "renderItem.return_arc.emphasis.focus": {
+  "renderItem.return_arc.focus": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
   },
-  "renderItem.return_arc.emphasis.blurScope": {
+  "renderItem.return_arc.blurScope": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
   },
+  "renderItem.return_arc.emphasis": {
+    "desc": "<p>Emphasis state of the element.</p>\n"
+  },
   "renderItem.return_arc.emphasis.style": {
     "desc": "<p>Same to <a href=\"#series-custom.renderItem.return_polygon.style\">style</a>.</p>\n"
   },
@@ -1257,6 +1608,45 @@ window.__EC_DOC_option_series_custom = {
   "renderItem.return_polygon.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "renderItem.return_polygon.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#series-custom.renderItem.return_text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "renderItem.return_polygon.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "renderItem.return_polygon.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "renderItem.return_polygon.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "renderItem.return_polygon.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "renderItem.return_polygon.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "renderItem.return_polygon.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "renderItem.return_polygon.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "renderItem.return_polygon.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "renderItem.return_polygon.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "renderItem.return_polygon.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "renderItem.return_polygon.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "renderItem.return_polygon.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "renderItem.return_polygon.during": {
     "desc": "<p><code class=\"codespan\">during</code> callback enable users to set props to an element in each animation frame.</p>\n<pre><code class=\"lang-js\">(duringAPI: CustomDuringAPI) =&gt; void\n\ninterface CustomDuringAPI {\n    // Set transform prop value.\n    // Transform prop see `TransformProp`.\n    setTransform(key: TransformProp, val: unknown): void;\n    // Get transform prop value of the current animation frame.\n    getTransform(key: TransformProp): unknown;\n    //  [...]
   },
@@ -1305,15 +1695,15 @@ window.__EC_DOC_option_series_custom = {
   "renderItem.return_polygon.style.transition": {
     "desc": "<p>Can be a single property name or an array of property names.\nEnable transition animation when the specified properties changed.\nCan only specify properties that are under this <code class=\"codespan\">style</code>.</p>\n<p>For example:</p>\n<pre><code class=\"lang-js\">renderItem: function (params, api) {\n    return {\n        type: &#39;xxx&#39;,\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n             [...]
   },
-  "renderItem.return_polygon.emphasis": {
-    "desc": "<p>Emphasis state of the element.</p>\n"
-  },
-  "renderItem.return_polygon.emphasis.focus": {
+  "renderItem.return_polygon.focus": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
   },
-  "renderItem.return_polygon.emphasis.blurScope": {
+  "renderItem.return_polygon.blurScope": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
   },
+  "renderItem.return_polygon.emphasis": {
+    "desc": "<p>Emphasis state of the element.</p>\n"
+  },
   "renderItem.return_polygon.emphasis.style": {
     "desc": "<p>Same to <a href=\"#series-custom.renderItem.return_polygon.style\">style</a>.</p>\n"
   },
@@ -1383,6 +1773,45 @@ window.__EC_DOC_option_series_custom = {
   "renderItem.return_polyline.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "renderItem.return_polyline.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#series-custom.renderItem.return_text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "renderItem.return_polyline.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "renderItem.return_polyline.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "renderItem.return_polyline.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "renderItem.return_polyline.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "renderItem.return_polyline.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "renderItem.return_polyline.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "renderItem.return_polyline.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "renderItem.return_polyline.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "renderItem.return_polyline.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "renderItem.return_polyline.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "renderItem.return_polyline.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "renderItem.return_polyline.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "renderItem.return_polyline.during": {
     "desc": "<p><code class=\"codespan\">during</code> callback enable users to set props to an element in each animation frame.</p>\n<pre><code class=\"lang-js\">(duringAPI: CustomDuringAPI) =&gt; void\n\ninterface CustomDuringAPI {\n    // Set transform prop value.\n    // Transform prop see `TransformProp`.\n    setTransform(key: TransformProp, val: unknown): void;\n    // Get transform prop value of the current animation frame.\n    getTransform(key: TransformProp): unknown;\n    //  [...]
   },
@@ -1431,15 +1860,15 @@ window.__EC_DOC_option_series_custom = {
   "renderItem.return_polyline.style.transition": {
     "desc": "<p>Can be a single property name or an array of property names.\nEnable transition animation when the specified properties changed.\nCan only specify properties that are under this <code class=\"codespan\">style</code>.</p>\n<p>For example:</p>\n<pre><code class=\"lang-js\">renderItem: function (params, api) {\n    return {\n        type: &#39;xxx&#39;,\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n             [...]
   },
-  "renderItem.return_polyline.emphasis": {
-    "desc": "<p>Emphasis state of the element.</p>\n"
-  },
-  "renderItem.return_polyline.emphasis.focus": {
+  "renderItem.return_polyline.focus": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
   },
-  "renderItem.return_polyline.emphasis.blurScope": {
+  "renderItem.return_polyline.blurScope": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
   },
+  "renderItem.return_polyline.emphasis": {
+    "desc": "<p>Emphasis state of the element.</p>\n"
+  },
   "renderItem.return_polyline.emphasis.style": {
     "desc": "<p>Same to <a href=\"#series-custom.renderItem.return_polygon.style\">style</a>.</p>\n"
   },
@@ -1509,6 +1938,45 @@ window.__EC_DOC_option_series_custom = {
   "renderItem.return_line.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "renderItem.return_line.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#series-custom.renderItem.return_text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "renderItem.return_line.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "renderItem.return_line.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "renderItem.return_line.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "renderItem.return_line.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "renderItem.return_line.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "renderItem.return_line.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "renderItem.return_line.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "renderItem.return_line.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "renderItem.return_line.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "renderItem.return_line.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "renderItem.return_line.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "renderItem.return_line.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "renderItem.return_line.during": {
     "desc": "<p><code class=\"codespan\">during</code> callback enable users to set props to an element in each animation frame.</p>\n<pre><code class=\"lang-js\">(duringAPI: CustomDuringAPI) =&gt; void\n\ninterface CustomDuringAPI {\n    // Set transform prop value.\n    // Transform prop see `TransformProp`.\n    setTransform(key: TransformProp, val: unknown): void;\n    // Get transform prop value of the current animation frame.\n    getTransform(key: TransformProp): unknown;\n    //  [...]
   },
@@ -1563,15 +2031,15 @@ window.__EC_DOC_option_series_custom = {
   "renderItem.return_line.style.transition": {
     "desc": "<p>Can be a single property name or an array of property names.\nEnable transition animation when the specified properties changed.\nCan only specify properties that are under this <code class=\"codespan\">style</code>.</p>\n<p>For example:</p>\n<pre><code class=\"lang-js\">renderItem: function (params, api) {\n    return {\n        type: &#39;xxx&#39;,\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n             [...]
   },
-  "renderItem.return_line.emphasis": {
-    "desc": "<p>Emphasis state of the element.</p>\n"
-  },
-  "renderItem.return_line.emphasis.focus": {
+  "renderItem.return_line.focus": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
   },
-  "renderItem.return_line.emphasis.blurScope": {
+  "renderItem.return_line.blurScope": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
   },
+  "renderItem.return_line.emphasis": {
+    "desc": "<p>Emphasis state of the element.</p>\n"
+  },
   "renderItem.return_line.emphasis.style": {
     "desc": "<p>Same to <a href=\"#series-custom.renderItem.return_polygon.style\">style</a>.</p>\n"
   },
@@ -1641,6 +2109,45 @@ window.__EC_DOC_option_series_custom = {
   "renderItem.return_bezierCurve.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "renderItem.return_bezierCurve.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#series-custom.renderItem.return_text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "renderItem.return_bezierCurve.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "renderItem.return_bezierCurve.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "renderItem.return_bezierCurve.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "renderItem.return_bezierCurve.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "renderItem.return_bezierCurve.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "renderItem.return_bezierCurve.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "renderItem.return_bezierCurve.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "renderItem.return_bezierCurve.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "renderItem.return_bezierCurve.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "renderItem.return_bezierCurve.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "renderItem.return_bezierCurve.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "renderItem.return_bezierCurve.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "renderItem.return_bezierCurve.during": {
     "desc": "<p><code class=\"codespan\">during</code> callback enable users to set props to an element in each animation frame.</p>\n<pre><code class=\"lang-js\">(duringAPI: CustomDuringAPI) =&gt; void\n\ninterface CustomDuringAPI {\n    // Set transform prop value.\n    // Transform prop see `TransformProp`.\n    setTransform(key: TransformProp, val: unknown): void;\n    // Get transform prop value of the current animation frame.\n    getTransform(key: TransformProp): unknown;\n    //  [...]
   },
@@ -1707,15 +2214,15 @@ window.__EC_DOC_option_series_custom = {
   "renderItem.return_bezierCurve.style.transition": {
     "desc": "<p>Can be a single property name or an array of property names.\nEnable transition animation when the specified properties changed.\nCan only specify properties that are under this <code class=\"codespan\">style</code>.</p>\n<p>For example:</p>\n<pre><code class=\"lang-js\">renderItem: function (params, api) {\n    return {\n        type: &#39;xxx&#39;,\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n             [...]
   },
-  "renderItem.return_bezierCurve.emphasis": {
-    "desc": "<p>Emphasis state of the element.</p>\n"
-  },
-  "renderItem.return_bezierCurve.emphasis.focus": {
+  "renderItem.return_bezierCurve.focus": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
   },
-  "renderItem.return_bezierCurve.emphasis.blurScope": {
+  "renderItem.return_bezierCurve.blurScope": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
   },
+  "renderItem.return_bezierCurve.emphasis": {
+    "desc": "<p>Emphasis state of the element.</p>\n"
+  },
   "renderItem.return_bezierCurve.emphasis.style": {
     "desc": "<p>Same to <a href=\"#series-custom.renderItem.return_polygon.style\">style</a>.</p>\n"
   },
@@ -2188,7 +2695,7 @@ window.__EC_DOC_option_series_custom = {
     "desc": "<blockquote>\n<p><strong>Notice:</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The position of the tooltip&#39;s floating layer, which would follow the position of mouse by default.</p>\n<p>Options:</p>\n<ul>\n<li><p><code class=\"codespan\">Array</code></p>\n<p>  Display the position of tooltip&#39;s floating layer through array, which supports absolu [...]
   },
   "data.tooltip.formatter": {
-    "desc": "<blockquote>\n<p><strong>Notice:</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The content formatter of tooltip&#39;s floating layer which supports string template and callback function.</p>\n<p><strong>1. String template</strong></p>\n<p>The template variables are <code class=\"codespan\">{a}</code>, <code class=\"codespan\">{b}</code>, <code class=\" [...]
+    "desc": "<blockquote>\n<p><strong>Notice:</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The content formatter of tooltip&#39;s floating layer which supports string template and callback function.</p>\n<p><strong>1. String template</strong></p>\n<p>The template variables are <code class=\"codespan\">{a}</code>, <code class=\"codespan\">{b}</code>, <code class=\" [...]
   },
   "data.tooltip.backgroundColor": {
     "desc": "<blockquote>\n<p><strong>Notice:</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The background color of tooltip&#39;s floating layer.</p>\n"
@@ -2272,9 +2779,9 @@ window.__EC_DOC_option_series_custom = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -2284,7 +2791,7 @@ window.__EC_DOC_option_series_custom = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -2345,7 +2852,10 @@ window.__EC_DOC_option_series_custom = {
     "desc": "<p>Determine how to display the text when it&#39;s overflow on height.</p>\n<ul>\n<li><code class=\"codespan\">&#39;truncate&#39;</code> Truncate the overflow lines.</li>\n</ul>\n"
   },
   "data.tooltip.extraCssText": {
-    "desc": "<blockquote>\n<p><strong>Notice:</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>Extra CSS style for floating layer. The following is an example for adding shadow.</p>\n<pre><code class=\"lang-js\">extraCssText: &#39;box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);&#39;\n</code></pre>\n"
+    "desc": "\n\n\n\n\n<blockquote>\n<p><strong>Notice:</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>Extra CSS style for floating layer. The following is an example for adding shadow.</p>\n<pre><code class=\"lang-js\">extraCssText: &#39;box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);&#39;\n</code></pre>\n",
+    "uiControl": {
+      "type": "text"
+    }
   },
   "clip": {
     "desc": "\n\n\n\n<blockquote>\n<p>Since <code class=\"codespan\">v4.4.0</code></p>\n</blockquote>\n<p>If clip the overflow on the coordinate system. Clip results varies between series:</p>\n<ul>\n<li>Scatter:Ignore the symbols exceeds the coordinate system. Not clip the elements.</li>\n<li>Bar:Clip all the overflowed. With bar width kept.</li>\n<li>Line:Clip the overflowed line.</li>\n<li>Lines: Clip all the overflowed.</li>\n<li>Candlestick: Ignore the elements exceeds the coordinat [...]
@@ -2424,7 +2934,7 @@ window.__EC_DOC_option_series_custom = {
     "desc": "<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The position of the tooltip&#39;s floating layer, which would follow the position of mouse by default.</p>\n<p>Options:</p>\n<ul>\n<li><p><code class=\"codespan\">Array</code></p>\n<p>  Display the position of tooltip&#39;s floating layer through array, which support [...]
   },
   "tooltip.formatter": {
-    "desc": "<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The content formatter of tooltip&#39;s floating layer which supports string template and callback function.</p>\n<p><strong>1. String template</strong></p>\n<p>The template variables are <code class=\"codespan\">{a}</code>, <code class=\"codespan\">{b}</code>, <code  [...]
+    "desc": "<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The content formatter of tooltip&#39;s floating layer which supports string template and callback function.</p>\n<p><strong>1. String template</strong></p>\n<p>The template variables are <code class=\"codespan\">{a}</code>, <code class=\"codespan\">{b}</code>, <code  [...]
   },
   "tooltip.backgroundColor": {
     "desc": "<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The background color of tooltip&#39;s floating layer.</p>\n"
@@ -2508,9 +3018,9 @@ window.__EC_DOC_option_series_custom = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -2520,7 +3030,7 @@ window.__EC_DOC_option_series_custom = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -2581,6 +3091,9 @@ window.__EC_DOC_option_series_custom = {
     "desc": "<p>Determine how to display the text when it&#39;s overflow on height.</p>\n<ul>\n<li><code class=\"codespan\">&#39;truncate&#39;</code> Truncate the overflow lines.</li>\n</ul>\n"
   },
   "tooltip.extraCssText": {
-    "desc": "<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>Extra CSS style for floating layer. The following is an example for adding shadow.</p>\n<pre><code class=\"lang-js\">extraCssText: &#39;box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);&#39;\n</code></pre>\n"
+    "desc": "\n\n\n\n\n<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>Extra CSS style for floating layer. The following is an example for adding shadow.</p>\n<pre><code class=\"lang-js\">extraCssText: &#39;box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);&#39;\n</code></pre>\n",
+    "uiControl": {
+      "type": "text"
+    }
   }
 }
\ No newline at end of file
diff --git a/en/documents/option-parts/option.series-custom.json b/en/documents/option-parts/option.series-custom.json
index c6f66c5..3b4a9a7 100644
--- a/en/documents/option-parts/option.series-custom.json
+++ b/en/documents/option-parts/option.series-custom.json
@@ -135,6 +135,45 @@
   "renderItem.return_group.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "renderItem.return_group.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#series-custom.renderItem.return_text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "renderItem.return_group.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "renderItem.return_group.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "renderItem.return_group.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "renderItem.return_group.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "renderItem.return_group.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "renderItem.return_group.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "renderItem.return_group.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "renderItem.return_group.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "renderItem.return_group.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "renderItem.return_group.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "renderItem.return_group.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "renderItem.return_group.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "renderItem.return_group.during": {
     "desc": "<p><code class=\"codespan\">during</code> callback enable users to set props to an element in each animation frame.</p>\n<pre><code class=\"lang-js\">(duringAPI: CustomDuringAPI) =&gt; void\n\ninterface CustomDuringAPI {\n    // Set transform prop value.\n    // Transform prop see `TransformProp`.\n    setTransform(key: TransformProp, val: unknown): void;\n    // Get transform prop value of the current animation frame.\n    getTransform(key: TransformProp): unknown;\n    //  [...]
   },
@@ -210,6 +249,45 @@
   "renderItem.return_path.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "renderItem.return_path.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#series-custom.renderItem.return_text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "renderItem.return_path.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "renderItem.return_path.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "renderItem.return_path.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "renderItem.return_path.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "renderItem.return_path.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "renderItem.return_path.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "renderItem.return_path.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "renderItem.return_path.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "renderItem.return_path.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "renderItem.return_path.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "renderItem.return_path.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "renderItem.return_path.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "renderItem.return_path.during": {
     "desc": "<p><code class=\"codespan\">during</code> callback enable users to set props to an element in each animation frame.</p>\n<pre><code class=\"lang-js\">(duringAPI: CustomDuringAPI) =&gt; void\n\ninterface CustomDuringAPI {\n    // Set transform prop value.\n    // Transform prop see `TransformProp`.\n    setTransform(key: TransformProp, val: unknown): void;\n    // Get transform prop value of the current animation frame.\n    getTransform(key: TransformProp): unknown;\n    //  [...]
   },
@@ -270,15 +348,15 @@
   "renderItem.return_path.style.transition": {
     "desc": "<p>Can be a single property name or an array of property names.\nEnable transition animation when the specified properties changed.\nCan only specify properties that are under this <code class=\"codespan\">style</code>.</p>\n<p>For example:</p>\n<pre><code class=\"lang-js\">renderItem: function (params, api) {\n    return {\n        type: &#39;xxx&#39;,\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n             [...]
   },
-  "renderItem.return_path.emphasis": {
-    "desc": "<p>Emphasis state of the element.</p>\n"
-  },
-  "renderItem.return_path.emphasis.focus": {
+  "renderItem.return_path.focus": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
   },
-  "renderItem.return_path.emphasis.blurScope": {
+  "renderItem.return_path.blurScope": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
   },
+  "renderItem.return_path.emphasis": {
+    "desc": "<p>Emphasis state of the element.</p>\n"
+  },
   "renderItem.return_path.emphasis.style": {
     "desc": "<p>Same to <a href=\"#series-custom.renderItem.return_polygon.style\">style</a>.</p>\n"
   },
@@ -342,6 +420,45 @@
   "renderItem.return_image.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "renderItem.return_image.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#series-custom.renderItem.return_text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "renderItem.return_image.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "renderItem.return_image.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "renderItem.return_image.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "renderItem.return_image.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "renderItem.return_image.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "renderItem.return_image.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "renderItem.return_image.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "renderItem.return_image.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "renderItem.return_image.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "renderItem.return_image.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "renderItem.return_image.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "renderItem.return_image.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "renderItem.return_image.during": {
     "desc": "<p><code class=\"codespan\">during</code> callback enable users to set props to an element in each animation frame.</p>\n<pre><code class=\"lang-js\">(duringAPI: CustomDuringAPI) =&gt; void\n\ninterface CustomDuringAPI {\n    // Set transform prop value.\n    // Transform prop see `TransformProp`.\n    setTransform(key: TransformProp, val: unknown): void;\n    // Get transform prop value of the current animation frame.\n    getTransform(key: TransformProp): unknown;\n    //  [...]
   },
@@ -390,15 +507,15 @@
   "renderItem.return_image.style.transition": {
     "desc": "<p>Can be a single property name or an array of property names.\nEnable transition animation when the specified properties changed.\nCan only specify properties that are under this <code class=\"codespan\">style</code>.</p>\n<p>For example:</p>\n<pre><code class=\"lang-js\">renderItem: function (params, api) {\n    return {\n        type: &#39;xxx&#39;,\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n             [...]
   },
-  "renderItem.return_image.emphasis": {
-    "desc": "<p>Emphasis state of the element.</p>\n"
-  },
-  "renderItem.return_image.emphasis.focus": {
+  "renderItem.return_image.focus": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
   },
-  "renderItem.return_image.emphasis.blurScope": {
+  "renderItem.return_image.blurScope": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
   },
+  "renderItem.return_image.emphasis": {
+    "desc": "<p>Emphasis state of the element.</p>\n"
+  },
   "renderItem.return_image.emphasis.style": {
     "desc": "<p>Same to <a href=\"#series-custom.renderItem.return_polygon.style\">style</a>.</p>\n"
   },
@@ -465,6 +582,45 @@
   "renderItem.return_text.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "renderItem.return_text.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#series-custom.renderItem.return_text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "renderItem.return_text.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "renderItem.return_text.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "renderItem.return_text.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "renderItem.return_text.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "renderItem.return_text.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "renderItem.return_text.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "renderItem.return_text.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "renderItem.return_text.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "renderItem.return_text.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "renderItem.return_text.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "renderItem.return_text.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "renderItem.return_text.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "renderItem.return_text.during": {
     "desc": "<p><code class=\"codespan\">during</code> callback enable users to set props to an element in each animation frame.</p>\n<pre><code class=\"lang-js\">(duringAPI: CustomDuringAPI) =&gt; void\n\ninterface CustomDuringAPI {\n    // Set transform prop value.\n    // Transform prop see `TransformProp`.\n    setTransform(key: TransformProp, val: unknown): void;\n    // Get transform prop value of the current animation frame.\n    getTransform(key: TransformProp): unknown;\n    //  [...]
   },
@@ -516,15 +672,15 @@
   "renderItem.return_text.style.transition": {
     "desc": "<p>Can be a single property name or an array of property names.\nEnable transition animation when the specified properties changed.\nCan only specify properties that are under this <code class=\"codespan\">style</code>.</p>\n<p>For example:</p>\n<pre><code class=\"lang-js\">renderItem: function (params, api) {\n    return {\n        type: &#39;xxx&#39;,\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n             [...]
   },
-  "renderItem.return_text.emphasis": {
-    "desc": "<p>Emphasis state of the element.</p>\n"
-  },
-  "renderItem.return_text.emphasis.focus": {
+  "renderItem.return_text.focus": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
   },
-  "renderItem.return_text.emphasis.blurScope": {
+  "renderItem.return_text.blurScope": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
   },
+  "renderItem.return_text.emphasis": {
+    "desc": "<p>Emphasis state of the element.</p>\n"
+  },
   "renderItem.return_text.emphasis.style": {
     "desc": "<p>Same to <a href=\"#series-custom.renderItem.return_polygon.style\">style</a>.</p>\n"
   },
@@ -594,6 +750,45 @@
   "renderItem.return_rect.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "renderItem.return_rect.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#series-custom.renderItem.return_text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "renderItem.return_rect.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "renderItem.return_rect.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "renderItem.return_rect.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "renderItem.return_rect.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "renderItem.return_rect.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "renderItem.return_rect.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "renderItem.return_rect.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "renderItem.return_rect.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "renderItem.return_rect.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "renderItem.return_rect.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "renderItem.return_rect.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "renderItem.return_rect.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "renderItem.return_rect.during": {
     "desc": "<p><code class=\"codespan\">during</code> callback enable users to set props to an element in each animation frame.</p>\n<pre><code class=\"lang-js\">(duringAPI: CustomDuringAPI) =&gt; void\n\ninterface CustomDuringAPI {\n    // Set transform prop value.\n    // Transform prop see `TransformProp`.\n    setTransform(key: TransformProp, val: unknown): void;\n    // Get transform prop value of the current animation frame.\n    getTransform(key: TransformProp): unknown;\n    //  [...]
   },
@@ -648,15 +843,15 @@
   "renderItem.return_rect.style.transition": {
     "desc": "<p>Can be a single property name or an array of property names.\nEnable transition animation when the specified properties changed.\nCan only specify properties that are under this <code class=\"codespan\">style</code>.</p>\n<p>For example:</p>\n<pre><code class=\"lang-js\">renderItem: function (params, api) {\n    return {\n        type: &#39;xxx&#39;,\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n             [...]
   },
-  "renderItem.return_rect.emphasis": {
-    "desc": "<p>Emphasis state of the element.</p>\n"
-  },
-  "renderItem.return_rect.emphasis.focus": {
+  "renderItem.return_rect.focus": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
   },
-  "renderItem.return_rect.emphasis.blurScope": {
+  "renderItem.return_rect.blurScope": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
   },
+  "renderItem.return_rect.emphasis": {
+    "desc": "<p>Emphasis state of the element.</p>\n"
+  },
   "renderItem.return_rect.emphasis.style": {
     "desc": "<p>Same to <a href=\"#series-custom.renderItem.return_polygon.style\">style</a>.</p>\n"
   },
@@ -726,6 +921,45 @@
   "renderItem.return_circle.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "renderItem.return_circle.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#series-custom.renderItem.return_text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "renderItem.return_circle.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "renderItem.return_circle.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "renderItem.return_circle.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "renderItem.return_circle.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "renderItem.return_circle.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "renderItem.return_circle.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "renderItem.return_circle.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "renderItem.return_circle.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "renderItem.return_circle.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "renderItem.return_circle.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "renderItem.return_circle.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "renderItem.return_circle.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "renderItem.return_circle.during": {
     "desc": "<p><code class=\"codespan\">during</code> callback enable users to set props to an element in each animation frame.</p>\n<pre><code class=\"lang-js\">(duringAPI: CustomDuringAPI) =&gt; void\n\ninterface CustomDuringAPI {\n    // Set transform prop value.\n    // Transform prop see `TransformProp`.\n    setTransform(key: TransformProp, val: unknown): void;\n    // Get transform prop value of the current animation frame.\n    getTransform(key: TransformProp): unknown;\n    //  [...]
   },
@@ -774,15 +1008,15 @@
   "renderItem.return_circle.style.transition": {
     "desc": "<p>Can be a single property name or an array of property names.\nEnable transition animation when the specified properties changed.\nCan only specify properties that are under this <code class=\"codespan\">style</code>.</p>\n<p>For example:</p>\n<pre><code class=\"lang-js\">renderItem: function (params, api) {\n    return {\n        type: &#39;xxx&#39;,\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n             [...]
   },
-  "renderItem.return_circle.emphasis": {
-    "desc": "<p>Emphasis state of the element.</p>\n"
-  },
-  "renderItem.return_circle.emphasis.focus": {
+  "renderItem.return_circle.focus": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
   },
-  "renderItem.return_circle.emphasis.blurScope": {
+  "renderItem.return_circle.blurScope": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
   },
+  "renderItem.return_circle.emphasis": {
+    "desc": "<p>Emphasis state of the element.</p>\n"
+  },
   "renderItem.return_circle.emphasis.style": {
     "desc": "<p>Same to <a href=\"#series-custom.renderItem.return_polygon.style\">style</a>.</p>\n"
   },
@@ -852,6 +1086,45 @@
   "renderItem.return_ring.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "renderItem.return_ring.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#series-custom.renderItem.return_text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "renderItem.return_ring.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "renderItem.return_ring.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "renderItem.return_ring.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "renderItem.return_ring.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "renderItem.return_ring.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "renderItem.return_ring.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "renderItem.return_ring.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "renderItem.return_ring.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "renderItem.return_ring.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "renderItem.return_ring.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "renderItem.return_ring.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "renderItem.return_ring.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "renderItem.return_ring.during": {
     "desc": "<p><code class=\"codespan\">during</code> callback enable users to set props to an element in each animation frame.</p>\n<pre><code class=\"lang-js\">(duringAPI: CustomDuringAPI) =&gt; void\n\ninterface CustomDuringAPI {\n    // Set transform prop value.\n    // Transform prop see `TransformProp`.\n    setTransform(key: TransformProp, val: unknown): void;\n    // Get transform prop value of the current animation frame.\n    getTransform(key: TransformProp): unknown;\n    //  [...]
   },
@@ -903,15 +1176,15 @@
   "renderItem.return_ring.style.transition": {
     "desc": "<p>Can be a single property name or an array of property names.\nEnable transition animation when the specified properties changed.\nCan only specify properties that are under this <code class=\"codespan\">style</code>.</p>\n<p>For example:</p>\n<pre><code class=\"lang-js\">renderItem: function (params, api) {\n    return {\n        type: &#39;xxx&#39;,\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n             [...]
   },
-  "renderItem.return_ring.emphasis": {
-    "desc": "<p>Emphasis state of the element.</p>\n"
-  },
-  "renderItem.return_ring.emphasis.focus": {
+  "renderItem.return_ring.focus": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
   },
-  "renderItem.return_ring.emphasis.blurScope": {
+  "renderItem.return_ring.blurScope": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
   },
+  "renderItem.return_ring.emphasis": {
+    "desc": "<p>Emphasis state of the element.</p>\n"
+  },
   "renderItem.return_ring.emphasis.style": {
     "desc": "<p>Same to <a href=\"#series-custom.renderItem.return_polygon.style\">style</a>.</p>\n"
   },
@@ -981,6 +1254,45 @@
   "renderItem.return_sector.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "renderItem.return_sector.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#series-custom.renderItem.return_text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "renderItem.return_sector.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "renderItem.return_sector.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "renderItem.return_sector.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "renderItem.return_sector.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "renderItem.return_sector.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "renderItem.return_sector.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "renderItem.return_sector.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "renderItem.return_sector.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "renderItem.return_sector.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "renderItem.return_sector.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "renderItem.return_sector.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "renderItem.return_sector.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "renderItem.return_sector.during": {
     "desc": "<p><code class=\"codespan\">during</code> callback enable users to set props to an element in each animation frame.</p>\n<pre><code class=\"lang-js\">(duringAPI: CustomDuringAPI) =&gt; void\n\ninterface CustomDuringAPI {\n    // Set transform prop value.\n    // Transform prop see `TransformProp`.\n    setTransform(key: TransformProp, val: unknown): void;\n    // Get transform prop value of the current animation frame.\n    getTransform(key: TransformProp): unknown;\n    //  [...]
   },
@@ -1041,15 +1353,15 @@
   "renderItem.return_sector.style.transition": {
     "desc": "<p>Can be a single property name or an array of property names.\nEnable transition animation when the specified properties changed.\nCan only specify properties that are under this <code class=\"codespan\">style</code>.</p>\n<p>For example:</p>\n<pre><code class=\"lang-js\">renderItem: function (params, api) {\n    return {\n        type: &#39;xxx&#39;,\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n             [...]
   },
-  "renderItem.return_sector.emphasis": {
-    "desc": "<p>Emphasis state of the element.</p>\n"
-  },
-  "renderItem.return_sector.emphasis.focus": {
+  "renderItem.return_sector.focus": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
   },
-  "renderItem.return_sector.emphasis.blurScope": {
+  "renderItem.return_sector.blurScope": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
   },
+  "renderItem.return_sector.emphasis": {
+    "desc": "<p>Emphasis state of the element.</p>\n"
+  },
   "renderItem.return_sector.emphasis.style": {
     "desc": "<p>Same to <a href=\"#series-custom.renderItem.return_polygon.style\">style</a>.</p>\n"
   },
@@ -1119,6 +1431,45 @@
   "renderItem.return_arc.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "renderItem.return_arc.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#series-custom.renderItem.return_text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "renderItem.return_arc.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "renderItem.return_arc.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "renderItem.return_arc.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "renderItem.return_arc.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "renderItem.return_arc.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "renderItem.return_arc.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "renderItem.return_arc.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "renderItem.return_arc.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "renderItem.return_arc.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "renderItem.return_arc.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "renderItem.return_arc.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "renderItem.return_arc.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "renderItem.return_arc.during": {
     "desc": "<p><code class=\"codespan\">during</code> callback enable users to set props to an element in each animation frame.</p>\n<pre><code class=\"lang-js\">(duringAPI: CustomDuringAPI) =&gt; void\n\ninterface CustomDuringAPI {\n    // Set transform prop value.\n    // Transform prop see `TransformProp`.\n    setTransform(key: TransformProp, val: unknown): void;\n    // Get transform prop value of the current animation frame.\n    getTransform(key: TransformProp): unknown;\n    //  [...]
   },
@@ -1179,15 +1530,15 @@
   "renderItem.return_arc.style.transition": {
     "desc": "<p>Can be a single property name or an array of property names.\nEnable transition animation when the specified properties changed.\nCan only specify properties that are under this <code class=\"codespan\">style</code>.</p>\n<p>For example:</p>\n<pre><code class=\"lang-js\">renderItem: function (params, api) {\n    return {\n        type: &#39;xxx&#39;,\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n             [...]
   },
-  "renderItem.return_arc.emphasis": {
-    "desc": "<p>Emphasis state of the element.</p>\n"
-  },
-  "renderItem.return_arc.emphasis.focus": {
+  "renderItem.return_arc.focus": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
   },
-  "renderItem.return_arc.emphasis.blurScope": {
+  "renderItem.return_arc.blurScope": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
   },
+  "renderItem.return_arc.emphasis": {
+    "desc": "<p>Emphasis state of the element.</p>\n"
+  },
   "renderItem.return_arc.emphasis.style": {
     "desc": "<p>Same to <a href=\"#series-custom.renderItem.return_polygon.style\">style</a>.</p>\n"
   },
@@ -1257,6 +1608,45 @@
   "renderItem.return_polygon.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "renderItem.return_polygon.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#series-custom.renderItem.return_text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "renderItem.return_polygon.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "renderItem.return_polygon.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "renderItem.return_polygon.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "renderItem.return_polygon.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "renderItem.return_polygon.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "renderItem.return_polygon.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "renderItem.return_polygon.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "renderItem.return_polygon.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "renderItem.return_polygon.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "renderItem.return_polygon.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "renderItem.return_polygon.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "renderItem.return_polygon.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "renderItem.return_polygon.during": {
     "desc": "<p><code class=\"codespan\">during</code> callback enable users to set props to an element in each animation frame.</p>\n<pre><code class=\"lang-js\">(duringAPI: CustomDuringAPI) =&gt; void\n\ninterface CustomDuringAPI {\n    // Set transform prop value.\n    // Transform prop see `TransformProp`.\n    setTransform(key: TransformProp, val: unknown): void;\n    // Get transform prop value of the current animation frame.\n    getTransform(key: TransformProp): unknown;\n    //  [...]
   },
@@ -1305,15 +1695,15 @@
   "renderItem.return_polygon.style.transition": {
     "desc": "<p>Can be a single property name or an array of property names.\nEnable transition animation when the specified properties changed.\nCan only specify properties that are under this <code class=\"codespan\">style</code>.</p>\n<p>For example:</p>\n<pre><code class=\"lang-js\">renderItem: function (params, api) {\n    return {\n        type: &#39;xxx&#39;,\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n             [...]
   },
-  "renderItem.return_polygon.emphasis": {
-    "desc": "<p>Emphasis state of the element.</p>\n"
-  },
-  "renderItem.return_polygon.emphasis.focus": {
+  "renderItem.return_polygon.focus": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
   },
-  "renderItem.return_polygon.emphasis.blurScope": {
+  "renderItem.return_polygon.blurScope": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
   },
+  "renderItem.return_polygon.emphasis": {
+    "desc": "<p>Emphasis state of the element.</p>\n"
+  },
   "renderItem.return_polygon.emphasis.style": {
     "desc": "<p>Same to <a href=\"#series-custom.renderItem.return_polygon.style\">style</a>.</p>\n"
   },
@@ -1383,6 +1773,45 @@
   "renderItem.return_polyline.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "renderItem.return_polyline.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#series-custom.renderItem.return_text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "renderItem.return_polyline.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "renderItem.return_polyline.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "renderItem.return_polyline.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "renderItem.return_polyline.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "renderItem.return_polyline.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "renderItem.return_polyline.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "renderItem.return_polyline.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "renderItem.return_polyline.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "renderItem.return_polyline.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "renderItem.return_polyline.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "renderItem.return_polyline.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "renderItem.return_polyline.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "renderItem.return_polyline.during": {
     "desc": "<p><code class=\"codespan\">during</code> callback enable users to set props to an element in each animation frame.</p>\n<pre><code class=\"lang-js\">(duringAPI: CustomDuringAPI) =&gt; void\n\ninterface CustomDuringAPI {\n    // Set transform prop value.\n    // Transform prop see `TransformProp`.\n    setTransform(key: TransformProp, val: unknown): void;\n    // Get transform prop value of the current animation frame.\n    getTransform(key: TransformProp): unknown;\n    //  [...]
   },
@@ -1431,15 +1860,15 @@
   "renderItem.return_polyline.style.transition": {
     "desc": "<p>Can be a single property name or an array of property names.\nEnable transition animation when the specified properties changed.\nCan only specify properties that are under this <code class=\"codespan\">style</code>.</p>\n<p>For example:</p>\n<pre><code class=\"lang-js\">renderItem: function (params, api) {\n    return {\n        type: &#39;xxx&#39;,\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n             [...]
   },
-  "renderItem.return_polyline.emphasis": {
-    "desc": "<p>Emphasis state of the element.</p>\n"
-  },
-  "renderItem.return_polyline.emphasis.focus": {
+  "renderItem.return_polyline.focus": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
   },
-  "renderItem.return_polyline.emphasis.blurScope": {
+  "renderItem.return_polyline.blurScope": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
   },
+  "renderItem.return_polyline.emphasis": {
+    "desc": "<p>Emphasis state of the element.</p>\n"
+  },
   "renderItem.return_polyline.emphasis.style": {
     "desc": "<p>Same to <a href=\"#series-custom.renderItem.return_polygon.style\">style</a>.</p>\n"
   },
@@ -1509,6 +1938,45 @@
   "renderItem.return_line.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "renderItem.return_line.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#series-custom.renderItem.return_text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "renderItem.return_line.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "renderItem.return_line.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "renderItem.return_line.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "renderItem.return_line.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "renderItem.return_line.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "renderItem.return_line.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "renderItem.return_line.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "renderItem.return_line.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "renderItem.return_line.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "renderItem.return_line.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "renderItem.return_line.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "renderItem.return_line.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "renderItem.return_line.during": {
     "desc": "<p><code class=\"codespan\">during</code> callback enable users to set props to an element in each animation frame.</p>\n<pre><code class=\"lang-js\">(duringAPI: CustomDuringAPI) =&gt; void\n\ninterface CustomDuringAPI {\n    // Set transform prop value.\n    // Transform prop see `TransformProp`.\n    setTransform(key: TransformProp, val: unknown): void;\n    // Get transform prop value of the current animation frame.\n    getTransform(key: TransformProp): unknown;\n    //  [...]
   },
@@ -1563,15 +2031,15 @@
   "renderItem.return_line.style.transition": {
     "desc": "<p>Can be a single property name or an array of property names.\nEnable transition animation when the specified properties changed.\nCan only specify properties that are under this <code class=\"codespan\">style</code>.</p>\n<p>For example:</p>\n<pre><code class=\"lang-js\">renderItem: function (params, api) {\n    return {\n        type: &#39;xxx&#39;,\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n             [...]
   },
-  "renderItem.return_line.emphasis": {
-    "desc": "<p>Emphasis state of the element.</p>\n"
-  },
-  "renderItem.return_line.emphasis.focus": {
+  "renderItem.return_line.focus": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
   },
-  "renderItem.return_line.emphasis.blurScope": {
+  "renderItem.return_line.blurScope": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
   },
+  "renderItem.return_line.emphasis": {
+    "desc": "<p>Emphasis state of the element.</p>\n"
+  },
   "renderItem.return_line.emphasis.style": {
     "desc": "<p>Same to <a href=\"#series-custom.renderItem.return_polygon.style\">style</a>.</p>\n"
   },
@@ -1641,6 +2109,45 @@
   "renderItem.return_bezierCurve.ignore": {
     "desc": "<p>Whether the element is totally ignored (neither render nor listen events).</p>\n"
   },
+  "renderItem.return_bezierCurve.textContent": {
+    "desc": "<p>Text block attached to an element and layout based on the element by <code class=\"codespan\">textConfig</code>.</p>\n<p>The props the the same as <a href=\"option.html#series-custom.renderItem.return_text\" target=\"_blank\">text</a>.</p>\n"
+  },
+  "renderItem.return_bezierCurve.textConfig.position": {
+    "desc": "<p>Position of <code class=\"codespan\">textContent</code>.</p>\n<ul>\n<li>&#39;left&#39;</li>\n<li>&#39;right&#39;</li>\n<li>&#39;top&#39;</li>\n<li>&#39;bottom&#39;</li>\n<li>&#39;inside&#39;</li>\n<li>&#39;insideLeft&#39;</li>\n<li>&#39;insideRight&#39;</li>\n<li>&#39;insideTop&#39;</li>\n<li>&#39;insideBottom&#39;</li>\n<li>&#39;insideTopLeft&#39;</li>\n<li>&#39;insideTopRight&#39;</li>\n<li>&#39;insideBottomLeft&#39;</li>\n<li>&#39;insideBottomRight&#39;</li>\n<li>or li [...]
+  },
+  "renderItem.return_bezierCurve.textConfig.rotation": {
+    "desc": "<p>Rotation of <code class=\"codespan\">textContent</code>. In radian.</p>\n"
+  },
+  "renderItem.return_bezierCurve.textConfig.layoutRect": {
+    "desc": "<p>Rect that <code class=\"codespan\">textContent</code> will be positioned.\nDefault to be the bounding box of host element.</p>\n<pre><code class=\"lang-js\">{\n    x: number\n    y: number\n    width: number\n    height: number\n}\n</code></pre>\n"
+  },
+  "renderItem.return_bezierCurve.textConfig.offset(number[])": {
+    "desc": "<p>Offset of the <code class=\"codespan\">textContent</code>.</p>\n<p>The difference of <code class=\"codespan\">offset</code> and <code class=\"codespan\">position</code> is that <code class=\"codespan\">offset</code> will be applied in the rotation.</p>\n"
+  },
+  "renderItem.return_bezierCurve.textConfig.origin": {
+    "desc": "<p><code class=\"codespan\">origin</code> is relative to the bounding box of the host element.\nCan be percent value. Relative to the bounding box.\nIf <code class=\"codespan\">&#39;center&#39;</code> specified, it will be center of the bounding box.</p>\n<p>Only available when position and rotation are both set.</p>\n<ul>\n<li>like <code class=\"codespan\">[12, 33]</code></li>\n<li>or like <code class=\"codespan\">[&#39;50%&#39;, &#39;50%&#39;]</code></li>\n<li>&#39;center& [...]
+  },
+  "renderItem.return_bezierCurve.textConfig.distance": {
+    "desc": "<p>Distance to the <code class=\"codespan\">layoutRect</code>。</p>\n"
+  },
+  "renderItem.return_bezierCurve.textConfig.local": {
+    "desc": "<p>If <code class=\"codespan\">true</code>, it will apply host&#39;s transform.</p>\n"
+  },
+  "renderItem.return_bezierCurve.textConfig.insideFill": {
+    "desc": "<p><code class=\"codespan\">insideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.insideFill</code> &gt; &quot;auto-calculated-fill&quot;\nIn most cases, &quot;auto-calculated-fill&quot; is whi [...]
+  },
+  "renderItem.return_bezierCurve.textConfig.insideStroke": {
+    "desc": "<p><code class=\"codespan\">insideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is <code class=\"codespan\">&quot;inside&quot;</code>, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.insideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calcul [...]
+  },
+  "renderItem.return_bezierCurve.textConfig.outsideFill": {
+    "desc": "<p><code class=\"codespan\">outsideFill</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is &quot;inside&quot;, its final <code class=\"codespan\">fill</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.fill</code> &gt; <code class=\"codespan\">textConfig.outsideFill</code> &gt; #000</p>\n"
+  },
+  "renderItem.return_bezierCurve.textConfig.outsideStroke": {
+    "desc": "<p><code class=\"codespan\">outsideStroke</code> is a color string or left empty.</p>\n<p>If a <code class=\"codespan\">textContent</code> is not &quot;inside&quot;, its final <code class=\"codespan\">stroke</code> will be picked by this priority:\n<code class=\"codespan\">textContent.style.stroke</code> &gt; <code class=\"codespan\">textConfig.outsideStroke</code> &gt; &quot;auto-calculated-stroke&quot;</p>\n<p>The rule of getting &quot;auto-calculated-stroke&quot;:</p>\n<u [...]
+  },
+  "renderItem.return_bezierCurve.textConfig.inside": {
+    "desc": "<p>Tell echarts that I can make sure this text is inside or not.</p>\n"
+  },
   "renderItem.return_bezierCurve.during": {
     "desc": "<p><code class=\"codespan\">during</code> callback enable users to set props to an element in each animation frame.</p>\n<pre><code class=\"lang-js\">(duringAPI: CustomDuringAPI) =&gt; void\n\ninterface CustomDuringAPI {\n    // Set transform prop value.\n    // Transform prop see `TransformProp`.\n    setTransform(key: TransformProp, val: unknown): void;\n    // Get transform prop value of the current animation frame.\n    getTransform(key: TransformProp): unknown;\n    //  [...]
   },
@@ -1707,15 +2214,15 @@
   "renderItem.return_bezierCurve.style.transition": {
     "desc": "<p>Can be a single property name or an array of property names.\nEnable transition animation when the specified properties changed.\nCan only specify properties that are under this <code class=\"codespan\">style</code>.</p>\n<p>For example:</p>\n<pre><code class=\"lang-js\">renderItem: function (params, api) {\n    return {\n        type: &#39;xxx&#39;,\n        style: {\n            mmm: ...,\n            nnn: ...,\n            ppp: ...,\n            qqq: ...,\n             [...]
   },
-  "renderItem.return_bezierCurve.emphasis": {
-    "desc": "<p>Emphasis state of the element.</p>\n"
-  },
-  "renderItem.return_bezierCurve.emphasis.focus": {
+  "renderItem.return_bezierCurve.focus": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>When it&#39;s highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:</p>\n<ul>\n<li><code class=\"codespan\">&#39;none&#39;</code> Do not fade out other data, it&#39;s by default.</li>\n<li><code class=\"codespan\">&#39;self&#39;</code> Only focus (not fade out) the element of the currently highlighted data.</li>\n<li><code class= [...]
   },
-  "renderItem.return_bezierCurve.emphasis.blurScope": {
+  "renderItem.return_bezierCurve.blurScope": {
     "desc": "<blockquote>\n<p>Since <code class=\"codespan\">v5.0.0</code></p>\n</blockquote>\n<p>The range of fade out when <code class=\"codespan\">focus</code> is enabled. Support the following configurations</p>\n<ul>\n<li><code class=\"codespan\">&#39;coordinateSystem&#39;</code></li>\n<li><code class=\"codespan\">&#39;series&#39;</code></li>\n<li><code class=\"codespan\">&#39;global&#39;</code></li>\n</ul>\n"
   },
+  "renderItem.return_bezierCurve.emphasis": {
+    "desc": "<p>Emphasis state of the element.</p>\n"
+  },
   "renderItem.return_bezierCurve.emphasis.style": {
     "desc": "<p>Same to <a href=\"#series-custom.renderItem.return_polygon.style\">style</a>.</p>\n"
   },
@@ -2188,7 +2695,7 @@
     "desc": "<blockquote>\n<p><strong>Notice:</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The position of the tooltip&#39;s floating layer, which would follow the position of mouse by default.</p>\n<p>Options:</p>\n<ul>\n<li><p><code class=\"codespan\">Array</code></p>\n<p>  Display the position of tooltip&#39;s floating layer through array, which supports absolu [...]
   },
   "data.tooltip.formatter": {
-    "desc": "<blockquote>\n<p><strong>Notice:</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The content formatter of tooltip&#39;s floating layer which supports string template and callback function.</p>\n<p><strong>1. String template</strong></p>\n<p>The template variables are <code class=\"codespan\">{a}</code>, <code class=\"codespan\">{b}</code>, <code class=\" [...]
+    "desc": "<blockquote>\n<p><strong>Notice:</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The content formatter of tooltip&#39;s floating layer which supports string template and callback function.</p>\n<p><strong>1. String template</strong></p>\n<p>The template variables are <code class=\"codespan\">{a}</code>, <code class=\"codespan\">{b}</code>, <code class=\" [...]
   },
   "data.tooltip.backgroundColor": {
     "desc": "<blockquote>\n<p><strong>Notice:</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The background color of tooltip&#39;s floating layer.</p>\n"
@@ -2272,9 +2779,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -2284,7 +2791,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -2345,7 +2852,10 @@
     "desc": "<p>Determine how to display the text when it&#39;s overflow on height.</p>\n<ul>\n<li><code class=\"codespan\">&#39;truncate&#39;</code> Truncate the overflow lines.</li>\n</ul>\n"
   },
   "data.tooltip.extraCssText": {
-    "desc": "<blockquote>\n<p><strong>Notice:</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>Extra CSS style for floating layer. The following is an example for adding shadow.</p>\n<pre><code class=\"lang-js\">extraCssText: &#39;box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);&#39;\n</code></pre>\n"
+    "desc": "\n\n\n\n\n<blockquote>\n<p><strong>Notice:</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>Extra CSS style for floating layer. The following is an example for adding shadow.</p>\n<pre><code class=\"lang-js\">extraCssText: &#39;box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);&#39;\n</code></pre>\n",
+    "uiControl": {
+      "type": "text"
+    }
   },
   "clip": {
     "desc": "\n\n\n\n<blockquote>\n<p>Since <code class=\"codespan\">v4.4.0</code></p>\n</blockquote>\n<p>If clip the overflow on the coordinate system. Clip results varies between series:</p>\n<ul>\n<li>Scatter:Ignore the symbols exceeds the coordinate system. Not clip the elements.</li>\n<li>Bar:Clip all the overflowed. With bar width kept.</li>\n<li>Line:Clip the overflowed line.</li>\n<li>Lines: Clip all the overflowed.</li>\n<li>Candlestick: Ignore the elements exceeds the coordinat [...]
@@ -2424,7 +2934,7 @@
     "desc": "<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The position of the tooltip&#39;s floating layer, which would follow the position of mouse by default.</p>\n<p>Options:</p>\n<ul>\n<li><p><code class=\"codespan\">Array</code></p>\n<p>  Display the position of tooltip&#39;s floating layer through array, which support [...]
   },
   "tooltip.formatter": {
-    "desc": "<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The content formatter of tooltip&#39;s floating layer which supports string template and callback function.</p>\n<p><strong>1. String template</strong></p>\n<p>The template variables are <code class=\"codespan\">{a}</code>, <code class=\"codespan\">{b}</code>, <code  [...]
+    "desc": "<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The content formatter of tooltip&#39;s floating layer which supports string template and callback function.</p>\n<p><strong>1. String template</strong></p>\n<p>The template variables are <code class=\"codespan\">{a}</code>, <code class=\"codespan\">{b}</code>, <code  [...]
   },
   "tooltip.backgroundColor": {
     "desc": "<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The background color of tooltip&#39;s floating layer.</p>\n"
@@ -2508,9 +3018,9 @@
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -2520,7 +3030,7 @@
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -2581,6 +3091,9 @@
     "desc": "<p>Determine how to display the text when it&#39;s overflow on height.</p>\n<ul>\n<li><code class=\"codespan\">&#39;truncate&#39;</code> Truncate the overflow lines.</li>\n</ul>\n"
   },
   "tooltip.extraCssText": {
-    "desc": "<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>Extra CSS style for floating layer. The following is an example for adding shadow.</p>\n<pre><code class=\"lang-js\">extraCssText: &#39;box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);&#39;\n</code></pre>\n"
+    "desc": "\n\n\n\n\n<p><br></p>\n<blockquote>\n<p><strong>Notice:</strong>series.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>Extra CSS style for floating layer. The following is an example for adding shadow.</p>\n<pre><code class=\"lang-js\">extraCssText: &#39;box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);&#39;\n</code></pre>\n",
+    "uiControl": {
+      "type": "text"
+    }
   }
 }
\ No newline at end of file
diff --git a/en/documents/option-parts/option.series-effectScatter.js b/en/documents/option-parts/option.series-effectScatter.js
index f7248e2..8d3aba3 100644
--- a/en/documents/option-parts/option.series-effectScatter.js
+++ b/en/documents/option-parts/option.series-effectScatter.js
@@ -172,7 +172,7 @@ window.__EC_DOC_option_series_effectScatter = {
     }
   },
   "label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -307,9 +307,9 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -319,7 +319,7 @@ window.__EC_DOC_option_series_effectScatter = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -833,7 +833,7 @@ window.__EC_DOC_option_series_effectScatter = {
     }
   },
   "emphasis.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "emphasis.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -968,9 +968,9 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -980,7 +980,7 @@ window.__EC_DOC_option_series_effectScatter = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1412,7 +1412,7 @@ window.__EC_DOC_option_series_effectScatter = {
     }
   },
   "blur.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "blur.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -1547,9 +1547,9 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1559,7 +1559,7 @@ window.__EC_DOC_option_series_effectScatter = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -1991,7 +1991,7 @@ window.__EC_DOC_option_series_effectScatter = {
     }
   },
   "select.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "select.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -2126,9 +2126,9 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -2138,7 +2138,7 @@ window.__EC_DOC_option_series_effectScatter = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -2759,9 +2759,9 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -2771,7 +2771,7 @@ window.__EC_DOC_option_series_effectScatter = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -3356,9 +3356,9 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -3368,7 +3368,7 @@ window.__EC_DOC_option_series_effectScatter = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -3932,9 +3932,9 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -3944,7 +3944,7 @@ window.__EC_DOC_option_series_effectScatter = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -4508,9 +4508,9 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -4520,7 +4520,7 @@ window.__EC_DOC_option_series_effectScatter = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -4913,7 +4913,7 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "<blockquote>\n<p><strong>Notice:</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The position of the tooltip&#39;s floating layer, which would follow the position of mouse by default.</p>\n<p>Options:</p>\n<ul>\n<li><p><code class=\"codespan\">Array</code></p>\n<p>  Display the position of tooltip&#39;s floating layer through array, which supports absolu [...]
   },
   "data.tooltip.formatter": {
-    "desc": "<blockquote>\n<p><strong>Notice:</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The content formatter of tooltip&#39;s floating layer which supports string template and callback function.</p>\n<p><strong>1. String template</strong></p>\n<p>The template variables are <code class=\"codespan\">{a}</code>, <code class=\"codespan\">{b}</code>, <code class=\" [...]
+    "desc": "<blockquote>\n<p><strong>Notice:</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The content formatter of tooltip&#39;s floating layer which supports string template and callback function.</p>\n<p><strong>1. String template</strong></p>\n<p>The template variables are <code class=\"codespan\">{a}</code>, <code class=\"codespan\">{b}</code>, <code class=\" [...]
   },
   "data.tooltip.backgroundColor": {
     "desc": "<blockquote>\n<p><strong>Notice:</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>The background color of tooltip&#39;s floating layer.</p>\n"
@@ -4997,9 +4997,9 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -5009,7 +5009,7 @@ window.__EC_DOC_option_series_effectScatter = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -5070,7 +5070,10 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "<p>Determine how to display the text when it&#39;s overflow on height.</p>\n<ul>\n<li><code class=\"codespan\">&#39;truncate&#39;</code> Truncate the overflow lines.</li>\n</ul>\n"
   },
   "data.tooltip.extraCssText": {
-    "desc": "<blockquote>\n<p><strong>Notice:</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>Extra CSS style for floating layer. The following is an example for adding shadow.</p>\n<pre><code class=\"lang-js\">extraCssText: &#39;box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);&#39;\n</code></pre>\n"
+    "desc": "\n\n\n\n\n<blockquote>\n<p><strong>Notice:</strong>series.data.tooltip only works when <a href=\"#tooltip.trigger\">tooltip.trigger</a> is <code class=\"codespan\">&#39;item&#39;</code>.<br></p>\n</blockquote>\n<p>Extra CSS style for floating layer. The following is an example for adding shadow.</p>\n<pre><code class=\"lang-js\">extraCssText: &#39;box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);&#39;\n</code></pre>\n",
+    "uiControl": {
+      "type": "text"
+    }
   },
   "markPoint": {
     "desc": "<p>Mark point in a chart.</p>\n"
@@ -5165,7 +5168,7 @@ window.__EC_DOC_option_series_effectScatter = {
     }
   },
   "markPoint.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markPoint.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -5300,9 +5303,9 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -5312,7 +5315,7 @@ window.__EC_DOC_option_series_effectScatter = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -5673,7 +5676,7 @@ window.__EC_DOC_option_series_effectScatter = {
     }
   },
   "markPoint.emphasis.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markPoint.emphasis.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -5808,9 +5811,9 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -5820,7 +5823,7 @@ window.__EC_DOC_option_series_effectScatter = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -6178,7 +6181,7 @@ window.__EC_DOC_option_series_effectScatter = {
     }
   },
   "markPoint.blur.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markPoint.blur.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -6313,9 +6316,9 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -6325,7 +6328,7 @@ window.__EC_DOC_option_series_effectScatter = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -6969,9 +6972,9 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -6981,7 +6984,7 @@ window.__EC_DOC_option_series_effectScatter = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -7397,9 +7400,9 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -7409,7 +7412,7 @@ window.__EC_DOC_option_series_effectScatter = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -7803,7 +7806,7 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -7924,9 +7927,9 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -7936,7 +7939,7 @@ window.__EC_DOC_option_series_effectScatter = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -8268,7 +8271,7 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.emphasis.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.emphasis.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -8389,9 +8392,9 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -8401,7 +8404,7 @@ window.__EC_DOC_option_series_effectScatter = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -8720,7 +8723,7 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.blur.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.blur.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -8841,9 +8844,9 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -8853,7 +8856,7 @@ window.__EC_DOC_option_series_effectScatter = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -9336,7 +9339,7 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.data.0.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.data.0.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -9457,9 +9460,9 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -9469,7 +9472,7 @@ window.__EC_DOC_option_series_effectScatter = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -9795,7 +9798,7 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.data.0.emphasis.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.data.0.emphasis.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -9916,9 +9919,9 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -9928,7 +9931,7 @@ window.__EC_DOC_option_series_effectScatter = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -10257,7 +10260,7 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.data.0.blur.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.data.0.blur.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -10378,9 +10381,9 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -10390,7 +10393,7 @@ window.__EC_DOC_option_series_effectScatter = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -10805,7 +10808,7 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.data.1.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.data.1.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -10926,9 +10929,9 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -10938,7 +10941,7 @@ window.__EC_DOC_option_series_effectScatter = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -11264,7 +11267,7 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.data.1.emphasis.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.data.1.emphasis.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -11385,9 +11388,9 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -11397,7 +11400,7 @@ window.__EC_DOC_option_series_effectScatter = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -11726,7 +11729,7 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "<p>The distance between labels and mark lines. If it&#39;s an array, then the first element is the horizontal distance, and the second element is the vertical distance. If it&#39;s a number, then the horizontal and vertical distances are the same.</p>\n"
   },
   "markLine.data.1.blur.label.formatter": {
-    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
+    "desc": "<p>Data label formatter, which supports string template and callback function. In either form, <code class=\"codespan\">\\n</code> is supported to represent a new line.</p>\n<p><strong>String template</strong></p>\n<p>Model variation includes:</p>\n<ul>\n<li><code class=\"codespan\">{a}</code>: series name.</li>\n<li><code class=\"codespan\">{b}</code>: the name of a data item.</li>\n<li><code class=\"codespan\">{c}</code>: the value of a data item.</li>\n<li><code class=\"c [...]
   },
   "markLine.data.1.blur.label.color": {
     "desc": "\n\n<p> text color.</p>\n<p>If set as <code class=\"codespan\">&#39;inherit&#39;</code>, the color will assigned as visual color, such as series color.</p>\n",
@@ -11847,9 +11850,9 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -11859,7 +11862,7 @@ window.__EC_DOC_option_series_effectScatter = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -12338,9 +12341,9 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -12350,7 +12353,7 @@ window.__EC_DOC_option_series_effectScatter = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -12843,9 +12846,9 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -12855,7 +12858,7 @@ window.__EC_DOC_option_series_effectScatter = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -13345,9 +13348,9 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -13357,7 +13360,7 @@ window.__EC_DOC_option_series_effectScatter = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -13969,9 +13972,9 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -13981,7 +13984,7 @@ window.__EC_DOC_option_series_effectScatter = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -14468,9 +14471,9 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -14480,7 +14483,7 @@ window.__EC_DOC_option_series_effectScatter = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -14970,9 +14973,9 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -14982,7 +14985,7 @@ window.__EC_DOC_option_series_effectScatter = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -15520,9 +15523,9 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -15532,7 +15535,7 @@ window.__EC_DOC_option_series_effectScatter = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -16019,9 +16022,9 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -16031,7 +16034,7 @@ window.__EC_DOC_option_series_effectScatter = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -16521,9 +16524,9 @@ window.__EC_DOC_option_series_effectScatter = {
     "desc": "\n\n<p>Width of text block.</p>\n",
     "uiControl": {
       "type": "number",
-      "default": "50",
+      "default": "100",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
     }
   },
@@ -16533,7 +16536,7 @@ window.__EC_DOC_option_series_effectScatter = {
       "type": "number",
       "default": "50",
       "min": "1",
-      "max": "200",
+      "max": "500",
       "step": "1"
... 41582 lines suppressed ...


---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org